%PDF- %PDF-
Direktori : /var/www/html/friendstravel.al/wp-content/uploads/nx/files/css/ |
Current File : /var/www/html/friendstravel.al/wp-content/uploads/nx/files/css/none2.css |
body, html { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; background-color: #f3f3f3; color: #333; font-size: 16px; direction: ltr; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } body { min-width: 320px; margin: 0 } body .member-header { min-width: 190px } body>.bd { min-height: 400px; min-width: 320px; margin: 30px 30px 0 } h1 { font-size: 27px; margin: 0 0 .4em } h2, h3, h4, h5 { margin: .75em 0 .25em } h2 { font-size: 20px } h3 { font-size: 18px } h4 { font-size: 16px } h5 { font-size: 14px } @media screen and (min-width:740px) { h1 { font-size: 38px } h2 { font-size: 27px } h3 { font-size: 23px } h4 { font-size: 19px } h5 { font-size: 16px; text-shadow: 0 0 1px rgba(0, 0, 0, .3) } } .centerContainer { margin: 0 auto 15px; padding: 20px 3% 60px; max-width: 978px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .centerContainer.smallForm { max-width: 500px } .bold, strong { font-weight: 700 } .clearfix:after { content: ' '; display: block; width: 0; height: 0; overflow: hidden; clear: both } .nowrap { white-space: nowrap } a { text-decoration: none; color: #0071eb } a:hover { text-decoration: underline } ul { padding: 0 } ul>li { margin-left: 1.1em; margin-bottom: 5px; list-style-type: disc } ul.structural { padding: 0; margin: 0 } ul.structural>li { list-style: none; margin-left: 0 } .pointer { cursor: pointer } img { max-width: 100%; height: auto; border: 0 } .screen-reader-text { position: absolute; top: -9999px; left: -9999px } .pt-header-cell * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .centerContainer .planTable { text-align: right } @media only screen and (max-width:600px) { .centerContainer .planTable { text-align: center; width: 90vw; margin: 0 auto } } .planTable .columnHeader { text-align: left } @media only screen and (max-width:600px) { .planTable .columnHeader { text-align: center } } .pt-header-cell.pt-header-cell.pt-header-cell.pt-header-cell { cursor: pointer; position: relative; display: inline-block; text-align: center; vertical-align: middle; width: 18%; font-size: 19px; height: 110px; background-color: #0071eb; color: #fff; margin: 0 23px } @media only screen and (max-width:768px) { .pt-header-cell.pt-header-cell.pt-header-cell.pt-header-cell { margin: 0 20px } } @media only screen and (max-width:600px) { .pt-header-cell.pt-header-cell.pt-header-cell.pt-header-cell { width: 30%; border-right: 0; margin: 0 5% 0 0; display: inline-block } .pt-header-cell.pt-header-cell.pt-header-cell.pt-header-cell:last-child { margin-right: 0 } } .pt-header-cell.pt-header-cell.pt-header-cell.pt-header-cell.selected.selected { background-color: #0071eb; color: #fff } .pt-header-box { position: absolute; top: 40%; text-align: center; width: 100% } .headerRow.fix.pt-header-row-wide-fix { width: 97%; margin-right: 0 } .pt-header-with-border.selected .pt-header-box-border { position: absolute; top: -41px; left: 3px; right: 3px; bottom: 3px; border: 2px solid #fff; width: 96%; height: 104px } @media only screen and (max-width:600px) { .pt-header-with-border.selected .pt-header-box-border { width: 94% } } .pt-header-badge { font-weight: 700; position: absolute; width: 100%; padding: 5px; text-align: center; font-size: 11px; top: 4px } .pt-cell-content { display: inline-block; font-size: 16px } @media only screen and (max-width:400px) { .pt-cell-content { font-size: 14px } } @media only screen and (max-width:370px) { .pt-header-badge-wings { font-size: 11px; padding: 3px 1px; font-weight: 400 } .pt-header-cell.pt-header-cell.pt-header-cell.pt-header-cell { font-size: 16px } } .pt-header-badge-wings { background-color: #74a1d8; position: absolute; padding: 5px 2px 6px 2px; right: -7.5px; left: -7.5px; top: -41px } .pt-header-badge-wings:after, .pt-header-badge-wings:before { content: ""; position: absolute; bottom: -8px; border-bottom: 8.5px solid transparent } .pt-header-badge-wings:before { left: 0; border-right: 8.5px solid #6b86a1 } .pt-header-badge-wings:after { right: 0; border-left: 8.5px solid #6b86a1 } .selected .pt-header-badge-wings { background-color: #0763be } .selected .pt-header-badge-wings:before { border-right: 8.5px solid #033562 } .selected .pt-header-badge-wings:after { border-left: 8.5px solid #033562 } .pt-header-fix-table { display: none } @media only screen and (max-width:600px) { .pt-header-fix-table { display: table; left: 1.6%; width: 92.5%; border-collapse: collapse; position: fixed; margin-right: 11px; padding-bottom: 5px; -webkit-overflow-scrolling: touch; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); top: 0; z-index: 10; margin-left: 5px } .pt-header-fix-table .headerRow { background-color: #e6e6e6; display: none } .pt-header-fix-table .headerRow.show { display: table-row } .centerContainer.basicRegReducedTitleSize>div>p { font-size: 16px } } .pt-header-box-arrow { display: inline-block; width: 40px; border-top: 15px solid #0071eb; border-left: 20px solid transparent; border-right: 20px solid transparent } .pt-header-box-arrow-container { display: none; position: absolute; bottom: -63px; text-align: center; width: 100% } .selected .pt-header-box-arrow-container { display: block } .pt-header-badge-image { width: 100%; margin: 2px auto 1px auto; height: 10px; -moz-background-size: contain; background-size: contain; background-position: center; background-repeat: no-repeat } @media only screen and (max-width:400px) { .pt-header-badge-image { width: 90% } } @media only screen and (max-width:600px) { .alt { margin: -8px 0 5px 0 } .planTableOptionsReduceSpace.planTableOptions.planTable { border-spacing: 0 10px; top: 30px } .planTableOptionsReduceSpace.planTableOptions.planTable .row { display: block } .planTableOptionsReduceSpace.planTableOptions.planTable .bodyCell { display: inline-block; width: 27%; margin-bottom: 20px } .planTableOptionsReduceSpace.planTableOptions.planTable .alt { display: block; margin: -8px 0 5px 0; position: relative } } .ios-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1200; background-color: #000; opacity: .5 } .ios-modal { position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: #eee; min-height: 80px; width: 275px; z-index: 1201; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px } .ios-modal.with-buttons { padding-bottom: 70px } .ios-modal .modal-title { margin-top: 20px; text-align: center } .ios-modal .modal-title h3 { font-weight: 700; font-size: 18px } .ios-modal .modal-message { text-align: center; font-size: 15px; padding: 0 10px; min-height: 50px } .ios-modal .modal-buttons { position: absolute; bottom: 0; width: 100%; border-top: 1px solid #d3d7d7 } .ios-modal .modal-buttons.no-button { display: none } .ios-modal .modal-buttons.single-button { text-align: center } .ios-modal .modal-buttons .modal-btn { text-align: center; display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 15px; color: #0e94fc; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .ios-modal .modal-buttons .modal-btn:active { background-color: #e4e8e8 } .ios-modal .modal-buttons .modal-btn-cancel { -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px } .ios-modal .modal-buttons .modal-btn-ok { -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomright: 10px; border-bottom-right-radius: 10px } .ios-modal .modal-buttons.double-button .modal-btn { width: 50% } .ios-modal .modal-buttons.double-button .modal-btn:first-child { border-right: 1px solid #d3d7d7 } .planTable { display: table; width: 100%; margin: 0; border-collapse: collapse } .planTable .row { display: table-row; border-bottom: 1px solid #ccc } .planTable .row [class*=" icon-"], .planTable .row [class^=icon-] { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none } .planTable .row:last-child { border-bottom: none } .planTable .alt { display: none } .planTable .columnHeader { display: table-cell; padding: 12px 15px; height: 60px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; vertical-align: middle } .planTable .cell { display: table-cell; text-align: center; vertical-align: middle; width: 20% } .planTable .bodyCell { padding: 15px; color: #a6a6a6; fill: #a6a6a6 } .planTable .bodyCell .svg-icon { display: inline-block; height: 18px; width: 18px; -webkit-transform: translateY(2px); -moz-transform: translateY(2px); -ms-transform: translateY(2px); -o-transform: translateY(2px); transform: translateY(2px) } .planTable .bodyCell .svg-icon-uhd-filled { width: 70px; height: 15px } .planTable .bodyCell .svg-icon-hd-filled { width: 28px; height: 15px } .planTable .bodyCell .svg-icon-hd-open { width: 25px; height: 18px; stroke: #a6a6a6 } .planTable .bodyCell .svg-icon-uhd-open { width: 65px; height: 18px; stroke: #a6a6a6 } .planTable .bodyCell.icon-circle-solid { font-size: .65em } .planTable .planNumProfiles .bodyCell { padding: 10px; font-size: 13px } .planTable .planNumProfiles .svg-icon { display: block; margin: 0 auto; padding: 0; width: 60px; height: 24px; stroke: #fff; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none } .planTable .pictureQuality .columnHeader { padding: 15px } .hdAvail { color: #737373; font-weight: 400; font-size: 13px; margin: 10px 0 0 0; text-align: left; white-space: normal; display: block } .planSelectionContainer { display: table; width: 100% } .planSelectionContainer .arrow { border-left: 10px solid transparent; border-right: 10px solid transparent; border-top: 10px solid #e50914; margin: -3px auto 0; width: 0; height: 0; visibility: hidden } .planSelectionContainer .show .selected .arrow { visibility: visible } .planSelectionContainer .headerRow { display: table-row; padding-top: 5px; font-size: 19px } .planSelectionContainer .headerRow.fix { display: none } .planSelectionContainer .headerRow .cellContent { display: inline-block; width: 120px; height: 120px; line-height: 120px; background-color: #e50914; opacity: .6; color: #fff; text-align: center; vertical-align: middle; cursor: pointer } .planSelectionContainer .selborder { padding: 3px; border: 2px solid transparent; max-width: 120px; margin: 0 auto } .planSelectionContainer .selected { color: #e50914; fill: #e50914 } .planSelectionContainer .selected .arrow { border-top-color: #e50914 } .planSelectionContainer .selected .cellContent { opacity: 1; background: #e50914 } .planSelectionContainer .selected .selborder { border: 2px solid } .planSelectionContainer .selected .svg-icon-hd-open, .planSelectionContainer .selected .svg-icon-uhd-open { stroke: #e50914 } .planSelectionContainer.has4Plans .planTable .bodyCell, .planSelectionContainer.has4Plans .planTable .headerRow .cell { width: 16.4% } @media only screen and (max-width:950px) { .planTable .selected .selborder { max-width: 90px } .planTable .headerRow .cellContent { width: 90px; height: 90px; line-height: 90px; font-size: 13px } } @media only screen and (min-width:600px) { .planSelectionContainer .headerMarker { display: none } } @media only screen and (max-width:600px) { h1 { font-size: 23px } .planTableOptions { border-spacing: 0 27px; border-collapse: separate; position: relative; top: -5px } .planTable .row { border-bottom: none } .planTable .alt { display: block; text-align: center; width: 100%; position: absolute; font-size: 13px } .planTable .row .cell { border-right: 1px solid #ccc } .planTable .row .cell:last-child { border-right: none } .planTable .columnHeader { display: none } .planTable .bodyCell { width: 33%; padding: 8px; height: 36px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .planTable .planNumProfiles .bodyCell { padding: 0 } .planSelectionContainer { padding-top: 5px } .planSelectionContainer .arrow { border-left-width: 15px; border-right-width: 15px; border-top-width: 14px; margin: 0 auto } .planSelectionContainer .headerRow { width: 94%; visibility: hidden } .planSelectionContainer .headerRow.show { visibility: visible } .planSelectionContainer .headerRow .cell { padding-bottom: 0; width: 17% } .planSelectionContainer .headerRow.fix { display: table-row; padding-bottom: 5px; -webkit-overflow-scrolling: touch; position: fixed; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); top: 0; background-color: #f3f3f3; z-index: 10; width: 90vw } .planSelectionContainer.has4Plans .planTable .bodyCell, .planSelectionContainer.has4Plans .planTable .headerRow .cell { width: 25% } .planSelectionContainer.has4Plans .planTable .headerRow .cellContent { font-size: 14px } .iosInApp .planSelectionContainer .headerRow.fix { top: 75px } } @media only screen and (max-width:450px) { .iosInApp .planSelectionContainer .headerRow.fix { top: 45px } } @-webkit-keyframes fadeIn { 0% { opacity: 0; padding-top: 30px } 100% { padding-top: 10px; opacity: 1 } } @-moz-keyframes fadeIn { 0% { opacity: 0; padding-top: 30px } 100% { padding-top: 10px; opacity: 1 } } @-o-keyframes fadeIn { 0% { opacity: 0; padding-top: 30px } 100% { padding-top: 10px; opacity: 1 } } @keyframes fadeIn { 0% { opacity: 0; padding-top: 30px } 100% { padding-top: 10px; opacity: 1 } } .fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; -webkit-animation-duration: .5s; -moz-animation-duration: .5s; -o-animation-duration: .5s; animation-duration: .5s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both } .loadingText { text-align: center; height: 80px; font-weight: 700 } .loadingText .loadingTextContent { opacity: 0; padding-top: 30px } .fadedTable { opacity: .3; pointer-events: none } .input-message { font-size: 12px; position: absolute; bottom: 0; height: 32px; left: 0; color: #999 } .input-message.error { color: #b00500 } .input-message a { color: inherit; text-decoration: underline } .dark .input-message.error { color: #fff } .dark .input-message.warning { color: #f7f7f7 } .nfCompactInput, .ui-label, .ui-label-no-margin { font-size: 1em; font-weight: 400; color: grey; display: block } @media only screen and (max-width:740px) { .nfCompactInput, .ui-label, .ui-label-no-margin { font-size: .875em } } .nfCompactInput.inline, .ui-label-no-margin.inline, .ui-label.inline { display: inline-block } .nfCompactInput.inline .ui-text-input, .ui-label-no-margin.inline .ui-text-input, .ui-label.inline .ui-text-input { margin-bottom: 0 } .nfCompactInput.nmHomeTextInput .ui-label-text, .ui-label-no-margin.nmHomeTextInput .ui-label-text, .ui-label.nmHomeTextInput .ui-label-text { margin-right: 1ex } .nfCompactInput.nmHomeTextInput .input-password-input, .nfCompactInput.nmHomeTextInput .ui-text-input, .ui-label-no-margin.nmHomeTextInput .input-password-input, .ui-label-no-margin.nmHomeTextInput .ui-text-input, .ui-label.nmHomeTextInput .input-password-input, .ui-label.nmHomeTextInput .ui-text-input { height: 60px; background-color: rgba(0, 0, 0, .8); border-color: #4d4d4d; font-size: 24px; color: #fff } .ui-label { margin-bottom: 6px } .icon-error { color: #b00500 } .icon-valid { color: #5fa53f } .ui-input-wrapper { display: inline-block; margin: 0; padding: 0 } @media only screen and (max-width:500px) { .ui-input-wrapper { display: block } } .ui-input-label { padding-bottom: 32px; position: relative } .ui-readonly-value { padding: 10px 0; margin-bottom: 20px; color: #333 } .input-password-input, .ui-text-input { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 16px; border: solid 1px #b3b3b3; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; display: block; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; max-width: 500px; color: #000; padding: 10px 11px; height: 44px } .input-password-input.large, .ui-text-input.large { padding: 14px 11px } @media only screen and (max-width:740px) { .input-password-input.large, .ui-text-input.large { font-size: 1em; padding: 11px } } .input-password-input.small, .ui-text-input.small { padding: 5px 8px; font-size: 14px } @media only screen and (max-width:740px) { .input-password-input.small, .ui-text-input.small { font-size: 1em; padding: 8px 11px } } .input-password-input:focus, .ui-text-input:focus { border-color: grey; outline: 0 } .error>.input-password-input, .error>.ui-text-input, .input-password-input.error, .input-password-inputerror:focus, .ui-text-input.error, .ui-text-inputerror:focus { border-color: #b00500 } .input-password-input.valid, .ui-text-input.valid, .valid>.input-password-input, .valid>.ui-text-input { border-color: #5fa53f } .input-password-input.inline, .ui-text-input.inline { display: inline-block; vertical-align: middle; margin: 0; width: auto; max-width: 100%; margin-right: 12px } .input-password-input.inline.medium, .ui-text-input.inline.medium { margin-right: 8px } .input-password-input.inline.small, .ui-text-input.inline.small { margin-right: 4px } .ui-input-label .ui-text-input+.icon-lock { position: absolute; bottom: 20px; color: #9e9e9e; font-size: 1.2em; right: 10px } .floating-label.ui-input-label { padding-bottom: 0 } .floating-label .ui-label-text { position: absolute; top: 18px; left: 11px } .floating-label.active .ui-label-text { top: 3px; font-size: .8em } .floating-label .ui-text-input.error:focus { border-color: #b00500 } .floating-label .ui-text-input.valid:focus { border-color: #5fa53f } .floating-label .ui-text-input:focus { border-color: #0f84fa } .floating-label .ui-text-input.medium { padding: 15px 11px 5px } .nfCompactInput { padding: 2px 0 10px; position: relative; min-height: 80px } .nfCompactInput .placeLabel { position: absolute; top: 16px; left: 10px; color: #999; font-size: 20px; -webkit-transition: font .2s ease, top .2s ease; -o-transition: font .2s ease, top .2s ease; -moz-transition: font .2s ease, top .2s ease; transition: font .2s ease, top .2s ease } .nfCompactInput input[type=text] { height: 54px; padding: 10px 2px 0 } .nfCompactInput .hasText+.placeLabel, .nfCompactInput input[type=text]:focus+.placeLabel { top: 4px; font-size: 11px } .nfCompactInput .inputError { font-size: 12px; color: #b00500 } .dark .nfCompactInput .ui-text-input.error { border-color: #ffa100 } .dark .nfCompactInput .inputError { color: #ffa100 } .ui-select-wrapper { padding: 0; margin: 0; border: solid 1px #b3b3b3; cursor: pointer; width: 100%; position: relative } .ui-select-wrapper:after { font-family: nf-icon; color: #000; font-size: 6px; content: '\e898'; position: absolute; pointer-events: none; right: 10px; top: 17px } .ui-select-wrapper.ui-select-wrapper-open:after { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg) } @media only screen AND (min-width:740px) { .ui-select-wrapper { max-width: 600px } } .ui-select-wrapper .native-select { position: absolute; opacity: 0; bottom: 0; height: 100% } .ui-select-wrapper-link { padding: 0; margin: 0; text-decoration: none; display: block; color: #333 } .ui-select-wrapper-link:hover { text-decoration: none } .ui-select-current { padding: 10px 20px 10px 10px; margin: 0; position: relative; height: 42px; width: 100%; background: #fff } .ui-select-current:after { content: ''; visibility: hidden } .ui-select-options-hidden { display: none } .ui-select-item-highlighted { background-color: #f3f3f3 } .ui-select-item-selected { font-weight: 700 } .ui-select-item { list-style: none; margin: 0; padding: 10px } .ui-select-item-link { color: #333; text-decoration: none } .ui-select-item-link:hover { text-decoration: none } .ui-select-item:hover { background-color: #f3f3f3 } .ui-select-options { margin: 1px 0 0 0; padding: 0; position: absolute; top: 40px; left: -1px; width: 100%; border: 1px solid #ccc; margin-top: -1px; background: #fff; z-index: 2; max-height: 500px; overflow-y: scroll; overflow-x: hidden } .ui-select-wrapper { display: inline-block; position: relative } .ui-select-wrapper>.ui-label { margin-bottom: 0 } .ui-select-wrapper .select-arrow { position: relative; display: inline-block; width: 100% } .ui-select-wrapper .select-arrow::after { font-family: nf-icon; color: #000; font-size: 6px; content: '\e898'; position: absolute; pointer-events: none } .ui-select-wrapper .select-arrow.medium::after { right: 10px; top: 18px } .ui-select-wrapper .select-arrow.medium::before { top: 11px; left: 15px } .ui-select-wrapper .select-arrow.prefix.globe::before { content: '\e896' } .ui-select-wrapper .select-arrow.prefix::before { font-family: nf-icon; color: #000; font-size: 16px; position: absolute; pointer-events: none } .ui-select-wrapper .select-arrow.prefix .ui-select.medium { padding-left: 50px; text-indent: 2px; line-height: 1.7 } .ui-select { background: #fff; font-size: 16px; border: 1px solid #b3b3b3; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; width: 100% } .ui-select::-ms-expand { display: none } .ui-select.error { border-color: #b00500 } .ui-select.valid { border-color: #5fa53f } .ui-select.medium { padding: 12px } .nf-flag { background-image: url(https://assets.nflxext.com/ffe/siteui/common/icons/flags/flag-sprite-v4.png); background-repeat: no-repeat; display: block } .nf-flag.nf-flag-ad { background-position: -5px -5px; width: 16px; height: 11px } .nf-flag.nf-flag-ae { background-position: -5px -26px; width: 16px; height: 11px } .nf-flag.nf-flag-af { background-position: -5px -47px; width: 16px; height: 11px } .nf-flag.nf-flag-ag { background-position: -5px -68px; width: 16px; height: 11px } .nf-flag.nf-flag-ai { background-position: -5px -89px; width: 16px; height: 11px } .nf-flag.nf-flag-al { background-position: -5px -110px; width: 16px; height: 11px } .nf-flag.nf-flag-am { background-position: -5px -131px; width: 16px; height: 11px } .nf-flag.nf-flag-an { background-position: -5px -152px; width: 16px; height: 11px } .nf-flag.nf-flag-ao { background-position: -5px -173px; width: 16px; height: 11px } .nf-flag.nf-flag-ar { background-position: -5px -194px; width: 16px; height: 11px } .nf-flag.nf-flag-as { background-position: -5px -215px; width: 16px; height: 11px } .nf-flag.nf-flag-at { background-position: -5px -236px; width: 16px; height: 11px } .nf-flag.nf-flag-au { background-position: -5px -257px; width: 16px; height: 11px } .nf-flag.nf-flag-aw { background-position: -5px -278px; width: 16px; height: 11px } .nf-flag.nf-flag-ax { background-position: -5px -299px; width: 16px; height: 11px } .nf-flag.nf-flag-az { background-position: -5px -320px; width: 16px; height: 11px } .nf-flag.nf-flag-ba { background-position: -5px -341px; width: 16px; height: 11px } .nf-flag.nf-flag-bb { background-position: -5px -362px; width: 16px; height: 11px } .nf-flag.nf-flag-bd { background-position: -5px -383px; width: 16px; height: 11px } .nf-flag.nf-flag-be { background-position: -5px -404px; width: 16px; height: 11px } .nf-flag.nf-flag-bf { background-position: -5px -425px; width: 16px; height: 11px } .nf-flag.nf-flag-bg { background-position: -5px -446px; width: 16px; height: 11px } .nf-flag.nf-flag-bh { background-position: -5px -467px; width: 16px; height: 11px } .nf-flag.nf-flag-bi { background-position: -5px -488px; width: 16px; height: 11px } .nf-flag.nf-flag-bj { background-position: -5px -509px; width: 16px; height: 11px } .nf-flag.nf-flag-bl { background-position: -5px -530px; width: 16px; height: 11px } .nf-flag.nf-flag-bm { background-position: -5px -551px; width: 16px; height: 11px } .nf-flag.nf-flag-bn { background-position: -5px -572px; width: 16px; height: 11px } .nf-flag.nf-flag-bo { background-position: -5px -593px; width: 16px; height: 11px } .nf-flag.nf-flag-bq { background-position: -5px -614px; width: 16px; height: 11px } .nf-flag.nf-flag-br { background-position: -5px -635px; width: 16px; height: 11px } .nf-flag.nf-flag-bs { background-position: -5px -656px; width: 16px; height: 11px } .nf-flag.nf-flag-bt { background-position: -5px -677px; width: 16px; height: 11px } .nf-flag.nf-flag-bv { background-position: -5px -698px; width: 16px; height: 11px } .nf-flag.nf-flag-bw { background-position: -5px -719px; width: 16px; height: 11px } .nf-flag.nf-flag-by { background-position: -5px -740px; width: 16px; height: 11px } .nf-flag.nf-flag-bz { background-position: -5px -761px; width: 16px; height: 11px } .nf-flag.nf-flag-ca { background-position: -5px -782px; width: 16px; height: 11px } .nf-flag.nf-flag-catalonia { background-position: -5px -803px; width: 16px; height: 11px } .nf-flag.nf-flag-cc { background-position: -5px -824px; width: 16px; height: 11px } .nf-flag.nf-flag-cd { background-position: -5px -845px; width: 16px; height: 11px } .nf-flag.nf-flag-cf { background-position: -5px -866px; width: 16px; height: 11px } .nf-flag.nf-flag-cg { background-position: -5px -887px; width: 16px; height: 11px } .nf-flag.nf-flag-ch { background-position: -5px -908px; width: 11px; height: 11px } .nf-flag.nf-flag-ci { background-position: -5px -929px; width: 16px; height: 11px } .nf-flag.nf-flag-ck { background-position: -5px -950px; width: 16px; height: 11px } .nf-flag.nf-flag-cl { background-position: -5px -971px; width: 16px; height: 11px } .nf-flag.nf-flag-cm { background-position: -5px -992px; width: 16px; height: 11px } .nf-flag.nf-flag-cn { background-position: -5px -1013px; width: 16px; height: 11px } .nf-flag.nf-flag-co { background-position: -5px -1034px; width: 16px; height: 11px } .nf-flag.nf-flag-cr { background-position: -5px -1055px; width: 16px; height: 11px } .nf-flag.nf-flag-cs { background-position: -5px -1076px; width: 16px; height: 11px } .nf-flag.nf-flag-cu { background-position: -5px -1097px; width: 16px; height: 11px } .nf-flag.nf-flag-cv { background-position: -5px -1118px; width: 16px; height: 11px } .nf-flag.nf-flag-cw { background-position: -5px -1139px; width: 16px; height: 11px } .nf-flag.nf-flag-cx { background-position: -5px -1160px; width: 16px; height: 11px } .nf-flag.nf-flag-cy { background-position: -5px -1181px; width: 16px; height: 11px } .nf-flag.nf-flag-cz { background-position: -5px -1202px; width: 16px; height: 11px } .nf-flag.nf-flag-de { background-position: -5px -1223px; width: 16px; height: 11px } .nf-flag.nf-flag-dj { background-position: -5px -1244px; width: 16px; height: 11px } .nf-flag.nf-flag-dk { background-position: -5px -1265px; width: 16px; height: 11px } .nf-flag.nf-flag-dm { background-position: -5px -1286px; width: 16px; height: 11px } .nf-flag.nf-flag-do { background-position: -5px -1307px; width: 16px; height: 11px } .nf-flag.nf-flag-dz { background-position: -5px -1328px; width: 16px; height: 11px } .nf-flag.nf-flag-ec { background-position: -5px -1349px; width: 16px; height: 11px } .nf-flag.nf-flag-ee { background-position: -5px -1370px; width: 16px; height: 11px } .nf-flag.nf-flag-eg { background-position: -5px -1391px; width: 16px; height: 11px } .nf-flag.nf-flag-eh { background-position: -5px -1412px; width: 16px; height: 11px } .nf-flag.nf-flag-england { background-position: -5px -1433px; width: 16px; height: 11px } .nf-flag.nf-flag-er { background-position: -5px -1454px; width: 16px; height: 11px } .nf-flag.nf-flag-es { background-position: -5px -1475px; width: 16px; height: 11px } .nf-flag.nf-flag-et { background-position: -5px -1496px; width: 16px; height: 11px } .nf-flag.nf-flag-europeanunion { background-position: -5px -1517px; width: 16px; height: 11px } .nf-flag.nf-flag-fam { background-position: -5px -1538px; width: 16px; height: 11px } .nf-flag.nf-flag-fi { background-position: -5px -1559px; width: 16px; height: 11px } .nf-flag.nf-flag-fj { background-position: -5px -1580px; width: 16px; height: 11px } .nf-flag.nf-flag-fk { background-position: -5px -1601px; width: 16px; height: 11px } .nf-flag.nf-flag-fm { background-position: -5px -1622px; width: 16px; height: 11px } .nf-flag.nf-flag-fo { background-position: -5px -1643px; width: 16px; height: 11px } .nf-flag.nf-flag-fr { background-position: -5px -1664px; width: 16px; height: 11px } .nf-flag.nf-flag-ga { background-position: -5px -1685px; width: 16px; height: 11px } .nf-flag.nf-flag-gb { background-position: -5px -1706px; width: 16px; height: 11px } .nf-flag.nf-flag-gd { background-position: -5px -1727px; width: 16px; height: 11px } .nf-flag.nf-flag-ge { background-position: -5px -1748px; width: 16px; height: 11px } .nf-flag.nf-flag-gf { background-position: -5px -1769px; width: 16px; height: 11px } .nf-flag.nf-flag-gg { background-position: -5px -1790px; width: 16px; height: 11px } .nf-flag.nf-flag-gh { background-position: -5px -1811px; width: 16px; height: 11px } .nf-flag.nf-flag-gi { background-position: -5px -1832px; width: 16px; height: 11px } .nf-flag.nf-flag-gl { background-position: -5px -1853px; width: 16px; height: 11px } .nf-flag.nf-flag-gm { background-position: -5px -1874px; width: 16px; height: 11px } .nf-flag.nf-flag-gn { background-position: -5px -1895px; width: 16px; height: 11px } .nf-flag.nf-flag-gp { background-position: -5px -1916px; width: 16px; height: 11px } .nf-flag.nf-flag-gq { background-position: -5px -1937px; width: 16px; height: 11px } .nf-flag.nf-flag-gr { background-position: -5px -1958px; width: 16px; height: 11px } .nf-flag.nf-flag-gs { background-position: -5px -1979px; width: 16px; height: 11px } .nf-flag.nf-flag-gt { background-position: -5px -2000px; width: 16px; height: 11px } .nf-flag.nf-flag-gu { background-position: -5px -2021px; width: 16px; height: 11px } .nf-flag.nf-flag-gw { background-position: -5px -2042px; width: 16px; height: 11px } .nf-flag.nf-flag-gy { background-position: -5px -2063px; width: 16px; height: 11px } .nf-flag.nf-flag-hk { background-position: -5px -2084px; width: 16px; height: 11px } .nf-flag.nf-flag-hm { background-position: -5px -2105px; width: 16px; height: 11px } .nf-flag.nf-flag-hn { background-position: -5px -2126px; width: 16px; height: 11px } .nf-flag.nf-flag-hr { background-position: -5px -2147px; width: 16px; height: 11px } .nf-flag.nf-flag-ht { background-position: -5px -2168px; width: 16px; height: 11px } .nf-flag.nf-flag-hu { background-position: -5px -2189px; width: 16px; height: 11px } .nf-flag.nf-flag-id { background-position: -5px -2210px; width: 16px; height: 11px } .nf-flag.nf-flag-ie { background-position: -5px -2231px; width: 16px; height: 11px } .nf-flag.nf-flag-il { background-position: -5px -2252px; width: 16px; height: 11px } .nf-flag.nf-flag-im { background-position: -5px -2273px; width: 16px; height: 11px } .nf-flag.nf-flag-in { background-position: -5px -2294px; width: 16px; height: 11px } .nf-flag.nf-flag-io { background-position: -5px -2315px; width: 16px; height: 11px } .nf-flag.nf-flag-iq { background-position: -5px -2336px; width: 16px; height: 11px } .nf-flag.nf-flag-ir { background-position: -5px -2357px; width: 16px; height: 11px } .nf-flag.nf-flag-is { background-position: -5px -2378px; width: 16px; height: 11px } .nf-flag.nf-flag-it { background-position: -5px -2399px; width: 16px; height: 11px } .nf-flag.nf-flag-je { background-position: -5px -2420px; width: 16px; height: 11px } .nf-flag.nf-flag-jm { background-position: -5px -2441px; width: 16px; height: 11px } .nf-flag.nf-flag-jo { background-position: -5px -2462px; width: 16px; height: 11px } .nf-flag.nf-flag-jp { background-position: -5px -2483px; width: 16px; height: 11px } .nf-flag.nf-flag-ke { background-position: -5px -2504px; width: 16px; height: 11px } .nf-flag.nf-flag-kg { background-position: -5px -2525px; width: 16px; height: 11px } .nf-flag.nf-flag-kh { background-position: -5px -2546px; width: 16px; height: 11px } .nf-flag.nf-flag-ki { background-position: -5px -2567px; width: 16px; height: 11px } .nf-flag.nf-flag-km { background-position: -5px -2588px; width: 16px; height: 11px } .nf-flag.nf-flag-kn { background-position: -5px -2609px; width: 16px; height: 11px } .nf-flag.nf-flag-kp { background-position: -5px -2630px; width: 16px; height: 11px } .nf-flag.nf-flag-kr { background-position: -5px -2651px; width: 16px; height: 11px } .nf-flag.nf-flag-kw { background-position: -5px -2672px; width: 16px; height: 11px } .nf-flag.nf-flag-ky { background-position: -5px -2693px; width: 16px; height: 11px } .nf-flag.nf-flag-kz { background-position: -5px -2714px; width: 16px; height: 11px } .nf-flag.nf-flag-la { background-position: -5px -2735px; width: 16px; height: 11px } .nf-flag.nf-flag-lb { background-position: -5px -2756px; width: 16px; height: 11px } .nf-flag.nf-flag-lc { background-position: -5px -2777px; width: 16px; height: 11px } .nf-flag.nf-flag-li { background-position: -5px -2798px; width: 16px; height: 11px } .nf-flag.nf-flag-lk { background-position: -5px -2819px; width: 16px; height: 11px } .nf-flag.nf-flag-lr { background-position: -5px -2840px; width: 16px; height: 11px } .nf-flag.nf-flag-ls { background-position: -5px -2861px; width: 16px; height: 11px } .nf-flag.nf-flag-lt { background-position: -5px -2882px; width: 16px; height: 11px } .nf-flag.nf-flag-lu { background-position: -5px -2903px; width: 16px; height: 11px } .nf-flag.nf-flag-lv { background-position: -5px -2924px; width: 16px; height: 11px } .nf-flag.nf-flag-ly { background-position: -5px -2945px; width: 16px; height: 11px } .nf-flag.nf-flag-ma { background-position: -5px -2966px; width: 16px; height: 11px } .nf-flag.nf-flag-mc { background-position: -5px -2987px; width: 16px; height: 11px } .nf-flag.nf-flag-md { background-position: -5px -3008px; width: 16px; height: 11px } .nf-flag.nf-flag-me { background-position: -5px -3029px; width: 16px; height: 12px } .nf-flag.nf-flag-mf { background-position: -5px -3051px; width: 16px; height: 11px } .nf-flag.nf-flag-mg { background-position: -5px -3072px; width: 16px; height: 11px } .nf-flag.nf-flag-mh { background-position: -5px -3093px; width: 16px; height: 11px } .nf-flag.nf-flag-mk { background-position: -5px -3114px; width: 16px; height: 11px } .nf-flag.nf-flag-ml { background-position: -5px -3135px; width: 16px; height: 11px } .nf-flag.nf-flag-mm { background-position: -5px -3156px; width: 16px; height: 11px } .nf-flag.nf-flag-mn { background-position: -5px -3177px; width: 16px; height: 11px } .nf-flag.nf-flag-mo { background-position: -5px -3198px; width: 16px; height: 11px } .nf-flag.nf-flag-mp { background-position: -5px -3219px; width: 16px; height: 11px } .nf-flag.nf-flag-mq { background-position: -5px -3240px; width: 16px; height: 11px } .nf-flag.nf-flag-mr { background-position: -5px -3261px; width: 16px; height: 11px } .nf-flag.nf-flag-ms { background-position: -5px -3282px; width: 16px; height: 11px } .nf-flag.nf-flag-mt { background-position: -5px -3303px; width: 16px; height: 11px } .nf-flag.nf-flag-mu { background-position: -5px -3324px; width: 16px; height: 11px } .nf-flag.nf-flag-mv { background-position: -5px -3345px; width: 16px; height: 11px } .nf-flag.nf-flag-mw { background-position: -5px -3366px; width: 16px; height: 11px } .nf-flag.nf-flag-mx { background-position: -5px -3387px; width: 16px; height: 11px } .nf-flag.nf-flag-my { background-position: -5px -3408px; width: 16px; height: 11px } .nf-flag.nf-flag-mz { background-position: -5px -3429px; width: 16px; height: 11px } .nf-flag.nf-flag-na { background-position: -5px -3450px; width: 16px; height: 11px } .nf-flag.nf-flag-nc { background-position: -5px -3471px; width: 16px; height: 11px } .nf-flag.nf-flag-ne { background-position: -5px -3492px; width: 16px; height: 11px } .nf-flag.nf-flag-nf { background-position: -5px -3513px; width: 16px; height: 11px } .nf-flag.nf-flag-ng { background-position: -5px -3534px; width: 16px; height: 11px } .nf-flag.nf-flag-ni { background-position: -5px -3555px; width: 16px; height: 11px } .nf-flag.nf-flag-nl { background-position: -5px -3576px; width: 16px; height: 11px } .nf-flag.nf-flag-no { background-position: -5px -3597px; width: 16px; height: 11px } .nf-flag.nf-flag-np { background-position: -5px -3618px; width: 9px; height: 11px } .nf-flag.nf-flag-nr { background-position: -5px -3639px; width: 16px; height: 11px } .nf-flag.nf-flag-nu { background-position: -5px -3660px; width: 16px; height: 11px } .nf-flag.nf-flag-nz { background-position: -5px -3681px; width: 16px; height: 11px } .nf-flag.nf-flag-om { background-position: -5px -3702px; width: 16px; height: 11px } .nf-flag.nf-flag-pa { background-position: -5px -3723px; width: 16px; height: 11px } .nf-flag.nf-flag-pe { background-position: -5px -3744px; width: 16px; height: 11px } .nf-flag.nf-flag-pf { background-position: -5px -3765px; width: 16px; height: 11px } .nf-flag.nf-flag-pg { background-position: -5px -3786px; width: 16px; height: 11px } .nf-flag.nf-flag-ph { background-position: -5px -3807px; width: 16px; height: 11px } .nf-flag.nf-flag-pk { background-position: -5px -3828px; width: 16px; height: 11px } .nf-flag.nf-flag-pl { background-position: -5px -3849px; width: 16px; height: 11px } .nf-flag.nf-flag-pm { background-position: -5px -3870px; width: 16px; height: 11px } .nf-flag.nf-flag-pn { background-position: -5px -3891px; width: 16px; height: 11px } .nf-flag.nf-flag-pr { background-position: -5px -3912px; width: 16px; height: 11px } .nf-flag.nf-flag-ps { background-position: -5px -3933px; width: 16px; height: 11px } .nf-flag.nf-flag-pt { background-position: -5px -3954px; width: 16px; height: 11px } .nf-flag.nf-flag-pw { background-position: -5px -3975px; width: 16px; height: 11px } .nf-flag.nf-flag-py { background-position: -5px -3996px; width: 16px; height: 11px } .nf-flag.nf-flag-qa { background-position: -5px -4017px; width: 16px; height: 11px } .nf-flag.nf-flag-re { background-position: -5px -4038px; width: 16px; height: 11px } .nf-flag.nf-flag-ro { background-position: -5px -4059px; width: 16px; height: 11px } .nf-flag.nf-flag-rs { background-position: -5px -4080px; width: 16px; height: 11px } .nf-flag.nf-flag-ru { background-position: -5px -4101px; width: 16px; height: 11px } .nf-flag.nf-flag-rw { background-position: -5px -4122px; width: 16px; height: 11px } .nf-flag.nf-flag-sa { background-position: -5px -4143px; width: 16px; height: 11px } .nf-flag.nf-flag-sb { background-position: -5px -4164px; width: 16px; height: 11px } .nf-flag.nf-flag-sc { background-position: -5px -4185px; width: 16px; height: 11px } .nf-flag.nf-flag-scotland { background-position: -5px -4206px; width: 16px; height: 11px } .nf-flag.nf-flag-sd { background-position: -5px -4227px; width: 16px; height: 11px } .nf-flag.nf-flag-se { background-position: -5px -4248px; width: 16px; height: 11px } .nf-flag.nf-flag-sg { background-position: -5px -4269px; width: 16px; height: 11px } .nf-flag.nf-flag-sh { background-position: -5px -4290px; width: 16px; height: 11px } .nf-flag.nf-flag-si { background-position: -5px -4311px; width: 16px; height: 11px } .nf-flag.nf-flag-sj { background-position: -5px -4332px; width: 16px; height: 11px } .nf-flag.nf-flag-sk { background-position: -5px -4353px; width: 16px; height: 11px } .nf-flag.nf-flag-sl { background-position: -5px -4374px; width: 16px; height: 11px } .nf-flag.nf-flag-sm { background-position: -5px -4395px; width: 16px; height: 11px } .nf-flag.nf-flag-sn { background-position: -5px -4416px; width: 16px; height: 11px } .nf-flag.nf-flag-so { background-position: -5px -4437px; width: 16px; height: 11px } .nf-flag.nf-flag-sr { background-position: -5px -4458px; width: 16px; height: 11px } .nf-flag.nf-flag-ss { background-position: -5px -4479px; width: 16px; height: 11px } .nf-flag.nf-flag-st { background-position: -5px -4500px; width: 16px; height: 11px } .nf-flag.nf-flag-sv { background-position: -5px -4521px; width: 16px; height: 11px } .nf-flag.nf-flag-sx { background-position: -5px -4542px; width: 15px; height: 11px } .nf-flag.nf-flag-sy { background-position: -5px -4563px; width: 16px; height: 11px } .nf-flag.nf-flag-sz { background-position: -5px -4584px; width: 16px; height: 11px } .nf-flag.nf-flag-tc { background-position: -5px -4605px; width: 16px; height: 11px } .nf-flag.nf-flag-td { background-position: -5px -4626px; width: 16px; height: 11px } .nf-flag.nf-flag-tf { background-position: -5px -4647px; width: 16px; height: 11px } .nf-flag.nf-flag-tg { background-position: -5px -4668px; width: 16px; height: 11px } .nf-flag.nf-flag-th { background-position: -5px -4689px; width: 16px; height: 11px } .nf-flag.nf-flag-tj { background-position: -5px -4710px; width: 16px; height: 11px } .nf-flag.nf-flag-tk { background-position: -5px -4731px; width: 16px; height: 11px } .nf-flag.nf-flag-tl { background-position: -5px -4752px; width: 16px; height: 11px } .nf-flag.nf-flag-tm { background-position: -5px -4773px; width: 16px; height: 11px } .nf-flag.nf-flag-tn { background-position: -5px -4794px; width: 16px; height: 11px } .nf-flag.nf-flag-to { background-position: -5px -4815px; width: 16px; height: 11px } .nf-flag.nf-flag-tr { background-position: -5px -4836px; width: 16px; height: 11px } .nf-flag.nf-flag-tt { background-position: -5px -4857px; width: 16px; height: 11px } .nf-flag.nf-flag-tv { background-position: -5px -4878px; width: 16px; height: 11px } .nf-flag.nf-flag-tw { background-position: -5px -4899px; width: 16px; height: 11px } .nf-flag.nf-flag-tz { background-position: -5px -4920px; width: 16px; height: 11px } .nf-flag.nf-flag-ua { background-position: -5px -4941px; width: 16px; height: 11px } .nf-flag.nf-flag-ug { background-position: -5px -4962px; width: 16px; height: 11px } .nf-flag.nf-flag-um { background-position: -5px -4983px; width: 16px; height: 11px } .nf-flag.nf-flag-us { background-position: -5px -5004px; width: 16px; height: 11px } .nf-flag.nf-flag-uy { background-position: -5px -5025px; width: 16px; height: 11px } .nf-flag.nf-flag-uz { background-position: -5px -5046px; width: 16px; height: 11px } .nf-flag.nf-flag-va { background-position: -5px -5067px; width: 16px; height: 11px } .nf-flag.nf-flag-vc { background-position: -5px -5088px; width: 16px; height: 11px } .nf-flag.nf-flag-ve { background-position: -5px -5109px; width: 16px; height: 11px } .nf-flag.nf-flag-vg { background-position: -5px -5130px; width: 16px; height: 11px } .nf-flag.nf-flag-vi { background-position: -5px -5151px; width: 16px; height: 11px } .nf-flag.nf-flag-vn { background-position: -5px -5172px; width: 16px; height: 11px } .nf-flag.nf-flag-vu { background-position: -5px -5193px; width: 16px; height: 11px } .nf-flag.nf-flag-wales { background-position: -5px -5214px; width: 16px; height: 11px } .nf-flag.nf-flag-wf { background-position: -5px -5235px; width: 16px; height: 11px } .nf-flag.nf-flag-ws { background-position: -5px -5256px; width: 16px; height: 11px } .nf-flag.nf-flag-ye { background-position: -5px -5277px; width: 16px; height: 11px } .nf-flag.nf-flag-yt { background-position: -5px -5298px; width: 16px; height: 11px } .nf-flag.nf-flag-za { background-position: -5px -5319px; width: 16px; height: 11px } .nf-flag.nf-flag-zm { background-position: -5px -5340px; width: 16px; height: 11px } .nf-flag.nf-flag-zw { background-position: -5px -5361px; width: 16px; height: 11px } .ui-select-wrapper.country-select { vertical-align: top; position: relative; width: 60px; display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #b3b3b3 } .ui-select-wrapper.country-select .ui-select-current { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .ui-select-wrapper.country-select .ui-select-current .country-name { display: none } .ui-select-wrapper-link { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .country-name { padding-left: 26px; float: left; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .country-code { color: #999; font-style: normal; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .flag-select-option { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .flag-select-item-list { width: 350px; max-width: 100vw; max-height: 380px; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .country-select-flag { margin-top: 5px; position: absolute; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .currently-selected-code { position: absolute; z-index: 2; top: 13px; left: 70px; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .phone-number-entry { background-color: #e5e5e5; padding: 1em 1em 0 1em } .phone-number-input { display: inline-block; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -moz-box-orient: horizontal; -moz-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: start; -webkit-align-items: flex-start; -moz-box-align: start; -ms-flex-align: start; align-items: flex-start } @media screen and (min-width:440px) { .phone-number-input { max-width: 320px } } .phone-number-input__text { margin-left: -1px; display: inline-block; -webkit-box-flex: 1; -webkit-flex: 1; -moz-box-flex: 1; -ms-flex: 1; flex: 1 } .logos { position: relative } .logos.logos-inline { vertical-align: middle; display: inline-block; overflow: auto } .logos.logos-row { background: inherit; overflow: auto; padding: 1px 0; margin-bottom: 24px } @media only screen and (min-width:450px) { .logos.hideIfMediumOrGreater { display: none } } @media only screen and (max-width:450px) { .logos.hideIfSmallOrLess { display: none } } .logos .logoIcon { height: 25px; width: 39px; margin-right: 6px; float: left } .logos .logoIcon:last-of-type { margin-right: 0 } .logos .grayscale { -webkit-filter: gray; filter: gray; filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale") } .logos .VISA { background: url(../img/vsa.png) no-repeat 0 0 } .logos .MASTERCARD { background: url(../img/msc.png) no-repeat 0 0; width: 37px } .logos .DISCOVER { background: url(../img/dsc.png) no-repeat 0 0 } .logos .AMEX { background: url(../img/amx.png) no-repeat 0 0 } .app-spinner { position: fixed; top: 50%; left: 50% } .orderContainer { text-align: center; max-width: 460px } .orderContainer .orderSummary { display: table; border-collapse: collapse; width: 100% } .orderContainer .row { display: table-row } .orderContainer .row span { padding: 15px 0 } .orderContainer .row span:first-child { float: left } .orderContainer .row span:last-child { float: right } .orderContainer .row:last-child { border-top: solid 1px #ccc } .fixedCta .centerContainer { padding-bottom: 20px; margin-bottom: 0 } .fixedCta .submitBtnContainer { position: fixed; left: 3%; right: 3%; bottom: 20px; z-index: 10 } .fixedCta .simpleContainer { padding-bottom: 15px } .fixedCta .site-footer-wrapper { margin-bottom: 80px } div.basicLayout .nfHeader, div.basicLayout .simpleContainer { background-color: #fff } div.basicLayout .nfHeader { border-bottom: 1px solid #e6e6e6 } div.basicLayout .centerContainer { padding: 20px 32px 60px } div.basicLayout .loadingText { display: none } div.basicLayout .narrowCenterContainer { padding-left: 16px; padding-right: 16px } div.basicLayout .narrowCenterContainer .submitBtnContainer { padding: 0 16px } div.basicLayout .narrowCenterContainer .hdAvail, div.basicLayout .narrowCenterContainer .welcome { padding: 0 16px } div.basicLayout .stepIndicator { text-align: inherit; font-size: 13px } div.basicLayout .planFormContainer .changeAnytime, div.basicLayout .planFormContainer .stepHeader-container { padding: 0 16px } div.basicLayout .confirmFormContainer .plan-info, div.basicLayout .contextContainer .plan-info { margin-left: 0; margin-right: 0 } div.basicLayout .slimWidth .planContainer, div.basicLayout .slimWidth .regContainer { max-width: 340px } div.basicLayout .slimWidth .nf-btn-primary { min-height: 48px; font-weight: 400; font-size: 17px } div.basicLayout .slimWidth .contextStep .submitBtnContainer { max-width: 340px } @media only screen and (max-width:600px) { div.basicLayout .slimWidth .planTable .headerRow .cellContent { height: 75px; line-height: 75px } } div.basicLayout .paymentContainer .contextBody, div.basicLayout .planContainer .contextBody, div.basicLayout .regContainer .contextBody { margin: 0; font-size: 17px } div.basicLayout .stepLogoContainer { display: inline-block } div.basicLayout .stepLogoContainer .stepLogo { margin: 100px 0 20px } div.basicLayout .stepLogoContainer .paymentStepLogo { margin-top: 20px } div.basicLayout .paymentStepLogo, div.basicLayout .planStepLogo { width: 50px; -moz-background-size: 50px; background-size: 50px; height: 50px } div.basicLayout .regStepLogo { width: 260px } div.basicLayout .nf-btn-primary { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px } div.basicLayout .planSelectionContainer .headerRow.fix { background-color: #fff } div.basicLayout .planSelectionContainer .selborder { border: 0 } div.basicLayout .planSelectionContainer .planNameContainer { padding: 3px } div.basicLayout .planTable .headerRow .cellContent { border: 1px solid #e50914; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 17px; font-weight: 700 } div.basicLayout .planTable .headerRow .selected .cellContent { background: #e50914; color: #fff } div.basicLayout .graySelection .headerRow .cellContent { background: #e6e6e6; border: 1px solid #ccc; color: #000 } div.basicLayout .graySelection .selected .cellContent { border: 1px solid #e50914 } @media screen and (max-width:500px), screen and (orientation:landscape) and (max-width:740px) { div.basicLayout .svg-icon-netflix-logo { padding-top: 0 } } @media only screen and (max-width:600px) { div.basicLayout .paymentContainer, div.basicLayout .planContainer, div.basicLayout .regContainer { text-align: left } div.basicLayout .planContainer .stepLogoContainer, div.basicLayout .regContainer .stepLogoContainer { margin-top: 30% } div.basicLayout .planContainer .stepLogoContainer .stepLogo, div.basicLayout .regContainer .stepLogoContainer .stepLogo { margin-top: 0 } div.basicLayout .planSelectionContainer .headerRow { width: auto } div.basicLayout .centerContainer .planTable { width: 100% } div.basicLayout .planSelectionContainer .headerRow .cell { width: 33%; display: inline-block } div.basicLayout .planSelectionContainer .headerRow.fix { left: 16px; right: 16px } div.basicLayout .planTable .headerRow .cellContent { width: 100% } div.basicLayout .planTable .alt { width: 90%; margin-left: 5% } div.basicLayout .narrowContainer { margin: 0 } } @media only screen and (max-width:950px) { div.basicLayout .planSelectionContainer .selborder { max-width: none; padding: 0; border: 0 } } .basicLayout.showDisclosure { background-color: #f3f3f3 } .simplicity-dark .basicLayout { background: 0 0 } .simplicity-dark .basicLayout .nfHeader { border-bottom: none } @font-face { font-family: nf-icon; src: url(https://assets.nflxext.com/ffe/siteui/fonts/nf-icon-v1-93.eot); src: url(https://assets.nflxext.com/ffe/siteui/fonts/nf-icon-v1-93.eot?#iefix) format('embedded-opentype'), url(https://assets.nflxext.com/ffe/siteui/fonts/nf-icon-v1-93.woff) format('woff'), url(https://assets.nflxext.com/ffe/siteui/fonts/nf-icon-v1-93.ttf) format('truetype'), url(https://assets.nflxext.com/ffe/siteui/fonts/nf-icon-v1-93.svg#nf-icon-v1-93) format('svg'); font-weight: 400; font-style: normal } [class*=" icon-"], [class^=icon-] { font-family: nf-icon; speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; line-height: 1; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); transform: translateZ(0) } .icon-logoUpdate:before { content: '\e5d0' } .icon-close:before { content: '\e762' } .icon-search:before { content: '\e636' } .icon-circle-solid:before { content: '\e622' } .icon-star-25-percent:before { content: '\e637' } .icon-star-50-percent:before { content: '\e638' } .icon-star-75-percent:before { content: '\e639' } .icon-star:before { content: '\e640' } .icon-add:before { content: '\e641' } .icon-play:before { content: '\e646' } .icon-leftArrow:before { content: '\e659' } .icon-rightArrow:before { content: '\e658' } .icon-kids:before { content: '\e691' } .icon-tvuiAdd:before { content: '\e716' } .icon-TvRatings:before { content: '\e733' } .icon-Talent:before { content: '\e734' } .icon-Awards:before { content: '\e736' } .icon-BoxOffice:before { content: '\e737' } .icon-round-x:before { content: '\e747' } .icon-globe:before { content: '\e896' } .icon-warning:before { content: '\e620' } .icon-rightCaret:before { content: '\e867' } .icon-leftCaret:before { content: '\e868' } .icon-disc:before { content: '\e871' } .icon-spinner:before { content: '\e765' } .icon-plainCheck:before { content: '\e804' } .icon-plainX:before { content: '\e807' } .icon-facebook:before { content: '\e628' } .icon-error:before { content: '\e798' } .icon-valid:before { content: '\e804' } .icon-lock:before { content: '\e625' } .icon-info-inv:before { content: '\e748' } .icon-success-inv:before { content: '\e746' } .icon-warn-inv:before { content: '\e743' } .icon-visa:before { content: '\e901' } .icon-mastercard:before { content: '\e902' } .icon-discover:before { content: '\e903' } .icon-amex:before { content: '\e900' } .icon-paypal:before { content: '\e914' } .icon-nicam-AL:before { content: '\f000' } .icon-nicam-6:before { content: '\f001' } .icon-nicam-9:before { content: '\f004' } .icon-nicam-12:before { content: '\f002' } .icon-nicam-16:before { content: '\f003' } .icon-nicam-violence:before { content: '\f005' } .icon-nicam-fear-anxiety:before { content: '\f006' } .icon-nicam-profanity:before { content: '\f007' } .icon-nicam-discrimination:before { content: '\f008' } .icon-nicam-drug-or-alcohol:before { content: '\f009' } .icon-nicam-sex:before { content: '\f010' } .icon-androidPlayRing:before { content: '\e665' } .icon-akiraMyListAdd:before { content: '\e850' } .icon-akiraMyListRemove:before { content: '\e852' } .icon-akiraCaretDown:before { content: '\e854' } .icon-akiraCaretRight:before { content: '\e658' } .icon-akiraCaretLeft:before { content: '\e659' } .icon-button-play:before { content: '\e884' } .icon-button-play-reverse:before { content: '\e890' } .icon-button-mylist-add:before { content: '\e885' } .icon-button-mylist-add-reverse:before { content: '\e891' } .icon-button-mylist-added:before { content: '\e888' } .icon-button-mylist-added-reverse:before { content: '\e894' } .icon-button-share:before { content: '\e886' } .icon-button-share-reverse:before { content: '\e892' } .icon-button-episodes:before { content: '\e887' } .icon-button-episodes-reverse:before { content: '\e893' } .icon-button-spinner:before { content: '\e765' } .icon-button-spinner-reverse:before { content: '\e765' } .icon-button-minus:before { content: '\e889' } .icon-button-minus-reverse:before { content: '\e895' } .icon-button-audio-on:before { content: '\e88a' } .icon-button-audio-on-reverse:before { content: '\e88c' } .icon-button-audio-off:before { content: '\e88b' } .icon-button-audio-off-reverse:before { content: '\e88d' } .icon-button-replay:before { content: '\f095' } .icon-button-replay-reverse:before { content: '\f096' } .icon-button-notification:before { content: '\e663' } .icon-button-notification-reverse:before { content: '\e663' } .icon-thumb-down:before { content: '\e660' } .icon-thumb-up:before { content: '\e661' } .icon-thin-caret-left:before { content: '\e704' } .icon-thin-caret-right:before { content: '\e705' } .icon-long-arrow-left:before { content: '\e673' } .icon-long-arrow-right:before { content: '\e672' } .icon-short-arrow-right:before { content: '\e89B' } .icon-back:before { content: '\e635' } .icon-uniE5D0:before { content: "\E5D0" } .icon-uniE5D1:before { content: "\E5D1" } .icon-uniE600:before { content: "\E600" } .icon-uniE601:before { content: "\E601" } .icon-uniE602:before { content: "\E602" } .icon-uniE603:before { content: "\E603" } .icon-uniE604:before { content: "\E604" } .icon-uniE605:before { content: "\E605" } .icon-uniE606:before { content: "\E606" } .icon-uniE607:before { content: "\E607" } .icon-uniE608:before { content: "\E608" } .icon-uniE609:before { content: "\E609" } .icon-uniE610:before { content: "\E610" } .icon-uniE611:before { content: "\E611" } .icon-uniE612:before { content: "\E612" } .icon-uniE613:before { content: "\E613" } .icon-uniE614:before { content: "\E614" } .icon-uniE615:before { content: "\E615" } .icon-uniE616:before { content: "\E616" } .icon-uniE617:before { content: "\E617" } .icon-uniE618:before { content: "\E618" } .icon-uniE619:before { content: "\E619" } .icon-uniE620:before { content: "\E620" } .icon-uniE621:before { content: "\E621" } .icon-uniE622:before { content: "\E622" } .icon-uniE623:before { content: "\E623" } .icon-uniE624:before { content: "\E624" } .icon-uniE625:before { content: "\E625" } .icon-uniE626:before { content: "\E626" } .icon-uniE627:before { content: "\E627" } .icon-uniE628:before { content: "\E628" } .icon-uniE629:before { content: "\E629" } .icon-uniE630:before { content: "\E630" } .icon-uniE631:before { content: "\E631" } .icon-uniE632:before { content: "\E632" } .icon-uniE633:before { content: "\E633" } .icon-uniE634:before { content: "\E634" } .icon-uniE635:before { content: "\E635" } .icon-uniE636:before { content: "\E636" } .icon-uniE637:before { content: "\E637" } .icon-uniE638:before { content: "\E638" } .icon-uniE639:before { content: "\E639" } .icon-uniE640:before { content: "\E640" } .icon-uniE641:before { content: "\E641" } .icon-uniE642:before { content: "\E642" } .icon-uniE643:before { content: "\E643" } .icon-uniE644:before { content: "\E644" } .icon-uniE645:before { content: "\E645" } .icon-uniE646:before { content: "\E646" } .icon-uniE647:before { content: "\E647" } .icon-uniE648:before { content: "\E648" } .icon-uniE649:before { content: "\E649" } .icon-uniE650:before { content: "\E650" } .icon-uniE651:before { content: "\E651" } .icon-uniE652:before { content: "\E652" } .icon-uniE653:before { content: "\E653" } .icon-uniE654:before { content: "\E654" } .icon-uniE655:before { content: "\E655" } .icon-uniE656:before { content: "\E656" } .icon-uniE657:before { content: "\E657" } .icon-uniE658:before { content: "\E658" } .icon-uniE659:before { content: "\E659" } .icon-uniE660:before { content: "\E660" } .icon-uniE661:before { content: "\E661" } .icon-uniE662:before { content: "\E662" } .icon-uniE663:before { content: "\E663" } .icon-uniE664:before { content: "\E664" } .icon-uniE665:before { content: "\E665" } .icon-uniE666:before { content: "\E666" } .icon-uniE667:before { content: "\E667" } .icon-uniE668:before { content: "\E668" } .icon-uniE669:before { content: "\E669" } .icon-uniE670:before { content: "\E670" } .icon-uniE671:before { content: "\E671" } .icon-uniE672:before { content: "\E672" } .icon-uniE673:before { content: "\E673" } .icon-uniE674:before { content: "\E674" } .icon-uniE675:before { content: "\E675" } .icon-uniE676:before { content: "\E676" } .icon-uniE677:before { content: "\E677" } .icon-uniE678:before { content: "\E678" } .icon-uniE679:before { content: "\E679" } .icon-uniE680:before { content: "\E680" } .icon-uniE681:before { content: "\E681" } .icon-uniE682:before { content: "\E682" } .icon-uniE683:before { content: "\E683" } .icon-uniE684:before { content: "\E684" } .icon-uniE685:before { content: "\E685" } .icon-uniE687:before { content: "\E687" } .icon-uniE688:before { content: "\E688" } .icon-uniE689:before { content: "\E689" } .icon-uniE690:before { content: "\E690" } .icon-uniE691:before { content: "\E691" } .icon-uniE692:before { content: "\E692" } .icon-uniE693:before { content: "\E693" } .icon-uniE694:before { content: "\E694" } .icon-uniE695:before { content: "\E695" } .icon-uniE696:before { content: "\E696" } .icon-uniE697:before { content: "\E697" } .icon-uniE698:before { content: "\E698" } .icon-uniE699:before { content: "\E699" } .icon-uniE700:before { content: "\E700" } .icon-uniE701:before { content: "\E701" } .icon-uniE702:before { content: "\E702" } .icon-uniE703:before { content: "\E703" } .icon-uniE704:before { content: "\E704" } .icon-uniE705:before { content: "\E705" } .icon-uniE706:before { content: "\E706" } .icon-uniE707:before { content: "\E707" } .icon-uniE708:before { content: "\E708" } .icon-uniE709:before { content: "\E709" } .icon-uniE710:before { content: "\E710" } .icon-uniE711:before { content: "\E711" } .icon-uniE712:before { content: "\E712" } .icon-uniE713:before { content: "\E713" } .icon-uniE714:before { content: "\E714" } .icon-uniE715:before { content: "\E715" } .icon-uniE716:before { content: "\E716" } .icon-uniE718:before { content: "\E718" } .icon-uniE719:before { content: "\E719" } .icon-uniE720:before { content: "\E720" } .icon-uniE721:before { content: "\E721" } .icon-uniE722:before { content: "\E722" } .icon-uniE723:before { content: "\E723" } .icon-uniE724:before { content: "\E724" } .icon-uniE725:before { content: "\E725" } .icon-uniE726:before { content: "\E726" } .icon-uniE727:before { content: "\E727" } .icon-uniE728:before { content: "\E728" } .icon-uniE729:before { content: "\E729" } .icon-uniE730:before { content: "\E730" } .icon-uniE731:before { content: "\E731" } .icon-uniE732:before { content: "\E732" } .icon-uniE733:before { content: "\E733" } .icon-uniE734:before { content: "\E734" } .icon-uniE735:before { content: "\E735" } .icon-uniE736:before { content: "\E736" } .icon-uniE737:before { content: "\E737" } .icon-uniE738:before { content: "\E738" } .icon-uniE739:before { content: "\E739" } .icon-uniE740:before { content: "\E740" } .icon-uniE741:before { content: "\E741" } .icon-uniE742:before { content: "\E742" } .icon-uniE743:before { content: "\E743" } .icon-uniE744:before { content: "\E744" } .icon-uniE745:before { content: "\E745" } .icon-uniE746:before { content: "\E746" } .icon-uniE747:before { content: "\E747" } .icon-uniE748:before { content: "\E748" } .icon-uniE749:before { content: "\E749" } .icon-uniE750:before { content: "\E750" } .icon-uniE751:before { content: "\E751" } .icon-uniE752:before { content: "\E752" } .icon-uniE753:before { content: "\E753" } .icon-uniE754:before { content: "\E754" } .icon-uniE755:before { content: "\E755" } .icon-uniE756:before { content: "\E756" } .icon-uniE757:before { content: "\E757" } .icon-uniE758:before { content: "\E758" } .icon-uniE759:before { content: "\E759" } .icon-uniE760:before { content: "\E760" } .icon-uniE761:before { content: "\E761" } .icon-uniE762:before { content: "\E762" } .icon-uniE763:before { content: "\E763" } .icon-uniE764:before { content: "\E764" } .icon-uniE765:before { content: "\E765" } .icon-uniE766:before { content: "\E766" } .icon-uniE767:before { content: "\E767" } .icon-uniE775:before { content: "\E775" } .icon-uniE776:before { content: "\E776" } .icon-uniE777:before { content: "\E777" } .icon-uniE778:before { content: "\E778" } .icon-uniE779:before { content: "\E779" } .icon-uniE780:before { content: "\E780" } .icon-uniE781:before { content: "\E781" } .icon-uniE782:before { content: "\E782" } .icon-uniE783:before { content: "\E783" } .icon-uniE784:before { content: "\E784" } .icon-uniE785:before { content: "\E785" } .icon-uniE786:before { content: "\E786" } .icon-uniE787:before { content: "\E787" } .icon-uniE796:before { content: "\E796" } .icon-uniE797:before { content: "\E797" } .icon-uniE798:before { content: "\E798" } .icon-uniE799:before { content: "\E799" } .icon-uniE800:before { content: "\E800" } .icon-uniE801:before { content: "\E801" } .icon-uniE802:before { content: "\E802" } .icon-uniE803:before { content: "\E803" } .icon-uniE804:before { content: "\E804" } .icon-uniE805:before { content: "\E805" } .icon-uniE806:before { content: "\E806" } .icon-uniE807:before { content: "\E807" } .icon-uniE850:before { content: "\E850" } .icon-uniE851:before { content: "\E851" } .icon-uniE852:before { content: "\E852" } .icon-uniE853:before { content: "\E853" } .icon-uniE854:before { content: "\E854" } .icon-uniE855:before { content: "\E855" } .icon-uniE856:before { content: "\E856" } .icon-uniE857:before { content: "\E857" } .icon-uniE858:before { content: "\E858" } .icon-uniE859:before { content: "\E859" } .icon-uniE860:before { content: "\E860" } .icon-uniE861:before { content: "\E861" } .icon-uniE862:before { content: "\E862" } .icon-uniE863:before { content: "\E863" } .icon-uniE864:before { content: "\E864" } .icon-uniE865:before { content: "\E865" } .icon-uniE866:before { content: "\E866" } .icon-uniE867:before { content: "\E867" } .icon-uniE868:before { content: "\E868" } .icon-uniE869:before { content: "\E869" } .icon-uniE870:before { content: "\E870" } .icon-uniE871:before { content: "\E871" } .icon-uniE872:before { content: "\E872" } .icon-uniE873:before { content: "\E873" } .icon-uniE874:before { content: "\E874" } .icon-uniE875:before { content: "\E875" } .icon-uniE876:before { content: "\E876" } .icon-uniE877:before { content: "\E877" } .icon-uniE878:before { content: "\E878" } .icon-uniE879:before { content: "\E879" } .icon-uniE880:before { content: "\E880" } .icon-uniE881:before { content: "\E881" } .icon-uniE882:before { content: "\E882" } .icon-uniE883:before { content: "\E883" } .icon-uniE884:before { content: "\E884" } .icon-uniE885:before { content: "\E885" } .icon-uniE886:before { content: "\E886" } .icon-uniE887:before { content: "\E887" } .icon-uniE888:before { content: "\E888" } .icon-uniE889:before { content: "\E889" } .icon-uniE88A:before { content: "\E88A" } .icon-uniE88B:before { content: "\E88B" } .icon-uniE88C:before { content: "\E88C" } .icon-uniE88D:before { content: "\E88D" } .icon-uniE890:before { content: "\E890" } .icon-uniE891:before { content: "\E891" } .icon-uniE892:before { content: "\E892" } .icon-uniE893:before { content: "\E893" } .icon-uniE894:before { content: "\E894" } .icon-uniE895:before { content: "\E895" } .icon-uniE896:before { content: "\E896" } .icon-uniE897:before { content: "\E897" } .icon-uniE898:before { content: "\E898" } .icon-uniE89A:before { content: "\E89A" } .icon-uniE89B:before { content: "\E89B" } .icon-uniE89C:before { content: "\E89C" } .icon-uniE89D:before { content: "\E89D" } .icon-uniE8A1:before { content: "\E8A1" } .icon-uniE8A2:before { content: "\E8A2" } .icon-uniE8A3:before { content: "\E8A3" } .icon-uniE8A4:before { content: "\E8A4" } .icon-uniE8A5:before { content: "\E8A5" } .icon-uniE8A6:before { content: "\E8A6" } .icon-uniE8A7:before { content: "\E8A7" } .icon-uniE8A8:before { content: "\E8A8" } .icon-uniE900:before { content: "\E900" } .icon-uniE901:before { content: "\E901" } .icon-uniE902:before { content: "\E902" } .icon-uniE903:before { content: "\E903" } .icon-uniE904:before { content: "\E904" } .icon-uniE905:before { content: "\E905" } .icon-uniE906:before { content: "\E906" } .icon-uniE907:before { content: "\E907" } .icon-uniE908:before { content: "\E908" } .icon-uniE909:before { content: "\E909" } .icon-uniE910:before { content: "\E910" } .icon-uniE911:before { content: "\E911" } .icon-uniE912:before { content: "\E912" } .icon-uniE913:before { content: "\E913" } .icon-uniE914:before { content: "\E914" } .icon-uniE915:before { content: "\E915" } .icon-uniE916:before { content: "\E916" } .icon-uniE940:before { content: "\E940" } .icon-uniE941:before { content: "\E941" } .icon-uniE942:before { content: "\E942" } .icon-uniE943:before { content: "\E943" } .icon-uniF000:before { content: "\F000" } .icon-uniF001:before { content: "\F001" } .icon-uniF002:before { content: "\F002" } .icon-uniF003:before { content: "\F003" } .icon-uniF004:before { content: "\F004" } .icon-uniF005:before { content: "\F005" } .icon-uniF006:before { content: "\F006" } .icon-uniF007:before { content: "\F007" } .icon-uniF008:before { content: "\F008" } .icon-uniF009:before { content: "\F009" } .icon-uniF010:before { content: "\F010" } .icon-uniF011:before { content: "\F011" } .icon-uniF012:before { content: "\F012" } .icon-uniF013:before { content: "\F013" } .icon-uniF014:before { content: "\F014" } .icon-uniF015:before { content: "\F015" } .icon-uniF016:before { content: "\F016" } .icon-uniF017:before { content: "\F017" } .icon-uniF018:before { content: "\F018" } .icon-uniF019:before { content: "\F019" } .icon-uniF020:before { content: "\F020" } .icon-uniF021:before { content: "\F021" } .icon-uniF022:before { content: "\F022" } .icon-uniF023:before { content: "\F023" } .icon-uniF024:before { content: "\F024" } .icon-uniF025:before { content: "\F025" } .icon-uniF026:before { content: "\F026" } .icon-uniF027:before { content: "\F027" } .icon-uniF028:before { content: "\F028" } .icon-uniF029:before { content: "\F029" } .icon-uniF030:before { content: "\F030" } .icon-uniF031:before { content: "\F031" } .icon-uniF032:before { content: "\F032" } .icon-uniF033:before { content: "\F033" } .icon-uniF034:before { content: "\F034" } .icon-uniF035:before { content: "\F035" } .icon-uniF036:before { content: "\F036" } .icon-uniF037:before { content: "\F037" } .icon-uniF038:before { content: "\F038" } .icon-uniF039:before { content: "\F039" } .icon-uniF040:before { content: "\F040" } .icon-stacked-screens:before { content: "\F041" } .icon-stacked-screens-small:before { content: "\F099" } .icon-cross-device-screens:before { content: "\F042" } .icon-cross-device-screens-desktop:before { content: "\F098" } .icon-cross-device-screens-small:before { content: "\F097" } .icon-tv-screen:before { content: "\F043" } .icon-price-tag:before { content: "\F044" } .icon-cancel:before { content: "\F045" } .stepHeader { display: inline-block } .regFormContainer .stepHeader { margin-top: 20px } .stepHeader p { margin: 0; line-height: 1.5em } .stepIndicator { text-align: left; display: block; font-size: 13px; line-height: 19px } .confirmFormContainer .stepIndicator, .planFormContainer .stepIndicator { font-size: 19px; line-height: 27px } .stepTitle { display: inline-block; font-weight: 700; font-size: 23px } .nfHeader { background-color: #f3f3f3; border-bottom: solid 1px #ccc; height: 90px } .nfHeader.signupBasicHeader { height: 90px } @media screen and (max-width:740px) { .nfHeader.signupBasicHeader { height: 75px } } @media screen and (max-width:500px) { .nfHeader.signupBasicHeader { height: 45px } } .nfHeader.signupBasicHeader.iosInAppHeader { position: fixed; text-align: center; top: 0; width: 100%; z-index: 1100 } .focused .nfHeader.iosInAppHeader { position: absolute } .noBorderHeader { background-color: transparent; border-bottom: 0; position: relative } .nfLogo { text-decoration: none; vertical-align: middle; color: #e50914; font-size: 2.8em; line-height: 90px; float: left } @media screen and (max-width:740px) { .nfLogo { font-size: 1.8em; line-height: 75px } } @media screen and (max-width:500px) { .nfLogo { font-size: 1.2em; line-height: 45px } .nfHeader .logo { line-height: 45px!important } .logo img { height: 20px!important; width: 74px!important } } .nfLogo:focus, .nfLogo:hover { text-decoration: none } .nfLogo.signupBasicHeader { margin-left: 3% } .svg-nfLogo { text-decoration: none; vertical-align: middle; fill: #e50914; display: inline-block; line-height: 90px } .logo img { height: 45px; width: 167px; vertical-align: middle } @media screen and (max-width:740px) { .svg-nfLogo { line-height: 75px } } @media screen and (max-width:500px) { .svg-nfLogo { line-height: 45px } .svg-nfLogo .svg-icon-netflix-logo { height: 20px; width: 75px; padding-top: 12px } } .svg-nfLogo.signupBasicHeader { margin-left: 3% } .authLinks { float: right; color: #333; font-weight: 700; font-size: 19px; line-height: 90px } @media screen and (max-width:740px) { .authLinks { font-size: 16px; line-height: 75px } } @media screen and (max-width:500px) { .authLinks { font-size: 14px; line-height: 45px } } .authLinks.signupBasicHeader { margin: 0 3% } @media screen and (max-width:500px) { .authLinks.signupBasicHeader { margin: 0 10px } } .footer-mount { width: 100%; padding: 0 } .site-footer-wrapper { min-width: 190px; width: 100%; margin-top: 80px; padding-bottom: 20px; font-size: 1em; color: #a6a6a6; position: relative } .pt11 .site-footer-wrapper { margin-bottom: 80px } .pt11 .site-footer-wrapper .footer-divider { display: none } .footer-top-a { color: #a6a6a6 } .footer-divider { height: 0; width: 100%; border-top: 1px solid #e6e6e6 } .site-footer { margin: 0 auto; padding-top: 30px; width: 90% } .footer-top { padding: 0; margin: 0 0 30px } .footer-links { max-width: 1000px; font-size: 13px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .footer-link-item { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin-bottom: 16px; display: inline-block; min-width: 100px; width: 24.7%; padding-right: 12px; vertical-align: top } @media only screen and (max-width:740px) { .footer-link-item { width: 33% } } @media only screen and (max-width:500px) { .footer-link-item { width: 49% } } .footer-link { color: #a6a6a6 } .service-code-wrapper { color: #a6a6a6; margin: 45px 0 20px } .service-code { border: 1px solid #a6a6a6; padding: 8px; display: inline-block; color: #a6a6a6; font-size: .8521em; min-width: 90px; text-align: center } .service-code:focus, .service-code:hover { text-decoration: none } .copy-text { color: #737373; margin: 20px 0; font-size: .75em; line-height: 1em } .copy-text a { color: #737373 } .copy-text a:focus, .copy-text a:hover { text-decoration: underline } .footer-country { font-size: 13px; margin-top: 24px } .privacy-updated, .terms-updated { font-weight: 700 } .lang-selection-container { display: inline-block } .ui-grid { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .ui-grid .ui-grid-25, .ui-grid .ui-grid-75, .ui-grid .ui-grid-full, .ui-grid .ui-grid-half { margin-bottom: 8px } .ui-grid .ui-grid-25, .ui-grid .ui-grid-75 { display: inline-block; vertical-align: top } .ui-grid .ui-grid-75 { width: 74% } .ui-grid .ui-grid-25 { width: 24% } .ui-grid .ui-grid-left { margin-right: 1% } .ui-grid .ui-grid-right { margin-left: 1% } @media only screen and (min-width:500px) { .ui-grid-half { display: inline-block; vertical-align: top; width: 49% } .ui-grid-half:nth-child(odd) { margin-right: 1% } .ui-grid-half:nth-child(even) { margin-left: 1% } } .ui-divider-top { border-top: 1px solid #ccc; margin-top: 10px; padding-top: 16px } .fieldset-borderless { border-color: #ccc; border-bottom: 0; border-left: 0; border-right: 0; padding: 0; margin: 43px 0 0 } .fieldset-borderless .centeredLegend { position: relative; text-align: center; margin-bottom: 0 } .fieldset-borderless .centeredLegend:after { content: attr(title); display: inline-block; position: relative; padding: 2px 8px; background-color: #e6e6e6; top: -.8em } .formHeading { margin-bottom: 20px } .calloutLink { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; padding: 10px; background-color: #e6e6e6 } .calloutLink .no-link { color: #333 } .nfLabel { font-size: 16px; color: #333 } .background-dark { color: inherit } .nfFormSpace { margin-bottom: 10px } .nfFormSpace.no-padding .signupTerms { margin-left: 0; margin-right: 0 } .nfCompactInput, .ui-label, .ui-label-no-margin { font-size: 16px; font-weight: 400; color: #8c8c8c; display: block } @media only screen and (max-width:740px) { .nfCompactInput, .ui-label, .ui-label-no-margin { font-size: 13px } } .nfCompactInput.inline, .ui-label-no-margin.inline, .ui-label.inline { display: inline-block } .nfCompactInput.inline .ui-text-input, .ui-label-no-margin.inline .ui-text-input, .ui-label.inline .ui-text-input { margin-bottom: 0 } .nfCompactInput.nmHomeTextInput .ui-label-text, .ui-label-no-margin.nmHomeTextInput .ui-label-text, .ui-label.nmHomeTextInput .ui-label-text { margin-right: 1ex } .nfCompactInput.nmHomeTextInput .input-password-input, .nfCompactInput.nmHomeTextInput .ui-text-input, .ui-label-no-margin.nmHomeTextInput .input-password-input, .ui-label-no-margin.nmHomeTextInput .ui-text-input, .ui-label.nmHomeTextInput .input-password-input, .ui-label.nmHomeTextInput .ui-text-input { background-color: rgba(0, 0, 0, .8); border-color: #737373; font-size: 23px; color: #fff } .ui-label { margin-bottom: 6px } .icon-error { color: #b92d2b } .icon-valid { color: #0071eb } .ui-input-wrapper { display: inline-block; margin: 0; padding: 0 } @media only screen and (max-width:500px) { .ui-input-wrapper { display: block } } .ui-input-label { padding-bottom: 32px; position: relative } .ui-readonly-value { padding: 10px 0; margin-bottom: 20px; color: #333 } .nfTextField { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size: 16px; border: solid 1px #8c8c8c; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; display: block; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; color: #000; padding: 10px 11px; height: 44px } .nfTextField.large { padding: 14px 11px } @media only screen and (max-width:740px) { .nfTextField.large { font-size: 16px; padding: 11px } } .nfTextField.small { padding: 5px 8px; font-size: 14px } @media only screen and (max-width:740px) { .nfTextField.small { font-size: 16px; padding: 8px 11px } } .nfTextField:invalid, .nfTextField:valid { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none } .nfTextField:focus { border-color: #0071eb; outline: 0 } .nfTextField.error:not(#csc) { border-color: #b92d2b; background: url(../img/error.svg); background-repeat: no-repeat; background-size: 30px; background-position: top 60% right 10px } .nfTextField.error { border-color: #b92d2b; background: url(../img/error.svg); background-repeat: no-repeat; background-size: 30px; background-position: top 60% right 50px } .nfTextField.valid:not(#csc) { border-color: #5fa53f; background: url(../img/valid.svg); background-repeat: no-repeat; background-size: 30px; background-position: top 60% right 10px } .nfTextField.valid { border-color: #5fa53f; background: url(../img/valid.svg); background-repeat: no-repeat; background-size: 30px; background-position: top 60% right 50px } .nfTextField.warning, .warning>.nfTextField { border-color: #ffa00a } .nfTextField:disabled { color: #a6a6a6; border-color: #ccc } .ui-input-label .ui-text-input+.icon-lock { position: absolute; bottom: 20px; color: #8c8c8c; font-size: 19px; right: 10px } .nfInput { max-width: 500px; position: relative } .nfInput .nfInputPlacement { position: relative } .nfInput .nfInputPlacement.showInvalidIcon .nfTextField, .nfInput .nfInputPlacement.showValidIcon .nfTextField { padding-right: 40px } .nfInput .nfInputPlacement.showValidIcon:after { content: ''; position: absolute; right: 10px; top: 50%; border-bottom: 1px solid #0071eb; border-left: 1px solid #0071eb; width: 20px; height: 8px; -webkit-transform: translateY(-100%) rotate(-45deg); -moz-transform: translateY(-100%) rotate(-45deg); -ms-transform: translateY(-100%) rotate(-45deg); -o-transform: translateY(-100%) rotate(-45deg); transform: translateY(-100%) rotate(-45deg) } .nfInput .nfInputPlacement.showInvalidIcon:after { content: '\00d7'; font-size: 27px; font-weight: 200; color: #b92d2b; position: absolute; right: 10px; top: 50%; width: 20px; height: 20px; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%) } .nfInput .placeLabel { position: absolute; top: 50%; left: 10px; color: #8c8c8c; font-size: 14px; -webkit-transition: font .1s ease, top .1s ease, -webkit-transform .1s ease; transition: font .1s ease, top .1s ease, -webkit-transform .1s ease; -o-transition: font .1s ease, top .1s ease, -o-transform .1s ease; -moz-transition: font .1s ease, top .1s ease, transform .1s ease, -moz-transform .1s ease; transition: font .1s ease, top .1s ease, transform .1s ease; transition: font .1s ease, top .1s ease, transform .1s ease, -webkit-transform .1s ease, -moz-transform .1s ease, -o-transform .1s ease; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%) } @media only screen and (min-width:740px) { .nfInput .placeLabel { font-size: 16px } } .nfInput .nfTextField { height: 48px; padding: 10px 10px 0; width: 100% } .nfInput .hasText+.placeLabel, .nfInput .nfTextField:-webkit-autofill+.placeLabel, .nfInput .nfTextField:focus+.placeLabel { top: 4px; font-size: 11px; -webkit-transform: translateY(0); transform: translateY(0) } .nfInput .inputError { font-size: 13px; color: #b92d2b } .nfInput .inputCaption { font-size: 13px; color: #8c8c8c } .nfInput.validated .nfTextField { border-color: #5fa53f } .nfInput.nmHomeTextInput .ui-label-text { margin-right: 1ex } .nfInput.nmHomeTextInput .nfTextField { background-color: rgba(0, 0, 0, .8); border-color: #737373; font-size: 23px; color: #fff } .nfInput.nmHomeTextInput .nfTextField.error { border-color: #ffa00a } .nfInput.nmHomeTextInput .inputError { color: #ffa00a } .nfInput.nmHomeTextInput .inputError a { color: #ffa00a; text-decoration: underline } .nfInput.nfInputOversize .nfTextField { height: 60px } .nfInput.nfInputOversize .hasText+.placeLabel, .nfInput.nfInputOversize .nfTextField:-webkit-autofill+.placeLabel, .nfInput.nfInputOversize .nfTextField:focus+.placeLabel { top: 6px; font-weight: 700; font-size: 13px } @media screen and (min-width:740px) { .nfInput.nfInputResponsive .nfTextField { height: 60px } .nfInput.nfInputResponsive .hasText+.placeLabel, .nfInput.nfInputResponsive .nfTextField:-webkit-autofill+.placeLabel, .nfInput.nfInputResponsive .nfTextField:focus+.placeLabel { top: 6px; font-weight: 700; font-size: 13px } } .nfInput.externalLabel .nfTextField { padding: 0 10px } .nfInput.externalLabel .hasText+.placeLabel, .nfInput.externalLabel .nfTextField:focus+.placeLabel, .nfInput.externalLabel .placeLabel { top: 0; left: 0; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); font-size: 16px } .nfInput .tooltipWrapper, .nfInput .tooltipWrapperErr { position: absolute; top: 12px; right: 10px; cursor: pointer } .nfInput.tooltip .nfInputPlacement, .nfInput.tooltipError .nfInputPlacement { width: 100% } .nfInput.tooltip .nfTextField, .nfInput.tooltipError .nfTextField { padding: 10px 50px 0 10px; border: solid 1px #8c8c8c; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px } .nfInput.tooltip .nfTextField:focus, .nfInput.tooltipError .nfTextField:focus { border-color: #0071eb; outline: 0 } .nfInput.tooltipError .nfTextField { border-color: #b92d2b } .nfInput.tooltipError .nfTextField:focus { border-color: #b92d2b; outline: 0 } .nfInput.tooltipValidated .nfTextField { border-color: #5fa53f } .nfInput.tooltipValidated .nfTextField:focus { border-color: #5fa53f; outline: 0 } .nfSelectWrapper { display: inline-block; position: relative; max-width: 500px } .nfSelectWrapper>.ui-label { margin-bottom: 0 } .nfSelectWrapper .selectArrow, .nfSelectWrapper.selectArrow { display: inline-block; width: 100% } .nfSelectWrapper .selectArrow .nfSelectPlacement, .nfSelectWrapper.selectArrow .nfSelectPlacement { position: relative } .nfSelectWrapper .selectArrow .nfSelectPlacement::after, .nfSelectWrapper.selectArrow .nfSelectPlacement::after { background-color: #fff; content: ''; position: absolute; pointer-events: none; border: 6px solid; border-color: #333 #fff #fff #fff; right: 10px; top: 49% } .nfSelectWrapper .selectArrow.prefix .nfSelectPlacement.globe::before, .nfSelectWrapper.selectArrow.prefix .nfSelectPlacement.globe::before { content: '\e896' } .nfSelectWrapper .selectArrow.prefix .nfSelectPlacement::before, .nfSelectWrapper.selectArrow.prefix .nfSelectPlacement::before { top: 50%; left: 15px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-family: nf-icon; color: #333; font-size: 16px; position: absolute; pointer-events: none } .nfSelectWrapper .selectArrow.prefix .nfSelect, .nfSelectWrapper.selectArrow.prefix .nfSelect { padding-left: 42px } .nfSelectWrapper .selectArrow.inFooter .nfSelect, .nfSelectWrapper.selectArrow.inFooter .nfSelect { color: inherit } .nfSelectWrapper .placeLabel { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left: 10px; color: #8c8c8c; font-size: 14px } @media only screen and (min-width:740px) { .nfSelectWrapper .placeLabel { font-size: 16px } } .nfSelectWrapper .inputError { font-size: 13px; color: #b92d2b } .nfSelectWrapper .inputCaption { font-size: 13px; color: #8c8c8c } .nfSelectWrapper.nfSelectOversize .nfSelect { min-height: 60px; padding-top: 24px } .nfSelectWrapper.hasSelection .placeLabel { top: 4px; font-size: 11px; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0) } .nfSelectWrapper.hasSelection.nfSelectOversize .placeLabel { top: 8px; font-weight: 700 } .nfSelectWrapper.externalLabel { padding-top: 20px } .nfSelectWrapper.externalLabel .hasText+.placeLabel, .nfSelectWrapper.externalLabel .nfTextField:focus+.placeLabel, .nfSelectWrapper.externalLabel .placeLabel { bottom: -4px; left: 0; -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); font-size: 16px } .nfSelect { background: #fff; font-size: 16px; height: 48px; border: 1px solid #a6a6a6; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; width: 100%; padding: 10px 30px 12px 10px } .nfSelect::-ms-expand { display: none } .nfSelect:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000 } .nfSelect.error { border-color: #b92d2b } .nfSelect.valid { border-color: #5fa53f } .nfSelect option:disabled { color: #a6a6a6 } .nfSelectWrapper.hasSelection .nfSelect { padding: 19px 30px 4px 10px } .nf-select-input .nf-select { top: -48px; height: 48px } .nf-select-input .nf-select { padding-top: 10px } .nf-select-input-oversize .nf-select { top: -60px; height: 60px } .nf-select-input-oversize .nf-select { padding-top: 15px } .nf-select-input .nf-select, .nf-select-input-oversize .nf-select { vertical-align: top; position: relative; width: 30px; float: right; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-width: 1px 1px 1px 0; border-color: #828282; border-style: solid; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; cursor: pointer } .nf-select-input .ui-select-wrapper, .nf-select-input-oversize .ui-select-wrapper { display: block; border: none } .nf-select-input .ui-select-wrapper::after, .nf-select-input-oversize .ui-select-wrapper::after { content: none } .nf-select-input .ui-select-options, .nf-select-input-oversize .ui-select-options { margin: 1px 0 0 0; padding: 0; position: absolute; top: auto; left: -1px; width: 100%; border: 1px solid #ccc; margin-top: -1px; background: #fff; z-index: 2; max-height: 380px; overflow-y: scroll; overflow-x: hidden } .nf-select-input .nf-select-option, .nf-select-input-oversize .nf-select-option { -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .nf-select-input .nf-select-option-hidden, .nf-select-input-oversize .nf-select-option-hidden { display: none } .nf-select-input .nfInput .nfTextField, .nf-select-input-oversize .nfInput .nfTextField { padding-right: 35px } .nf-select-input .nf-select-item-list, .nf-select-input-oversize .nf-select-item-list { width: 100%; max-height: 380px; -webkit-box-sizing: inherit; -moz-box-sizing: inherit; box-sizing: inherit } .nf-select-input .ui-select-options-hidden, .nf-select-input-oversize .ui-select-options-hidden { display: none } .nf-select-input .inputError, .nf-select-input-oversize .inputError { font-size: 12px; color: #b00500 } .nf-select-input .validated .nf-select, .nf-select-input-oversize .validated .nf-select { border-color: #5fa53f } .nf-select-input-collapsed { overflow: hidden } .nf-select-input-error .nf-select, .nf-select-input-error .nfTextField { border-color: #b92d2b } .nf-select-input-valid .nf-select, .nf-select-input-valid .nfTextField { border-color: #5fa53f } .nf-select-input-focused .nf-select { border-color: #0071eb } .ui-binary-input { position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-left: 36px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; min-height: 32px; font-size: 16px; max-width: 500px } .ui-binary-input input:disabled~.helper, .ui-binary-input input[type=checkbox]:disabled+label, .ui-binary-input input[type=radio]:disabled+label { color: #a6a6a6 } .ui-binary-input .helper { font-size: 13px; line-height: 1em; color: #8c8c8c } .ui-binary-input.error>.helper { color: #b92d2b } .ui-binary-input.showInvalidIcon, .ui-binary-input.showValidIcon { padding-right: 40px } .ui-binary-input.showValidIcon:after { content: ''; position: absolute; right: 10px; top: 50%; border-bottom: 1px solid #0071eb; border-left: 1px solid #0071eb; width: 20px; height: 8px; -webkit-transform: translateY(-100%) rotate(-45deg); -moz-transform: translateY(-100%) rotate(-45deg); -ms-transform: translateY(-100%) rotate(-45deg); -o-transform: translateY(-100%) rotate(-45deg); transform: translateY(-100%) rotate(-45deg) } .ui-binary-input.showInvalidIcon:after { content: '\00d7'; font-size: 27px; font-weight: 200; color: #b92d2b; position: absolute; right: 10px; top: 50%; width: 20px; height: 20px; -webkit-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%) } .ui-binary-input input[type=checkbox], .ui-binary-input input[type=radio] { position: absolute; top: 0; left: 0; opacity: 0 } .ui-binary-input input[type=checkbox]:focus+label::before, .ui-binary-input input[type=radio]:focus+label::before { border-color: #0071eb } .ui-binary-input input[type=checkbox]+label, .ui-binary-input input[type=radio]+label { position: relative; display: block; line-height: 1.2; padding: 6px 0 } .ui-binary-input input[type=checkbox]+label:before, .ui-binary-input input[type=radio]+label:before { content: ""; position: absolute; display: block; top: 2px; left: -36px; padding: 0; border: 1px solid; background-color: #fff } .ui-binary-input input[type=checkbox]+label:after, .ui-binary-input input[type=radio]+label:after { position: absolute } .ui-binary-input input[type=checkbox]+label { margin: 8px 0 } .ui-binary-input input[type=checkbox]+label:before { width: 25px; height: 25px } .ui-binary-input input[type=checkbox]:checked+label:after { display: block; position: absolute; top: 7px; left: -32px; height: 6px; width: 14px; color: #0071eb; content: ""; border-bottom: 4px solid; border-left: 4px solid; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg) } .ui-binary-input input[type=radio]+label:before { width: 25px; height: 25px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50% } .ui-binary-input input[type=radio]:checked+label:after { content: ""; top: 8px; left: -30px; width: 15px; height: 15px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background-color: #0071eb } .ui-binary-input.error input[type=checkbox]+label:before, .ui-binary-input.error input[type=radio]+label:before { border-color: #b92d2b } .selectError { font-size: 13px; color: #b92d2b } .nf-message-container { display: table; width: 100%; margin: 10px 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px } .nf-message-contents { display: table-cell; vertical-align: middle; padding: 20px 10px; color: #fff } .nf-message-contents a { color: inherit; text-decoration: underline } .nf-message-link { color: #fff; text-decoration: underline } .nf-message-icon { display: table-cell; vertical-align: middle; color: #fff; width: 53px } .nf-message-icon:before { font-family: nf-icon; line-height: 1.5em; padding-left: 20px; font-size: 1.5em } .nf-message-subtle { background-color: #f7f7f7; border: solid 1px #ccc } .nf-message-subtle>.nf-message-icon { color: #000 } .nf-message-subtle>.nf-message-icon:before { content: '\e799' } .nf-message-subtle .nf-message-contents { color: #000 } .nf-message-info { background: #0071eb } .nf-message-info>.nf-message-icon:before { content: '\e799' } .nf-message-wait { text-align: center } .nf-message-warn { background: #ffa00a } .nf-message-warn>.nf-message-icon:before { content: '\e796' } .nf-message-error { background: #ffa00a } .nf-message-error>.nf-message-icon:before { content: '\e805' } .nf-message-success { background: #5fa53f } .nf-message-success>.nf-message-icon:before { content: '\e802' } .basic-spinner { display: inline-block; margin: 0 auto; opacity: 1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-position: center center; background-image: url(https://assets.nflxext.com/ffe/siteui/common/site-spinner-240.png); width: 57px; height: 57px; -webkit-animation: full-rotation 1s infinite linear; -moz-animation: full-rotation 1s infinite linear; -o-animation: full-rotation 1s infinite linear; animation: full-rotation 1s infinite linear; -webkit-animation-direction: normal; -moz-animation-direction: normal; -o-animation-direction: normal; animation-direction: normal } .basic-spinner.isHidden { display: none } .basic-spinner.basic-spinner-light { background-image: url(../img/bt_spinner.png) } .center-fixed { position: fixed; top: 50%; left: 50%; z-index: 2000 } .center-absolute { position: absolute; top: 50%; left: 50% } .ua-ie-7 .basic-spinner, .ua-ie-8 .basic-spinner, .ua-ie-9 .basic-spinner { background-image: url(https://assets.nflxext.com/ffe/siteui/common/site-spinner-100.gif) } @-webkit-keyframes full-rotation { from { -webkit-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0) } to { -webkit-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg) } } @-moz-keyframes full-rotation { from { -moz-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0) } to { -moz-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg) } } @-o-keyframes full-rotation { from { -o-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0) } to { -o-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg) } } @keyframes full-rotation { from { -webkit-transform: translate(-50%, -50%) rotate(0); -moz-transform: translate(-50%, -50%) rotate(0); -o-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0) } to { -webkit-transform: translate(-50%, -50%) rotate(360deg); -moz-transform: translate(-50%, -50%) rotate(360deg); -o-transform: translate(-50%, -50%) rotate(360deg); transform: translate(-50%, -50%) rotate(360deg) } } ::-moz-focus-inner { padding: 0; border: 0 } .nf-btn { display: inline-block; text-decoration: none; line-height: 1rem; vertical-align: middle; cursor: pointer; font-weight: 700; letter-spacing: .025rem; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: none; position: relative; min-height: 48px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .25); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .25); box-shadow: 0 1px 1px rgba(0, 0, 0, .25); color: #000 } .nf-btn .nf-btn-text { position: relative; top: 1px } .nf-btn:disabled { cursor: default; opacity: .5; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none } .nf-btn.waiting:disabled { color: transparent } .nf-btn.hover, .nf-btn:hover { text-decoration: none; background: #d9d9d9 } .nf-btn.active, .nf-btn:active { background: #ccc } .waitIndicator { display: none } [disabled]>.waitIndicator { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block } .nf-btn-solid.nf-btn-primary { color: #fff; background-color: #e50914 } .nf-btn-solid.nf-btn-primary.hover, .nf-btn-solid.nf-btn-primary:hover { background-color: #f6121d } .nf-btn-solid.nf-btn-primary.active, .nf-btn-solid.nf-btn-primary:active { background-color: #e50914 } .nf-btn-solid.nf-btn-primary:disabled { opacity: .5 } .nf-btn-solid.nf-btn-primary.waiting:disabled { color: transparent } .nf-btn-solid.nf-btn-secondary { color: #000; background-color: #ccc } .nf-btn-solid.nf-btn-secondary.hover, .nf-btn-solid.nf-btn-secondary:hover { background: #d9d9d9 } .nf-btn-solid.nf-btn-secondary.active, .nf-btn-solid.nf-btn-secondary:active { background: #ccc } .nf-btn-solid.nf-btn-secondary:disabled { color: #737373 } .nf-btn-solid.nf-btn-secondary.waiting:disabled { color: transparent } .nf-btn-outline { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: inline-block; border: 1px solid } .nf-btn-outline.nf-btn-primary { background-color: transparent; color: #e50914; padding: 13px 2rem; cursor: pointer; text-decoration: none; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px } .nf-btn-outline.nf-btn-primary:focus, .nf-btn-outline.nf-btn-primary:hover { background-color: rgba(0, 0, 0, .05); text-decoration: none } .nf-btn-outline.nf-btn-primary:active { background-color: rgba(0, 0, 0, .15) } .nf-btn-outline.nf-btn-secondary { color: #333; background: rgba(0, 0, 0, 0); border: solid 1px } .nf-btn-outline.nf-btn-secondary.hover, .nf-btn-outline.nf-btn-secondary:hover { background: rgba(0, 0, 0, 0); border: solid 1px } .nf-btn-outline.nf-btn-secondary.active, .nf-btn-outline.nf-btn-secondary:active { background: rgba(0, 0, 0, 0); border: solid 1px } .nf-btn-outline.nf-btn-secondary:disabled { background: 0 0; border: solid 1px } .nf-btn-outline.nf-btn-secondary.waiting:disabled { color: transparent } .nf-btn-retro { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: inline-block } .nf-btn-retro.nf-btn-primary { background-color: #0f84fa; color: #fff; padding: 13px 2rem; cursor: pointer; text-decoration: none } .nf-btn-retro.nf-btn-primary.hover, .nf-btn-retro.nf-btn-primary:hover { background-color: #2891fb } .nf-btn-retro.nf-btn-primary.active, .nf-btn-retro.nf-btn-primary:active { background-color: #0f84fa } .nf-btn-retro.nf-btn-secondary { color: #333; background: #ccc } .nf-btn-retro.nf-btn-secondary.hover, .nf-btn-retro.nf-btn-secondary:hover { background-color: #d9d9d9 } .nf-btn-retro.nf-btn-secondary.active, .nf-btn-retro.nf-btn-secondary:active { background-color: #ccc } .nf-btn-block { display: block; margin-left: 0; margin-right: 0 } .nf-btn { position: relative; font-size: 1rem; padding: .75rem 1.33333333rem; min-width: 74px; min-height: 48px; width: 100% } @media only screen and (min-width:500px) { .nf-btn { width: auto } } .nf-btn.nf-btn-large { font-size: 16px; padding: .75rem 21.33333333px; min-width: 104px; min-height: 48px } .nf-btn .nf-btn-explain { font-size: 13px } .nf-btn.nf-btn-oversize { font-size: 19px; padding: .75rem 25.33333333px; min-width: 110px; min-height: 60px; width: 100%; line-height: 19px } .nf-btn.nf-btn-oversize .nf-btn-explain { font-size: 19px; margin-top: 4px } .nf-btn.nf-btn-small { display: block; padding: 0; line-height: 50px } @media only screen and (min-width:500px) { .nf-btn.nf-btn-small { display: inline-block; font-size: 13px; padding: .75rem 17.33333333px; min-width: 98px; min-height: 37px; margin-right: .5rem; padding-left: 1rem; padding-right: 1rem; width: auto; line-height: 1rem } } .background-dark .nf-btn-outline.nf-btn-secondary { color: #fff } .nf-btn-align-center, .nf-btn-align-left, .nf-btn-align-right { margin-bottom: 1rem } @media only screen and (min-width:500px) { .nf-btn-align-left { margin-right: 1rem; margin-left: 0; margin-bottom: 0 } .nf-btn-align-right { margin-right: 0; margin-left: 1rem; margin-bottom: 0 } .nf-btn-align-center { margin-right: .5rem; margin-left: .5rem; margin-bottom: 0 } } .body-modal-open { overflow: hidden } .nfModalBackground { position: fixed; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0, 0, 0, .65); z-index: 100; overflow: auto; overflow: scroll; -webkit-overflow-scrolling: touch } .nfModalBackground.opaque { background-color: #000 } .nfModalBackground.opaque .nfModalBox { color: #fff; background-color: transparent } .nfModalBackground.clearBackground { background-color: transparent } .nfModalBackground.fluidWidth { text-align: center } .nfModalBackground.fluidWidth .nfModalBox { display: inline-block; text-align: left; max-width: none } .nfModalBox { max-width: 640px; min-height: 200px; color: inherit; font-size: .9em; text-align: left; margin: 12% auto 0; overflow: visible; background-color: #fff; padding-bottom: 20px } .nfModalBox.small { width: 500px; min-height: 150px; padding-bottom: 0 } .nfModalBox.large { max-width: 700px; width: 700px; min-height: 250px; margin-top: 3% } @media only screen and (max-width:790px) { .nfModalBox.large, .nfModalBox.small { width: 90% } } @media only screen and (max-width:500px) { .nfModalBox { width: 95% } } .nfModalFoot, .nfModalHead { -webkit-border-radius: inherit; -moz-border-radius: inherit; border-radius: inherit; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0; border-bottom-right-radius: 0; min-height: 18px } .nfModalContent, .nfModalFoot, .nfModalHead { padding: 6px 20px } @media only screen and (max-width:500px) { .nfModalContent, .nfModalFoot, .nfModalHead { padding: 6px 10px } } .nfModalHead { border-bottom-radius: 0; position: relative; margin-bottom: 10px } .nfModalHead .nfModalTitle { font-size: 19px; margin: 10px 20px 0 0; padding: 0; color: inherit } @media screen and (max-width:740px) { .nfModalHead .nfModalTitle { font-size: 16px } } .nfModalHead .nfModalSubHead { margin: 5px 0 0 } .nfModalContent .topImg { display: block; min-height: 300px; min-width: 400px; margin: 15px auto 0 } .nfModalClose { color: #737373; position: absolute; display: block; cursor: pointer; text-align: center; margin: 0; padding: 0; text-decoration: none; top: 50%; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); right: 10px } .nfModalClose:hover { text-decoration: none } .nfModalClose:active { color: #a6a6a6 } .nfModalClose:before { content: '\00D7'; font-size: 40px } .ui-svg-icon { speak: none; font-style: normal; font-weight: 400; font-variant: normal; text-transform: none; line-height: 1; height: 1em; width: 1em; margin: 0 .2em; display: inline-block; -moz-background-size: contain; background-size: contain; background-repeat: no-repeat; background-position: center center; position: relative; top: 2px } .ui-svg-icon.ui-svg-icon--email { background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/reg_selection/email.svg) } .ui-svg-icon.ui-svg-icon--google { background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/reg_selection/google.svg) } .ui-svg-icon.ui-svg-icon--apple { background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/reg_selection/apple.svg) } .ui-svg-icon.ui-svg-icon--mobile { background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/reg_selection/mobile.svg) } .ui-svg-icon.ui-svg-icon--chevron { background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/reg_selection/chevron_060915_2.svg) } .ui-svg-icon.ui-svg-icon--chevron path.iconic-property-stroke { stroke: #ccc!important } .ui-svg-icon.pull-right { float: right } .nfTabSelection { display: block; color: #333; background-color: #fff; padding: 20px 3px 20px; margin: 5px 0; border: 2px solid #ccc; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; -webkit-transition: position .5s ease-in; -o-transition: position .5s ease-in; -moz-transition: position .5s ease-in; transition: position .5s ease-in } .nfTabSelection.nfTabSelection:active .ui-svg-icon--chevron { color: #0071eb } .nfTabSelection.nfTabSelection--disabled { color: #a6a6a6; border: 2px solid #e6e6e6; cursor: default } .nfTabSelection.nfTabSelection--disabled .logos { opacity: .2 } .nfTabSelection.nfTabSelection--text { line-height: 25px } .nfTabSelection.nfTabSelection--selected { background-color: #737373; color: #fff } .nfTabSelection .ui-svg-icon { font-size: 23px; margin-right: 10px; vertical-align: bottom } .nfTabSelection .ui-svg-icon.ui-svg-icon--chevron { font-size: 19px } .nfTabSelection .ui-svg-icon.ui-svg-icon--apple { top: 0 } .nfTabSelection--input { display: none } body { background: #fff } .basicLayout.simplicity { min-height: 100vh; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -moz-box-orient: vertical; -moz-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding-bottom: 0 } .basicLayout.simplicity .simpleContainer { -webkit-box-flex: 1; -webkit-flex-grow: 1; -moz-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .simpleContainer { width: 100%; overflow: hidden; -webkit-tap-highlight-color: transparent } #appMountPoint .simpleContainer { padding-bottom: 95px } .simpleContainer .input-message { position: initial; text-align: left; height: auto } .site-footer-wrapper { opacity: 1; margin-top: 0; background-color: #f3f3f3 } .site-footer-wrapper.invisible { opacity: 0 } .centerContainer { overflow: hidden; display: none } .centerContainer.firstLoad { display: block } .planStepLogo { background: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/Checkmark.png) no-repeat 50% 50%; -moz-background-size: 60px; background-size: 60px; height: 60px } .paymentStepLogo { background: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/Lock.png) no-repeat 50% 50%; -moz-background-size: 60px; background-size: 60px; height: 60px } .regStepLogo { background: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/Devices.png) no-repeat 50% 50%; height: 90px; -moz-background-size: 260px; background-size: 260px } .planContainer, .regContainer, .verifyCardContainer { text-align: center; max-width: 440px; margin: 0 auto } .planContainer .stepLogo, .regContainer .stepLogo, .verifyCardContainer .stepLogo { display: block; margin: 10% 0 10% } .planContainer .contextRow, .regContainer .contextRow, .verifyCardContainer .contextRow { max-width: 300px; display: inline-block } .planContainer .contextBody, .regContainer .contextBody, .verifyCardContainer .contextBody { margin: 30px 0; font-size: 19px } .planSelectionContainer .headerRow.fix { background-color: #f3f3f3 } @media screen and (max-width:600px) { .planSelectionContainer .headerRow.fix { background-color: #f3f3f3 } } .fixedComp { opacity: 0; position: fixed; left: 3%; right: 3%; bottom: 20px; z-index: 10 } .fixedComp.firstLoad { opacity: 1 } .fixedCta .fixedCtaContainer { padding-bottom: 20px; margin-bottom: 0 } .fixedCta .fixedCtaContainer .submitBtnContainer { display: none } .fixedCta .site-footer-wrapper { margin-top: 0; margin-bottom: 80px } .contextBody p { margin: 0 0 1em 0 } .simpleContainer .cvvInfo { position: absolute; right: 10px; top: 20px; font-size: 23px; cursor: pointer } .signupTerms { font-size: 13px; color: #828282; margin: 20px 3% } .signupTermsError { color: #b92d2b; font-size: 16px } .submitBtnContainer { text-align: center; max-width: 440px; margin: 0 auto } .submitBtnContainer .card-type-text { float: left } .submitBtnContainer .logos { margin-right: 10px } .submitBtnContainer .paymentActive { color: #0071eb } .submitBtnContainer span { vertical-align: middle } .hasAcceptedTermsOfUse .checkboxMsg { display: block; color: #b92d2b; margin-bottom: 10px; margin-left: -35px } .cvvInfoContainer { max-width: 420px; margin: 0 auto } .cvvInfoContainer .ccCVV { list-style-type: none; background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/CvvInfo.png); background-repeat: no-repeat; -moz-background-size: 100%; background-size: 100%; width: 100%; height: 0; padding-top: 108% } @media (-webkit-min-device-pixel-ratio:2), (-o-min-device-pixel-ratio:2/1), (min-resolution:192dpi) { .cvvInfoContainer .ccCVV { background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/CvvInfo2x.png) } } .nf-btn.simplicityBtn { min-height: 60px; width: 100% } .simpleContainer .input-password-input, .simpleContainer .ui-text-input { height: 60px } .simplicity-remix .welcome { font-weight: 400 } .nf-phone-input { border: solid 1px #828282; background-color: #fff; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex } .nf-phone-input .nfTextField, .nf-phone-input .ui-select-wrapper { border: none } .nf-phone-input .nfTextField .ui-select-current, .nf-phone-input .ui-select-wrapper .ui-select-current { width: 60px } .nf-phone-input .nfInput { min-width: 300px } .nf-phone-input .nf-flag { -webkit-transform: scale(1.5, 1.5); -moz-transform: scale(1.5, 1.5); -ms-transform: scale(1.5, 1.5); -o-transform: scale(1.5, 1.5); transform: scale(1.5, 1.5); height: 17px } .nf-phone-input .country-select-flag { margin: 10px 0 0 5px } .nf-phone-input .ui-select-wrapper::after { color: #a6a6a6; top: 20px } .nf-phone-input .native-select { left: 0; font-size: 16px } .error>.nf-phone-input, .nf-phone-input.error { border-color: #b92d2b } .nf-phone-input-wrapper .nfInput, .nf-phone-input-wrapper-s .nfInput { min-width: 200px } .nf-phone-input-wrapper .inputError, .nf-phone-input-wrapper-s .inputError { font-size: 13px; color: #b92d2b } .nf-phone-input-wrapper-s .ui-select-wrapper { cursor: none } .nf-phone-input-wrapper-s .ui-select-wrapper:after { content: normal } .nf-phone-input-wrapper-s .ui-select-wrapper.country-select { width: 40px } #tmcontainer { position: absolute } .paymentContainer { text-align: center; max-width: 500px; margin: 0 auto } .paymentContainer .stepHeader { margin-top: 20px } .paymentContainer .stepLogo { display: block; margin: 5% 0 0 } .paymentContainer .narrowContainer { max-width: 205px; margin: 0 auto } .paymentContainer .orderSummary { text-align: left } .paymentContainer .contextBody { padding: 0 15% } .paymentContainer .contextRow { margin-bottom: 20px } .paymentContainer .contextRowFirst { margin-top: 20px } .paymentContainer .todayPay { background-color: #ccc; padding: 20px 15%; margin: 10px 0 } .paymentContainer .summaryLabel { float: left } .paymentContainer .summaryPrice { float: right } .paymentContainer .giftFreeMonth { font-size: 23px; font-weight: 700 } .paymentContainer .giftOnlyLink { font-weight: 700 } .paymentContainer .mopPaintedDoorError { color: #b92d2b; font-size: 13px; padding-bottom: 10px; text-align: left } .paymentContainer .redeemLink { margin-top: 20px } .paymentContainer .ituneContext { font-size: 12px; text-align: left } .paymentPicker { text-align: left; padding: 0; position: relative } .paymentPicker.standardHeight { height: 60px; line-height: 60px } .paymentPicker.standardHeight .logos-inline { max-height: 60px; line-height: normal } .paymentPicker.tallHeight { height: 80px; line-height: 80px } .paymentPicker .mopNameAndLogos { width: 90%; display: inline-block } .paymentPicker .selectionLabel { vertical-align: middle; display: inline-block; line-height: normal } .paymentPicker .logos .PAYPAL { margin: 3px 0 0 } @media only screen and (max-width:500px) { .paymentPicker.alwaysShowLogos { height: 65px; line-height: 25px } .paymentPicker.alwaysShowLogos .mopNameAndLogos { padding-top: 10px } .paymentPicker.alwaysShowLogos .card-type-text { float: none } } .paymentPicker .card-type-text { margin: 0 15px; float: left; max-width: 60% } @media only screen and (max-width:500px) { .paymentPicker .card-type-text { max-width: none } } .paymentPicker .logosContainer { overflow: hidden; margin: 0 15px } @media only screen and (max-width:500px) { .paymentPicker .logosContainer { display: none } } .paymentPicker .logosContainerNotHidden { overflow: hidden; margin: 0 15px } .paymentPicker .logoIcon { display: inline-block } .paymentPicker .pickerArrow { position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%) } .bankChoiceForm .accountNumber { width: 78%; display: inline-block } .bankChoiceForm .accountNumberCheckDigits { width: 20%; float: right } .retryContent .retryTitle { font-weight: 700; padding-bottom: 10px; font-size: 23px } .retryContent .retryContext { padding-bottom: 15px; font-size: 16px } .retryContent .retrySection { background-color: #e5e5e5; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; padding: 15px; margin-bottom: 30px; position: relative; font-size: 16px } .retryContent .retrySection .logoIcon { margin-right: 5px } .retryContent .retrySection .yourCardTitle { font-size: 13px; font-weight: 700; padding-bottom: 5px; color: grey } .retryContent .retrySection .yourCardNum { padding-left: 10px } .retryContent .retrySection .yourCardDate { padding-left: 10px } .retryContent .retrySection .changeLink { position: absolute; top: 40%; right: 15px } .retryContent .retryOrSection { padding-top: 5px; padding-bottom: 30px; text-align: center } .retryContent .retryOrSection .retryOrText { font-weight: 700; position: relative; top: 12px; background: #fff; display: inline-block; padding: 0 20px; font-size: 19px } .retryContent .retryOrSection .retryOrSeperator { height: 1px; background: #ccc } .retryContent .submitBtnContainer { margin-bottom: 15px } .retryContent .retryNewCardContext { padding-bottom: 15px; font-size: 16px } .retryContent .changePaymentBtn { margin-bottom: 15px; display: block } .paymentFormContainer { text-align: left; max-width: 440px; margin: 0 auto } .paymentFormContainer .changePaymentContainer { margin: .5rem 0 1.5rem 0 } .paymentFormContainer .changePaymentLink { text-decoration: none } .paymentFormContainer .changePaymentLink:active, .paymentFormContainer .changePaymentLink:focus, .paymentFormContainer .changePaymentLink:hover { border-bottom: 1px solid } .paymentFormContainer .changePaymentLink .changePaymentText { vertical-align: top } .paymentFormContainer .changePaymentLink .icon-thin-caret-left { margin-right: 5px } .paymentFormContainer .contextContainer { text-align: left; margin-bottom: 30px } .paymentFormContainer .fieldContainer { margin-bottom: 30px } .paymentFormContainer .isHidden { display: none } .paymentFormContainer .simpleForm { text-align: left; margin-top: 10px } .paymentFormContainer .ui-label { margin-bottom: 10px } .paymentFormContainer .paypalText { margin: 20px 3% 0 } .paymentFormContainer .logos-block { display: inline-block } .paymentFormContainer .logos-inline { position: absolute; top: 20px; z-index: 10; right: 5px } .submitBtnContainer .icon-paypal-container { vertical-align: top } .coDebitAccountType { color: #828282; font-size: 13px } .coDebitAccountType ul { margin-top: 5px } .coDebitAccountType label { cursor: pointer } .coDebitAccountType .radioSelectLabel { font-weight: 700 } .coDebitAccountType .radioSelectOption { display: inline-block; margin-right: 20px } .coDebitAccountType .radioSelectOption input[type=radio]:focus+label::before { border-color: #e50914 } .coDebitAccountType .radioSelectOption input[type=radio]:checked+label:after { background-color: #e50914 } .cardNumberContainer { position: relative } .cardDesignContainer { padding: 10px; border: 1px solid #ccc; background-color: #e5e5e5; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-top: 15px; min-height: 220px } .cardDesignContainer .cardTopSection { height: 60px; line-height: 60px; padding: 0 10px; color: #737373 } .cardDesignContainer .cardTopSection .logos { position: absolute; right: 0 } .cardDesignContainer .secure { display: inline-block; line-height: normal; width: 100%; position: relative } .cardDesignContainer .secure-text { margin-left: 10px } .cardDesignContainer .cardNumberContainer { position: relative; margin-bottom: 10px } .cardDesignContainer .halfWidth { width: 49%; margin-right: 2%; vertical-align: top; display: inline-block } .cardDesignContainer .halfWidth:last-of-type { margin-right: 0 } .cardDesignContainer .thirdWidth { width: 32%; margin-right: 2%; vertical-align: top; display: inline-block } .cardDesignContainer .thirdWidth:last-of-type { margin-right: 0 } .cardDesignContainer .unfocused.valid input { border: 0 } .accordionHeader .accordionHeaderContent { text-align: left; margin: 0 auto; max-width: 500px } .change-plan-box { margin-top: 1em } .change-plan-box__content { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: #e5e5e5; line-height: 1.5em; margin: 0 auto 1em; padding: 1em; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: grey; max-width: 500px } @media screen and (max-width:440px) { .change-plan-box { padding: 0 3% } } .change-plan-box__plan-price { font-weight: 700; color: #000 } .change-plan-box .content__left { float: left; text-align: left } .change-plan-box .content__right { float: right; text-align: right } .change-plan-box .content__right p { margin: 0 } .change-plan-box .edit-plan-link { font-weight: 700 } .change-plan-box .free-trial-section .free-until-date { color: #000 } .accordion-payment { text-align: left; padding: 0; position: relative } .accordion-payment__form-container { max-width: 500px; margin: 0 auto } .accordion-payment .expando { background-color: #fff; margin: 5px 0; border: 2px solid #ccc; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px } .accordion-payment .expando-header { padding: 0 20px; cursor: pointer } .accordion-payment .expando-header .logos { overflow: hidden; display: inline-block; margin: 0 15px } @media only screen and (max-width:440px) { .accordion-payment .expando-header .logos { display: none } } .accordion-payment .expando-header.standardHeight { height: 60px; line-height: 60px } .accordion-payment .expando-header.standardHeight .logos-inline { max-height: 60px; line-height: normal } .accordion-payment .expando-header.tallHeight { height: 80px; line-height: 80px } .accordion-payment .expandoContent { padding: 0 20px 20px } .accordion-payment .expandoContent .cardNumberContainer .logos-inline { position: absolute; top: 20px; z-index: 10; right: 5px } .accordion-payment .expandoContent .fieldContainer { margin-top: 15px } .accordion-payment .mopNameAndLogos { width: 90%; vertical-align: middle; line-height: normal; display: inline-block } .accordion-payment .accordion-cc-logos { margin: 0 0 15px 0; display: none } @media only screen and (max-width:440px) { .accordion-payment .accordion-cc-logos { display: block } } .accordion-payment .logos .PAYPAL { margin: 0 } .accordion-payment .card-type-text { margin: 0 15px; float: left } .accordion-payment .logoIcon { display: inline-block } .accordion-payment .mopNameAndLogos .ui-svg-icon--chevron { -webkit-transition: -webkit-transform .2s linear; transition: -webkit-transform .2s linear; -o-transition: -o-transform .2s linear; -moz-transition: transform .2s linear, -moz-transform .2s linear; transition: transform .2s linear; transition: transform .2s linear, -webkit-transform .2s linear, -moz-transform .2s linear, -o-transform .2s linear } .accordion-payment .mopNameAndLogos .chevron--rotate-down { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg) } .paymentForm.expando { border: 2px solid #dcdde0; padding-left: 20px; padding-right: 20px; background-color: #fff; margin: 0 auto; max-width: 500px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom: 10px } .paymentForm .icon-error, .paymentForm .icon-valid { position: absolute; display: inline-block; left: 100%; top: 45%; margin-left: 0 } .paymentForm .input-message.error { height: 8px } .paymentForm .expiration-date .ui-select-wrapper { padding-bottom: 0 } .paymentForm .expiration-date .icon-error, .paymentForm .expiration-date .icon-valid { left: 98%; top: 34% } .paymentForm .ui-inline, .paymentForm .ui-text-input { display: inline-block } .paymentForm .ui-input-half { width: 44%; margin-right: 4%; margin-bottom: 14px; vertical-align: top; padding-bottom: 9px } .paymentForm ul.ui-columns-2 { vertical-align: top; -webkit-column-width: 380px; -moz-column-width: 380px; column-width: 380px; -webkit-column-gap: 1em; -moz-column-gap: 1em; column-gap: 1em } .paymentForm ul.ui-columns-2 li { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid; margin-bottom: 0 } .paymentForm .cardAndLogos .logos { display: inline-block; left: 45%; margin: 25px -50% 0 0; width: 50% } .paymentForm .cardAndLogos .logos .logoIcon { margin-bottom: 8px } .paymentForm .expiration-date.ui-input-half { position: relative; vertical-align: top } .paymentForm .date-of-birth { display: inline-block; margin-right: 5%; width: 45%; min-width: 348px } .paymentForm .date-of-birth .ui-label { margin-bottom: 0 } .paymentForm .date-of-birth .dob-date { max-width: 93px } .paymentForm .date-of-birth .dob-year, .paymentForm .date-of-birth .ui-select-wrapper { display: inline-block } .paymentForm .date-of-birth .ui-select-wrapper { margin-right: 3% } .paymentForm .date-of-birth .dob-year { width: 36%; vertical-align: baseline } .paymentForm .date-of-birth .ui-select.medium { padding: 12px 20px; max-height: 44px } .paymentForm hr { display: inline-block; vertical-align: middle } .paymentForm .btn-secure-wrapper { float: left } .paymentForm .terms { color: #676767; font-size: 11px; margin-bottom: 10px; line-height: 14.3px; margin-top: 2px } .paymentForm .terms a { color: #676767 } .paymentForm input:disabled { background-color: #eee } .paymentForm .ui-select.medium { padding: 11px 10px 11px 14px; max-height: 44px } .paymentForm .ui-text-input { font-size: 16px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse { background-color: #eef2f8; border: 1px solid #ddd; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; position: relative; padding: 12px 0 12px 50px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse .cssCheckbox { margin-right: 7px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse span { vertical-align: middle; display: inline-block; line-height: 1.2; font-size: 15px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse p { margin-top: 0 } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse .checkboxMsg { display: block; color: #d9181e; font-weight: 700; font-size: 16px; margin-bottom: 10px; margin-left: -35px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse .checkboxMsg+label { color: #d9181e; padding-top: 0 } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse #hasAcceptedTermsOfUse+label { display: inline-block; line-height: 2; vertical-align: top; width: 85%; white-space: normal; font-size: 15px; min-height: 0; padding-top: 0 } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse #hasAcceptedTermsOfUse+label span::before { border: 1px solid #999; -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, .3) inset; -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, .3) inset; box-shadow: 2px 2px 2px rgba(0, 0, 0, .3) inset; cursor: pointer; display: inline-block; margin-right: 7px; background-color: #fff } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse .helper { color: #b00500; position: absolute; font-size: 12px; height: 32px; left: 0; bottom: -34px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.altTerms { color: grey; background-color: inherit; border: none; padding-left: 35px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.altTerms label, .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.altTerms span { font-size: 12px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.altTerms .checkboxMsg { font-size: 16px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.altTerms .helper { bottom: -15px } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.error { border-color: #b00500 } .paymentForm .ui-binary-input.hasAcceptedTermsOfUse.valid { border-color: #5fa53f } .paymentForm .ui-binary-input #hasAcceptedTermsOfUse:checked+label span::before { background: url(https://assets.nflxext.com/en_us/layout/signup/streaming/check.png) no-repeat #fff; background-position: 2px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: transparent } .paymentForm .cvv-hover { display: inline-block; position: relative; margin-left: 15px; top: 19px } .paymentForm .cvv-hover a { outline: 0; display: block; padding-top: 10px } .paymentForm .cvv-hover .layer { z-index: 9999; position: absolute; background-color: #fff; padding: 5px; text-align: left; border: 1px solid #c2c2c2; -moz-box-shadow: 0 0 20px #000; -webkit-box-shadow: 0 0 20px #000; box-shadow: 0 0 20px #000; left: -150px; top: -164px } .paymentForm .cvv-hover .layer.GIFT { left: 30px; top: -37px } .paymentForm .cvv-hover .arrow-down { position: absolute; z-index: 9999; background-position: -3px -160px; height: 45px; width: 90px } .paymentForm .cvv-hover .cvvlogo.AMEX { background: url(https://assets.nflxext.com/en_us/layout/ecweb/payment/security_card_dual.png) no-repeat 0 0; width: 306px; height: 105px } .paymentForm .cvv-hover .cvvlogo.GIFT { background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/icon_back_netflix_giftcard.png) no-repeat 0 0; width: 155px; height: 99px } .paymentForm .secure { position: relative; top: -6px } .paymentForm .secure .secure-text { font-size: 12px; color: #666 } .paymentForm .secure .icon-lock { position: relative; top: 2px; left: 5px } .paymentForm .creditCardSecurityCode, .paymentForm .debitCardSecurityCode { width: 160px; margin-right: 5px; vertical-align: top } .paymentForm .creditCardPassword { width: 75px; margin-right: 5px; vertical-align: top } .paymentForm .creditCardPassword .ui-label-text { white-space: nowrap } .paymentForm .creditCardPassword .icon-error, .paymentForm .creditCardPassword .icon-valid { left: 110px } .paymentForm .creditCardPassword .input-message { width: 150px } .paymentForm .cc-intl { font-size: 14px; padding-bottom: 10px } .paymentForm .cc-placeholder { display: inline-block; position: relative; font-size: 20px; margin-top: 25px; width: 35px; overflow: hidden } .paymentForm .creditZipcode { width: 200px } .paymentForm .expiration-date hr { width: 4%; margin: 0 3% } .paymentForm .expiration-date .expMonth { width: 47%; min-height: 62px } .paymentForm .expiration-date .expMonth select { width: 100% } .paymentForm .expiration-date .expYear { width: 40%; min-height: 62px } .paymentForm .expiration-date .expYear select { width: 100% } .paymentForm .expiration-date .expMonth.error select, .paymentForm .expiration-date .expYear.error select { border-color: #b00500 } .paymentForm .mop-painted-door-text, .paymentForm .paypal-text { font-size: 15px; display: block } .paymentForm .pbl-header { font-weight: 700; font-size: 16px; margin-bottom: 15px } .paymentForm .pbl-text { font-size: 15px; margin-bottom: 20px } .paymentForm .pbl-sl-bk-label { font-size: 15px; margin-bottom: 5px; display: block } .paymentForm .pbl-logo, .paymentForm .pbl-logo-cur, .paymentForm .pbl-logo-df { border: 1px solid #e5e5e5; opacity: 1; margin-right: 10px } .paymentForm .pbl-logo-cur { border: 1px solid #333 } .paymentForm .pbl-logo-df { cursor: pointer } .paymentForm .pbl-logo { opacity: .4 } .paymentForm .pbl-dd-divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5 } .expandoContent .fieldContainer .simpleForm { margin-top: 10px } .payment-accordion-container { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; max-width: 500px; margin: 0 auto } .payment-accordion .expando-header { position: relative; padding: 0; text-align: left; cursor: pointer } .payment-accordion .expando-header.standardHeight { height: 60px; line-height: 60px } .payment-accordion .expando-header.standardHeight .logosContainer { display: inline } @media only screen and (max-width:500px) { .payment-accordion .expando-header.standardHeight .logosContainer { display: none } } .payment-accordion .expando-header.standardHeight .logos-inline { max-height: 60px; line-height: normal } .payment-accordion .expando-header.tallHeight { height: 80px; line-height: 80px } .payment-accordion .expando-header.tallHeight .logosContainer { margin-top: 5px } @media only screen and (max-width:500px) { .payment-accordion .expando-header.tallHeight .logosContainer { display: none } } .payment-accordion .expando-header.tallHeight .logos-inline { line-height: normal } .payment-accordion .expando-header .arrow-container { float: left; width: 10%; margin: 0; vertical-align: middle; height: 100% } .payment-accordion .expando-header .ui-svg-icon--chevron { height: 100%; -webkit-transition: -webkit-transform .2s linear; transition: -webkit-transform .2s linear; -o-transition: -o-transform .2s linear; -moz-transition: transform .2s linear, -moz-transform .2s linear; transition: transform .2s linear; transition: transform .2s linear, -webkit-transform .2s linear, -moz-transform .2s linear, -o-transform .2s linear } .payment-accordion .expando-header .chevron--rotate-down { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg) } .payment-accordion .expando-header .mopNameAndLogos { width: 90%; vertical-align: middle; display: inline-block; line-height: normal } .payment-accordion .expando-header .logos .PAYPAL { margin: 3px 0 0 } .payment-accordion .expando-header .card-type-text { margin-right: 15px } .payment-accordion .expando-header .logosContainer { overflow: hidden } @media only screen and (max-width:500px) { .payment-accordion .expando-header .logosContainer { display: none } } .payment-accordion .expando-header .logoIcon { display: inline-block } .payment-accordion .submitBtnContainer { max-width: 500px } .accordionPaintedDoorForm { color: #b92d2b; font-size: 13px; padding-bottom: 10px; text-align: left } .accordionCardForm, .accordionDCBForm, .accordionDirectDebitForm, .accordionGiftForm, .accordionPaypalForm { margin-bottom: 20px } .accordionCardForm .logos-block, .accordionDCBForm .logos-block, .accordionDirectDebitForm .logos-block, .accordionGiftForm .logos-block, .accordionPaypalForm .logos-block { display: none } @media only screen and (max-width:500px) { .accordionCardForm .logos-block, .accordionDCBForm .logos-block, .accordionDirectDebitForm .logos-block, .accordionGiftForm .logos-block, .accordionPaypalForm .logos-block { display: inline-block } } .postpaid { position: relative; top: -7px; padding-left: 5px; font-size: 14px } @media (-webkit-min-device-pixel-ratio:2), (-o-min-device-pixel-ratio:2/1), (min-resolution:192dpi) { .postpaid { top: -10px; left: -3px; padding-left: 0; font-size: 10px } } #appMountPoint .with-mobile-mop-logos img.logoIcon { background-image: none; width: auto } #appMountPoint .with-mobile-mop-logos .Bancomer { height: 12px; margin-top: 8px } #appMountPoint .with-mobile-mop-logos .Azteca { height: 18px; margin-top: 7px } #appMountPoint .with-mobile-mop-logos .SOFORT { height: 20px } #appMountPoint .with-mobile-mop-logos .KLARNA { height: 20px; margin-top: 1px } #appMountPoint .with-mobile-mop-logos .paymentPicker { min-height: 60px; height: auto; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; text-decoration: none } #appMountPoint .with-mobile-mop-logos .paymentPicker .mopNameAndLogos { height: auto; padding: 15px 0; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -moz-box-align: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap } #appMountPoint .with-mobile-mop-logos .paymentPicker .card-type-text, #appMountPoint .with-mobile-mop-logos .paymentPicker .logosContainer, #appMountPoint .with-mobile-mop-logos .paymentPicker .selectionLabel { min-height: 20px; line-height: 20px } #appMountPoint .with-mobile-mop-logos .paymentPicker .card-type-text { margin-right: 0; margin-top: 5px; margin-bottom: 5px; float: none; max-width: none } #appMountPoint .with-mobile-mop-logos .paymentPicker .selectionLabel { display: block } #appMountPoint .with-mobile-mop-logos .logosContainer { display: block } #appMountPoint .with-mobile-mop-logos .logosContainer .logos-inline { float: none; white-space: nowrap; margin-top: -4px } #appMountPoint .with-mobile-mop-logos .logosContainer .logoIcon { margin-top: 4px; margin-right: 6px; width: auto; background-image: none } @media only screen and (max-width:500px) { #appMountPoint .with-mobile-mop-logos .logosContainer .logoIcon { height: 16px } } #appMountPoint .with-mobile-mop-logos #paypalDisplayStringId .card-type-text { display: none } @media only screen and (max-width:500px) { #appMountPoint .with-mobile-mop-logos #paypalDisplayStringId .logosContainer .logoIcon { height: 20px } } .secure-server { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -moz-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: end; -webkit-align-items: flex-end; -moz-box-align: end; -ms-flex-align: end; align-items: flex-end; height: 16px } .secure-server .secure-text, .secure-server .svg-icon-secure-server-icon { height: 16px } .secure-server .svg-icon-secure-server-icon { width: 16px } .secure-server .secure-text { height: 14px; font-size: 13px; margin-left: 2px } .secure-server.secure-right-aligned { -webkit-box-pack: start; -webkit-justify-content: flex-start; -moz-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -moz-box-orient: horizontal; -moz-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse } .secure-server.secure-right-aligned .svg-icon-secure-server-icon { margin-left: 2px } .secure-server.secure-right-aligned .secure-text { margin-left: 0 } @media only screen and (max-width:500px) { #applePayDisplayStringId .card-type-text { display: none } #applePayDisplayStringId .logosContainer { display: inline-block } } .applePayPaymentOptionsContainer { min-height: 133px } .changePlanContainer { color: #737373; margin: 20px 3% 0 } .changePlanContainer .changePlanTitle { font-weight: 700; font-size: 13px } div[lang^=th] .changePlanContainer .changePlanTitle { font-size: 16px } .changePlanContainer .planDesc { width: 60%; display: inline-block } .changePlanContainer .changePlanLink { float: right; font-weight: 700; color: #737373 } .changePlanContainer .changeCardLink { float: right; font-weight: 700; color: #0071eb } .changePlanContainer .cardLabel { font-weight: 700; color: #333 } .ui-message-container { display: table; width: 100%; margin: 10px 0; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px } .ui-message-contents { display: table-cell; vertical-align: middle; padding: 20px 10px; color: #fff } .ui-message-contents a { color: inherit; text-decoration: underline } .ui-message-link { color: #fff; text-decoration: underline } .ui-message-icon { display: table-cell; vertical-align: middle; color: #fff; width: 53px } .ui-message-icon:before { font-family: nf-icon; line-height: 1.5em; padding-left: 20px; font-size: 1.5em } .ui-message-subtle { background-color: #f7f7f7; border: solid 1px #ccc } .ui-message-subtle>.ui-message-icon { color: #000 } .ui-message-subtle>.ui-message-icon:before { content: '\e799' } .ui-message-subtle .ui-message-contents { color: #000 } .ui-message-info { background: #03aefd } .ui-message-info>.ui-message-icon:before { content: '\e799' } .ui-message-wait { text-align: center } .ui-message-warn { background: #ffa00a } .ui-message-warn>.ui-message-icon:before { content: '\e796' } .ui-message-error { background: #ffa00a } .ui-message-error>.ui-message-icon:before { content: '\e805' } .ui-message-success { background: #5fa53f } .ui-message-success>.ui-message-icon:before { content: '\e802' } .planFormContainer { max-width: 1024px; margin: 0 auto; overflow: hidden } .planFormContainer .changeAnytime { margin-bottom: 20px } .hasExtendedDiacritics .planFormContainer .stepTitle { line-height: 39px } .signupSimplicity-planSelection.pt19 .centerContainer { max-width: 1056px } .messageContainer { text-align: left } .verifyCardIframe { display: block; height: 400px; width: 400px; margin: 20px auto 0; border: 4px solid #efefef; background: #fff } @media screen and (max-width:440px) { .verifyCardIframe { width: 100vw; height: 600px; border-left: none; border-right: none } } .contextContainer { text-align: center; max-width: 440px; margin: 0 auto } .contextContainer .stepLogo { display: block; margin: 5% 0 0 } .contextContainer .stepHeader { margin-top: 20px } .contextContainer .stepTitle { display: inline-block; font-weight: 700; font-size: 1.5em } .contextContainer .narrowContainer { max-width: 200px; margin: 0 auto } .contextContainer .contextRow { margin-bottom: 20px } .contextContainer .plan-info { margin: 20px 0; text-align: left } .contextContainer .plan-info .yourCard { float: left; font-size: 13px; font-weight: 700; color: #8c8c8c } .contextContainer .plan-info .mopRow { margin: 3px 0; text-align: left } .contextContainer .plan-info .securityCode { margin-left: 0; margin-right: 0 } .code-entry { padding-left: 60px; position: relative; color: #999 } .code-entry:before { font-family: nf-icon; content: '\E786'; font-size: 40px; height: 40px; width: 40px; position: absolute; left: 0 } .code-entry:after { font-family: nf-icon; content: '\E89B'; font-size: 30px; height: 30px; width: 20px; position: absolute; top: 5px; left: 30px } .resend-container { margin-top: 10px; position: relative } .resend-container>.basic-spinner { position: absolute; top: 2px } .resend-message { margin-left: 25px } .change-phone:focus, .change-phone:hover, .resend-link:focus, .resend-link:hover { cursor: pointer } .code-entry-input { max-width: 120px; padding-bottom: 32px } .code-entry-input .nfTextField { text-align: center; padding: 0 } .dcbVerifyCodeContainer { text-align: left; max-width: 440px; margin: 0 auto } .dcbVerifyCodeContainer .stepLogo { position: relative; width: 60px; height: 60px; display: block; margin: 10% 0 10% } .dcbVerifyCodeContainer .contextRow { max-width: 300px; display: inline-block } .dcbVerifyCodeContainer .contextBody { margin-bottom: 30px; font-size: 18px } .dcbVerifyCodeContainer .code-entry .ui-text-input { height: 40px } .dcbVerifyCodeLinks { text-align: left; max-width: 440px; margin: 0 auto } .dcbVerifyCodeLinks .resend-container { margin-top: 20px } .dcbVerifyCodeLinks .resend-container>.basic-spinner { top: 10px; left: 10px } .dcbVerifyCodeLinks .resend-container .resend-message { margin-left: 30px } @font-face { font-family: 'Netflix Sans'; font-weight: 100; font-display: optional; src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Thin-Opt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Thin-Opt.woff) format('woff') } @font-face { font-family: 'Netflix Sans'; font-weight: 300; font-display: optional; src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Light-Opt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Light-Opt.woff) format('woff') } @font-face { font-family: 'Netflix Sans'; font-weight: 400; font-display: optional; src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Regular-Opt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Regular-Opt.woff) format('woff') } @font-face { font-family: 'Netflix Sans'; font-weight: 700; font-display: optional; src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Medium-Opt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Medium-Opt.woff) format('woff') } @font-face { font-family: 'Netflix Sans'; font-weight: 800; font-display: optional; src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Bold-Opt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Bold-Opt.woff) format('woff') } @font-face { font-family: 'Netflix Sans'; font-weight: 900; font-display: optional; src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Black-Opt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v2/NetflixSans-Black-Opt.woff) format('woff') } .netflix-sans-font-loaded { font-family: 'Netflix Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif } .netflix-sans-font-loaded.nkufi-font-loaded { font-family: NKufi, 'Netflix Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif } .confirmFormContainer { text-align: left; max-width: 440px; margin: 0 auto 30px } .confirmFormContainer .plan-info, .contextContainer .plan-info { margin: 20px 3% 0 } .confirmFormContainer .plan-info .plan, .contextContainer .plan-info .plan { background-color: #e6e6e6; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; padding: 15px 20px } .confirmFormContainer .plan-info .plan .simpleForm, .contextContainer .plan-info .plan .simpleForm { margin-top: 20px } .confirmFormContainer .plan-choice, .contextContainer .plan-choice { padding-bottom: 15px; border-bottom: 1px solid #ccc } .confirmFormContainer .selected-plan, .contextContainer .selected-plan { float: left; font-size: 23px; max-width: 60% } .confirmFormContainer .selected-plan .plan-name, .contextContainer .selected-plan .plan-name { color: #8c8c8c; font-weight: 400; font-size: 19px; margin: 0 } .confirmFormContainer .selected-plan .plan-price, .contextContainer .selected-plan .plan-price { font-weight: 700 } .confirmFormContainer .securityCode, .contextContainer .securityCode { margin: 20px 3% 0 } .confirmFormContainer .plan-trial, .contextContainer .plan-trial { float: right; text-align: right } .confirmFormContainer .plan-trial a, .contextContainer .plan-trial a { font-weight: 700; cursor: pointer } .confirmFormContainer .plan-trial .no-free-trial, .contextContainer .plan-trial .no-free-trial { padding-top: 15px } .confirmFormContainer .plan-trial .trial-until, .contextContainer .plan-trial .trial-until { color: #737373; font-weight: 400; font-size: 19px; margin: 0; padding: 5px 0 } .confirmFormContainer .plan-user, .contextContainer .plan-user { padding-top: 15px } .confirmFormContainer .user-info, .contextContainer .user-info { float: left; max-width: 65% } .confirmFormContainer .user-info .bankHeader, .contextContainer .user-info .bankHeader { margin-right: 10px } .confirmFormContainer .user-info .user-name, .contextContainer .user-info .user-name { color: #737373; margin: 0; overflow-x: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis } .confirmFormContainer .user-info .user-email, .contextContainer .user-info .user-email { font-weight: 700; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; display: block; overflow: hidden; direction: ltr } .confirmFormContainer .user-info .user-confirm-credit, .confirmFormContainer .user-info .user-confirm-dcb, .confirmFormContainer .user-info .user-confirm-deDebit, .contextContainer .user-info .user-confirm-credit, .contextContainer .user-info .user-confirm-dcb, .contextContainer .user-info .user-confirm-deDebit { font-weight: 700; display: block } .confirmFormContainer .user-info .gift-balance-container, .contextContainer .user-info .gift-balance-container { color: #737373; display: block } @media screen and (max-width:500px) { .confirmFormContainer .user-info, .contextContainer .user-info { max-width: 60% } } .confirmFormContainer .select-user, .contextContainer .select-user { float: right; text-align: right } .confirmFormContainer .select-user a, .contextContainer .select-user a { font-weight: 700; cursor: pointer } .confirmFormContainer .hasAcceptedTermsOfUse, .confirmFormContainer .trial-msg, .contextContainer .hasAcceptedTermsOfUse, .contextContainer .trial-msg { margin: 15px 10px } .confirm-content { background-color: #f7f7f7; margin-top: 11px; padding: 26px 30px } .confirm-content--details { display: table; width: 100% } .confirm-content--title { color: #e50914; padding-bottom: 13px } .confirm-content--selection { color: #737373; font-size: 27px; font-weight: 700; padding-bottom: 4px } .confirm-content--description { color: #8c8c8c; line-height: 19px } .confirm-content--plan { display: table-cell; width: 68% } .confirm-content--plan.full { width: 100% } .confirm-content--pricing { display: table-cell; position: relative; text-align: right; top: 7px; vertical-align: middle; width: 32% } .confirm-content--pricing.hidden { display: none } .confirm-content--trial { color: #737373; font-weight: 700; padding-bottom: 10px } .confirm-content--trial.hidden { display: none } .confirm-content--price { color: #a6a6a6 } .confirm-content--price.struck { text-decoration: line-through } .confirm-content .plan-user { border-top: 1px solid #ccc; margin-top: 20px; padding-top: 20px } .confirm-content.simple .confirm-content--title { display: none } .confirm-content.complex .stream-quality { font-family: 'Netflix Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; border: 1px #a6a6a6 solid; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: #a6a6a6; font-size: 11px; font-weight: 600; padding: 2px; position: relative; top: -1px } .confirm-content--zip input { margin-top: 20px } .confirm-content .user-name { color: #8c8c8c; padding-bottom: 5px } .confirm-content .user-confirm-credit { color: #1a1a1a } .stream-quality { white-space: nowrap } .regFormContainer { text-align: left; max-width: 440px; margin: 0 auto } .regFormContainer .regFormTitle { font-size: 19px; font-weight: 700; margin-top: 10px } .regFormContainer .simpleForm { margin: 10px 0 20px } .regFormContainer .your_email { margin: 50px 0; text-align: center; font-size: 19px; font-weight: 700 } .regFormContainer .emailPreference { text-align: left } .regFormContainer .contextRow { font-size: 19px } .enterCvvContainer { text-align: left; max-width: 440px; margin: 0 auto } .enterCvvContainer .stepLogo { position: relative; width: 60px; height: 60px; display: block; margin: 35px 0 16px 0 } .enterCvvContainer .contextRow { display: inline-block } .enterCvvContainer .contextBody { margin: 6px 0 16px 0; font-size: 18px } .enterCvvContainer .contextBody.illustrated { margin: 20px 0 16px 0 } .simpleContainer .submitBtnContainer { margin-top: 24px } .cvvTooltip { position: fixed; top: 0; left: 0; width: 100%; height: 5000px; background-color: rgba(255, 255, 255, .97); z-index: 999999 } .close-button { position: absolute; top: 20px; right: 20px } .tooltipDesc { text-align: center; margin: auto; padding-top: 80px; max-width: 270px } .otherCvvHelp { background: url(../img/csc_not_amx.png) no-repeat 0 0; width: 200px; height: 130px; margin: 30px auto; opacity: 1 } .amexCvvHelp { background: url(../img/csc_amx.png) no-repeat 0 0; width: 200px; height: 130px; margin: 30px auto; opacity: 1 } @media (-webkit-min-device-pixel-ratio:2), (-o-min-device-pixel-ratio:2/1), (min-resolution:192dpi) { .otherCvvHelp { background: url(../img/csc_not_amx.png) no-repeat 0 0; -moz-background-size: contain; background-size: contain } .amexCvvHelp { background: url(../img/csc_amx.png) no-repeat 0 0; -moz-background-size: contain; background-size: contain } } .collectZipCodeContainer { text-align: left; max-width: 440px; margin: 0 auto } .collectZipCodeContainer .giftInfoContainer { padding-bottom: 20px } .collectZipCodeContainer .giftInfoContainer .giftInfoTitle { color: #737373; font-size: 13px; font-weight: 700 } .collectZipCodeContainer .giftInfoContainer .giftInfoValue { color: #333 } .applePayButton { display: block; width: 100%; padding: 12px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 0; background-color: #000; color: #fff; font-size: 24px; font-weight: 500; font-family: -apple-system, BlinkMacSystemFont, San Francisco, Helvetica Neue, Helvetica, Ubuntu, Roboto, Noto, Segoe UI, Arial, sans-serif } @media only screen and (max-width:500px) { .applePayButton { font-size: 20px } } .show { display: block!important } .hide { display: none!important } .nfTextField:focus+label, .hasText+.placeLabel { top: 6px!important; font-weight: 700; font-size: 13px; transform: translateY(0) } .nfHeader .logo { margin-left: 3%; line-height: 90px }