%PDF-
%PDF-
Mini Shell
Mini Shell
.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: 100%;
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;
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
}
.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-v5.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
}
.nf-flag.nf-flag-xk {
background-position: -5px -5382px;
width: 16px;
height: 11px
}
.ui-select-wrapper.country-select {
vertical-align: top;
position: relative;
width: 95px;
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 {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
height: 100%;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-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;
height: 100%
}
.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
}
.country-select-code {
display: inline-block;
font-size: 12px;
font-weight: 700;
padding: 0 4px;
min-width: 32px;
text-align: center;
-webkit-transform: translateX(5px);
-moz-transform: translateX(5px);
-ms-transform: translateX(5px);
-o-transform: translateX(5px);
transform: translateX(5px)
}
.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 {
-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:500px) {
.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
}
.ui-select-wrapper.country-select .ui-select-current {
padding: 13px 10px;
padding-right: 24px;
height: 42px
}
.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: 1px 6px 1px 0;
float: left
}
.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")
}
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%
}
body {
margin: 0
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline
}
audio:not([controls]) {
display: none;
height: 0
}
[hidden],
template {
display: none
}
a {
background-color: transparent
}
a:active,
a:hover {
outline: 0
}
abbr[title] {
border-bottom: 1px dotted
}
b,
strong {
font-weight: 700
}
dfn {
font-style: italic
}
h1 {
font-size: 2em;
margin: .67em 0
}
mark {
background: #ff0;
color: #000
}
small {
font-size: 80%
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}
sup {
top: -.5em
}
sub {
bottom: -.25em
}
img {
border: 0
}
svg:not(:root) {
overflow: hidden
}
figure {
margin: 1em 40px
}
hr {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0
}
pre {
overflow: auto
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0
}
button {
overflow: visible
}
button,
select {
text-transform: none
}
button,
html input[type=button],
input[type=reset],
input[type=submit] {
-webkit-appearance: button;
cursor: pointer
}
button[disabled],
html input[disabled] {
cursor: default
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0
}
input {
line-height: normal
}
input[type=checkbox],
input[type=radio] {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
height: auto
}
input[type=search] {
-webkit-appearance: textfield;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
-webkit-appearance: none
}
fieldset {
border: 1px solid silver;
margin: 0 2px;
padding: .35em .625em .75em
}
legend {
border: 0;
padding: 0
}
textarea {
overflow: auto
}
optgroup {
font-weight: 700
}
table {
border-collapse: collapse;
border-spacing: 0
}
td,
th {
padding: 0
}
.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
}
.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 {
--layout-container-side-padding: 32px;
padding: 20px 32px 60px;
padding: 20px var(--layout-container-side-padding) 60px
}
div.basicLayout .narrowCenterContainer {
padding-left: 16px;
padding-right: 16px
}
div.basicLayout .narrowCenterContainer .submitBtnContainer {
padding: 0 16px
}
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 .planContainer,
div.basicLayout .regContainer,
div.basicLayout .verifyCardContainer {
max-width: 340px
}
div.basicLayout .nf-btn-primary,
div.basicLayout .nf-btn-secondary {
min-height: 48px;
font-weight: 400;
font-size: 17px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px
}
div.basicLayout .contextStep .submitBtnContainer {
max-width: 340px
}
div.basicLayout .paymentContainer .contextBody,
div.basicLayout .planContainer .contextBody,
div.basicLayout .regContainer .contextBody,
div.basicLayout .verifyCardContainer .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;
-webkit-background-size: 50px 50px;
-moz-background-size: 50px;
background-size: 50px;
height: 50px
}
div.basicLayout .regStepLogo {
width: 260px
}
@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,
div.basicLayout .verifyCardContainer {
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 .narrowContainer {
margin: 0
}
}
.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-remindme-add:before {
content: '\e663'
}
.icon-button-remindme-add-reverse:before {
content: '\e663'
}
.icon-button-remindme-added:before {
content: '\e804'
}
.icon-button-remindme-added-reverse:before {
content: '\e804'
}
.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"
}
.icon-thin-caret-back:before {
content: '\e704'
}
.icon-thin-caret-forward:before {
content: '\e705'
}
.stepHeader {
display: inline-block
}
.regFormContainer .stepHeader {
margin-top: 20px
}
.stepHeader p {
margin: 0;
line-height: 1.5em
}
.stepHeader:focus {
outline: 0
}
.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
}
@font-face {
font-family: 'Netflix Sans';
font-weight: 100;
font-display: optional;
src: url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Th.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Th.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/v3/NetflixSans_W_Lt.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Lt.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/v3/NetflixSans_W_Rg.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Rg.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/v3/NetflixSans_W_Md.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Md.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/v3/NetflixSans_W_Bd.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Bd.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/v3/NetflixSans_W_Blk.woff2) format('woff2'), url(https://assets.nflxext.com/ffe/siteui/fonts/netflix-sans/v3/NetflixSans_W_Blk.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
}
.netflix-sans-font-loaded.graphik-font-loaded {
font-family: GraphikTH, 'Netflix Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif
}
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
}
.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
}
}
.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
}
.svg-nfLogo .svg-icon-netflix-logo {
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
}
}
.authLinks.isMemberSimplicity {
color: #8c8c8c
}
button.authLinks {
background-color: transparent;
border: none;
cursor: pointer;
display: inline;
font-family: inherit;
padding: 0
}
button.authLinks:hover {
text-decoration: underline
}
button.authLinks:focus {
outline: 0
}
.footer-mount {
width: 100%;
padding: 0
}
.site-footer-wrapper {
min-width: 190px;
width: 100%;
margin-top: 80px;
padding-bottom: 20px;
font-size: 1em;
color: #757575;
position: relative
}
.pt11 .site-footer-wrapper {
margin-bottom: 80px
}
.pt11 .site-footer-wrapper .footer-divider {
display: none
}
.footer-top-a {
color: #757575
}
.footer-divider {
height: 0;
width: 100%;
border-top: 1px solid #e5e5e5
}
.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: 25%;
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: 50%
}
}
.footer-link {
color: #757575
}
.service-code-wrapper {
color: #757575;
margin: 45px 0 20px
}
.service-code {
border: 1px solid #757575;
padding: 8px;
display: inline-block;
color: #757575;
font-size: .8521em;
min-width: 90px;
text-align: center
}
.service-code:focus,
.service-code:hover {
text-decoration: none
}
.footer-country {
font-size: 13px;
margin-top: 24px
}
.privacy-updated,
.terms-updated {
font-weight: 700
}
.lang-selection-container {
display: inline-block
}
.lang-selection-container .nfLabel {
display: block;
width: 1px;
height: 1px;
overflow: hidden;
position: absolute;
white-space: nowrap;
margin: -1px;
clip: rect(0 0 0 0);
border: 0
}
.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
}
.error>.nfTextField,
.nfTextField.error {
border-color: #b92d2b
}
.nfTextField.valid,
.valid>.nfTextField {
border-color: #5fa53f
}
.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:focus+.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)
}
.nfInput .nfTextField:-webkit-autofill+.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:focus+.placeLabel {
top: 6px;
font-weight: 700;
font-size: 13px
}
.nfInput.nfInputOversize .nfTextField:-webkit-autofill+.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:focus+.placeLabel {
top: 6px;
font-weight: 700;
font-size: 13px
}
.nfInput.nfInputResponsive .nfTextField:-webkit-autofill+.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
}
.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
}
.nf-markup {
display: block;
line-height: 1.5;
margin: .75em 0
}
.nf-markup .section-label {
color: #8c8c8c;
display: block;
font-weight: 700;
font-size: 11px
}
.nf-markup.oversize .section-label {
font-size: 13px
}
.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;
pointer-events: none
}
@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%;
cursor: pointer
}
.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;
cursor: pointer
}
.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'
}
.nf-message-subtle-no-icon {
background-color: #f7f7f7;
text-align: center
}
.nf-message-subtle-no-icon .nf-message-contents {
color: #000
}
.nf-message-subtle-no-icon>.nf-message-icon {
display: none
}
.nf-message-info-no-icon {
background: #0071eb;
text-align: center
}
.nf-message-info-no-icon>.nf-message-icon {
display: none
}
.nf-message-warn-high-contrast {
background: #ffa00a
}
.nf-message-warn-high-contrast>.nf-message-contents {
color: #000;
padding: 20px 30px 20px 10px
}
.nf-message-warn-high-contrast>.nf-message-icon {
color: #000
}
.nf-message-warn-high-contrast>.nf-message-icon:before {
content: '\e796'
}
.basic-spinner {
display: inline-block;
margin: 0 auto;
opacity: 1;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-webkit-background-size: cover;
-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(https://assets.nflxext.com/ffe/siteui/common/site-spinner-240-light.png)
}
.center-fixed {
position: fixed;
top: 50%;
left: 50%;
z-index: 2000
}
.center-absolute {
position: absolute;
top: 50%;
left: 50%;
z-index: 1
}
.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)
}
}
.basic-spinner-region {
position: relative
}
.basic-spinner-region.isLoading::before {
background-color: rgba(255, 255, 255, .5);
bottom: 0;
content: '';
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 1
}
::-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
}
.nf-btn .waitIndicator {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0
}
.nf-btn-solid.nf-btn-primary,
.nf-btn-twotone.nf-btn-primary {
color: #fff;
background-color: #e50914
}
.nf-btn-solid.nf-btn-primary.hover,
.nf-btn-solid.nf-btn-primary:hover,
.nf-btn-twotone.nf-btn-primary.hover,
.nf-btn-twotone.nf-btn-primary:hover {
background-color: #f6121d
}
.nf-btn-solid.nf-btn-primary.active,
.nf-btn-solid.nf-btn-primary:active,
.nf-btn-twotone.nf-btn-primary.active,
.nf-btn-twotone.nf-btn-primary:active {
background-color: #e50914
}
.nf-btn-solid.nf-btn-primary:disabled,
.nf-btn-twotone.nf-btn-primary:disabled {
opacity: .5
}
.nf-btn-solid.nf-btn-primary.waiting:disabled,
.nf-btn-twotone.nf-btn-primary.waiting:disabled {
color: transparent
}
.nf-btn-solid.nf-btn-secondary,
.nf-btn-twotone.nf-btn-secondary {
color: #000;
background-color: #ccc
}
.nf-btn-solid.nf-btn-secondary.hover,
.nf-btn-solid.nf-btn-secondary:hover,
.nf-btn-twotone.nf-btn-secondary.hover,
.nf-btn-twotone.nf-btn-secondary:hover {
background: #d9d9d9
}
.nf-btn-solid.nf-btn-secondary.active,
.nf-btn-solid.nf-btn-secondary:active,
.nf-btn-twotone.nf-btn-secondary.active,
.nf-btn-twotone.nf-btn-secondary:active {
background: #ccc
}
.nf-btn-solid.nf-btn-secondary:disabled,
.nf-btn-twotone.nf-btn-secondary:disabled {
color: #737373
}
.nf-btn-solid.nf-btn-secondary.waiting:disabled,
.nf-btn-twotone.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;
-webkit-background-size: contain;
-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
}
.simpleContainer .cvvInfo {
position: absolute;
right: 10px;
top: 20px;
font-size: 23px;
cursor: pointer
}
.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
}
.centerContainer.sameMode {
display: block
}
.tvSignUpMessage {
padding: 15px 10px;
color: #fff;
background-color: #007ff0;
line-height: 21px;
margin-bottom: -70px
}
.planStepLogo {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/Checkmark.png) no-repeat 50% 50%;
-webkit-background-size: 60px 60px;
-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%;
-webkit-background-size: 60px 60px;
-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;
-webkit-background-size: 260px 260px;
-moz-background-size: 260px;
background-size: 260px
}
.regStepMobileLogo {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/MobileDevices.png) no-repeat;
height: 90px;
width: 260px;
-webkit-background-size: 94px 94px;
-moz-background-size: 94px;
background-size: 94px;
background-position: center
}
.regStepCheckLogo {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/Checkmark.png) no-repeat 50% 50%;
-webkit-background-size: 60px 60px;
-moz-background-size: 60px;
background-size: 60px;
height: 60px;
width: 60px
}
@media screen and (max-width:600px) {
.regStepMobileLogo {
background-position: left
}
}
.planContainer,
.regContainer,
.verifyCardContainer,
.verifyCardPageContainer {
text-align: center;
max-width: 440px;
margin: 0 auto
}
.planContainer .stepLogo,
.regContainer .stepLogo,
.verifyCardContainer .stepLogo,
.verifyCardPageContainer .stepLogo {
display: block;
margin: 10% 0 10%
}
.planContainer .contextRow,
.regContainer .contextRow,
.verifyCardContainer .contextRow,
.verifyCardPageContainer .contextRow {
max-width: 300px;
display: inline-block
}
.planContainer .contextBody,
.regContainer .contextBody,
.verifyCardContainer .contextBody,
.verifyCardPageContainer .contextBody {
margin: 30px 0;
font-size: 19px
}
.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
}
.signupTerms {
font-size: 13px;
color: #828282;
margin: 20px 0
}
.signupTermsError {
color: #b92d2b;
font-size: 16px
}
.submitBtnContainer {
text-align: center;
max-width: 440px;
margin: 0 auto
}
@media screen and (max-width:740px) {
html.touch .submitBtnContainer.fixed-screen-medium {
position: fixed;
bottom: 1em;
left: 0;
right: 0;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: .5em;
z-index: 5
}
html.touch .submitBtnContainer.fixed-screen-medium .nf-btn {
width: 100%;
max-width: 100%;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0
}
}
.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;
-webkit-background-size: 100% 100%;
-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;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
.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: 100px
}
.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)
}
.nf-phone-input .country-select-flag {
margin-left: 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: default
}
.nf-phone-input-wrapper-s .ui-select-wrapper:after {
content: normal
}
.nf-phone-input-wrapper-s .ui-select-wrapper.country-select {
width: 75px
}
.a11yAnnouncer {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden
}
#tmcontainer {
position: absolute
}
.recaptcha-terms-of-use {
position: relative;
text-align: left
}
.recaptcha-terms-of-use--link-button {
background-color: transparent;
border: none;
color: #0071eb;
cursor: pointer;
display: inline;
font-family: inherit;
font-size: inherit;
padding: 0
}
.recaptcha-terms-of-use--link-button:hover {
text-decoration: underline
}
.recaptcha-terms-of-use--link-button:focus {
outline: 0
}
.recaptcha-terms-of-use--link-button.-hidden {
visibility: hidden
}
.recaptcha-terms-of-use--disclosure {
visibility: hidden;
opacity: 0;
-webkit-transition: height .5s ease, opacity .5s ease;
-o-transition: height .5s ease, opacity .5s ease;
-moz-transition: height .5s ease, opacity .5s ease;
transition: height .5s ease, opacity .5s ease
}
.recaptcha-terms-of-use--disclosure.-visible {
visibility: visible;
opacity: 1
}
.recaptcha-terms-of-use--disclosure.-absolute {
position: absolute
}
.grecaptcha-badge {
display: none
}
.changePlanContainer {
background-color: #f4f4f4;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 14px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between
}
.planInfo {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between
}
.planName {
font-size: 16px;
font-weight: 400;
color: #737373;
display: inline
}
@media screen and (max-width:740px) {
.planName {
font-size: 14px
}
}
.planDesc,
.planPrice {
font-size: 16px;
font-weight: 700;
color: #333;
display: block;
margin-bottom: 5px
}
@media screen and (max-width:740px) {
.planDesc,
.planPrice {
font-size: 14px
}
}
.planFootnote {
font-size: 16px;
font-weight: 400;
color: #737373;
margin-top: 10px;
font-size: 13px
}
@media screen and (max-width:740px) {
.planFootnote {
font-size: 14px
}
}
.changePlanAction {
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;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center
}
.changePlanLink {
font-size: 16px;
margin-left: 20px;
font-weight: 700;
cursor: pointer
}
@media screen and (max-width:740px) {
.changePlanLink {
font-size: 14px
}
}
.changePlanLink.gray {
color: #737373
}
.secure-server-badge {
-webkit-box-align: end;
-webkit-align-items: flex-end;
-moz-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-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;
height: 16px;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-moz-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start
}
.secure-server-badge--icon {
height: 16px;
margin-left: 2px;
width: 16px
}
.secure-server-badge--text {
font-size: 13px;
height: 14px
}
.checkmark-group {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-bottom: 20px;
margin-top: 15px;
text-align: left
}
.checkmark-group.-compact {
margin-top: 4px
}
.checkmark-group--row {
-webkit-box-align: start;
-webkit-align-items: flex-start;
-moz-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
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-pack: start;
-webkit-justify-content: flex-start;
-moz-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
margin: 0
}
.checkmark-group--row+.checkmark-group--row {
margin-top: 20px
}
.checkmark-group--row.-compact+.checkmark-group--row.-compact {
margin-top: 6px
}
.checkmark-group--icon {
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start;
color: #e50914;
-webkit-box-flex: 0;
-webkit-flex: none;
-moz-box-flex: 0;
-ms-flex: none;
flex: none;
height: 24px;
width: 24px
}
.checkmark-group--text {
margin-left: 10px;
margin-top: 2px
}
.total-row {
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-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding-top: 16px;
padding-bottom: 8px
}
.total-due-label {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
font-weight: 700
}
.total-due-price {
-webkit-box-flex: 0;
-webkit-flex: 0 1 auto;
-moz-box-flex: 0;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
font-weight: 700
}
.total-due-price .plan-price {
color: #e50914;
text-decoration: line-through;
margin-right: 8px
}
.total-math {
padding-top: 16px;
margin-top: 16px;
border-top: 2px dashed #ccc
}
.total-math+.total-row {
padding-top: 8px
}
.math-row {
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-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between
}
.subtotal-label {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1
}
.subtotal-price {
-webkit-box-flex: 0;
-webkit-flex: 0 1 auto;
-moz-box-flex: 0;
-ms-flex: 0 1 auto;
flex: 0 1 auto
}
.freetrial-label {
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1;
color: #e50914
}
.freetrial-price {
-webkit-box-flex: 0;
-webkit-flex: 0 1 auto;
-moz-box-flex: 0;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
color: #e50914
}
.checkmark-group {
-webkit-box-ordinal-group: 0;
-webkit-order: -1;
-moz-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1
}
.checkmark-group+.changePlanContainer {
margin-top: 0
}
.paymentFormContainer .checkmark-group+.simpleForm {
margin-top: 0
}
.cashOrderFinalContainer {
max-width: 500px;
text-align: left;
padding: 14px
}
.cashOrderFinalContainer--referenceCodeContainer {
background-color: #f4f4f4;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 14px;
margin-top: 20px;
margin-bottom: 20px;
color: #333;
font-size: 16px
}
.cashOrderFinalContainer--referenceCode {
font-size: 32px;
margin-top: 5px;
margin-bottom: 20px;
font-weight: 700
}
@media screen and (max-width:500px) {
.cashOrderFinalContainer--referenceCode {
font-size: 24px
}
}
.cashOrderFinalContainer--footer {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.cashOrderFinalContainer--disclaimer {
margin-top: 20px;
font-size: 12px
}
.cashOrderFinalContainer--logoWrapper {
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -moz-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
.cashOrderFinalContainer--paymentProviderLogo {
width: 40px;
max-width: unset
}
.cashOrderFinalContainer--payByTime {
margin-left: 5px
}
.cashOrderFinalContainer--submitBtnContainer {
margin-top: 24px
}
.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 .contextRowEmphasized {
font-weight: 700
}
.paymentContainer .todayPay {
background-color: #ccc;
padding: 20px 15%;
margin: 10px 0
}
.paymentContainer .summaryLabel {
float: left
}
.paymentContainer .summaryPrice {
float: right
}
.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
}
@media only screen and (max-width:500px) {
.paymentPicker.tallHeight {
height: 60px;
line-height: 60px
}
}
.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 .giftCashAsMop,
.paymentPicker .ineligibleForOffer,
.paymentPicker .nonRefundable {
-webkit-flex-basis: 100%;
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
color: #757575;
font-size: 13px;
margin: 0 15px 5px 15px;
line-height: normal
}
.paymentPicker .logosContainer {
overflow: hidden;
margin: 0 15px
}
.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
}
.simpleContainer .retryContent .retryTitle {
font-weight: 700;
padding-bottom: 10px;
font-size: 23px
}
.simpleContainer .retryContent .retryContext {
padding-bottom: 15px;
font-size: 16px
}
.simpleContainer .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
}
.simpleContainer .retryContent .retrySection .logoIcon {
margin-right: 5px
}
.simpleContainer .retryContent .retrySection .yourCardTitle {
font-size: 13px;
font-weight: 700;
padding-bottom: 5px;
color: grey
}
.simpleContainer .retryContent .retrySection .yourCardNum {
padding-left: 10px
}
.simpleContainer .retryContent .retrySection .yourPhoneNum {
line-height: 30px;
padding-left: 10px
}
.simpleContainer .retryContent .retrySection .yourCardDate {
padding-left: 10px
}
.simpleContainer .retryContent .retrySection .changeLink {
position: absolute;
top: 40%;
right: 15px
}
.simpleContainer .retryContent .submitBtnContainer {
margin: 12px 0
}
.simpleContainer .retryContent .retryNewCardContext {
padding-bottom: 15px;
font-size: 16px
}
.simpleContainer .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-back {
margin-right: 5px
}
.paymentFormContainer .contextContainer {
text-align: left;
margin-bottom: 30px
}
.paymentFormContainer .fieldContainer {
margin-bottom: 30px;
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
}
.paymentFormContainer .isHidden {
display: none
}
.paymentFormContainer .simpleForm {
text-align: left;
margin-top: 10px
}
.paymentFormContainer .ui-label {
margin-bottom: 10px
}
.paymentFormContainer .noTopMargin {
margin-top: 0
}
.paymentFormContainer .paypalText {
margin: 20px 0 0
}
.paymentFormContainer .logos-block {
display: inline-block
}
.paymentFormContainer .logos-inline {
position: absolute;
top: 20px;
z-index: 10;
right: 5px
}
.paymentFormContainer .nf-message-contents .skipEditPayment {
text-decoration: none;
color: #0071eb
}
.paymentFormContainer .nf-message-contents .skipEditPayment .icon-thin-caret-right {
font-size: 13px
}
.paymentFormContainer .mobile-wallet-select {
margin-top: 12px;
margin-bottom: 12px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.paymentFormContainer .mobile-wallet-select .ui-select-current {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
height: 100%;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-sizing: inherit;
-moz-box-sizing: inherit;
box-sizing: inherit
}
.paymentFormContainer .mobile-wallet-select::after {
top: -webkit-calc(50% - 4px);
top: -moz-calc(50% - 4px);
top: calc(50% - 4px)
}
.changeCardProcessingType-container {
margin: 0 auto;
max-width: 400px
}
.changeCardProcessingType-description {
margin-bottom: 40px
}
.changeCardProcessingTypeNext {
margin-bottom: 15px
}
.paymentFormSecondaryAction {
display: block;
margin: 20px auto;
max-width: 440px;
text-align: center
}
.coDebitAccountType {
color: #828282;
font-size: 13px
}
.coDebitAccountType .radioSelectLabel {
font-weight: 700
}
.cardProcessingType ul,
.coDebitAccountType ul {
margin-top: 5px
}
.cardProcessingType label,
.coDebitAccountType label {
cursor: pointer
}
.cardProcessingType .radioSelectOption,
.coDebitAccountType .radioSelectOption {
display: inline-block;
margin-right: 20px
}
.cardProcessingType {
font-weight: 700;
margin: 20px 0
}
.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: #757575
}
.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
}
.harmonizedPaymentsHeader .harmonizedPaymentsHeaderContent {
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 .plan-content {
float: left;
text-align: left
}
.change-plan-box .change-plan {
float: right;
text-align: right
}
.change-plan-box .change-plan p {
margin: 0
}
.change-plan-box .edit-plan-link {
font-weight: 700
}
.change-plan-box .free-trial-section .free-until-date {
color: #000
}
.standard-change-plan-box {
margin-top: 1em
}
.standard-change-plan-box .content {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 14px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #f4f4f4;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
max-width: 500px
}
.standard-change-plan-box .plan-content {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between
}
.standard-change-plan-box .plan-name {
font-size: 16px;
font-weight: 700;
color: #333;
margin-bottom: 5px
}
@media screen and (max-width:740px) {
.standard-change-plan-box .plan-name {
font-size: 14px
}
}
.standard-change-plan-box .plan-price {
font-size: 16px;
font-weight: 400;
color: #757575;
display: inline
}
@media screen and (max-width:740px) {
.standard-change-plan-box .plan-price {
font-size: 14px
}
}
.standard-change-plan-box .change-plan {
margin-left: 20px
}
.standard-change-plan-box .edit-plan-link {
font-size: 16px;
font-weight: 700;
cursor: pointer
}
@media screen and (max-width:740px) {
.standard-change-plan-box .edit-plan-link {
font-size: 14px
}
}
.standard-change-plan-box .edit-plan-link.gray {
color: #757575
}
.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 .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 .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 .ui-select.medium {
padding: 11px 10px 11px 14px;
max-height: 44px
}
.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-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 .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 #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.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 .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
}
.dcbPhoneWrapper .country-name {
padding: 4px 0 0 36px
}
.cvvTooltip {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, .97)
}
.close-button {
position: absolute;
top: 20px;
right: 20px
}
.tooltipDesc {
text-align: center;
margin: auto;
padding-top: 80px;
max-width: 270px
}
.otherCvvHelp {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/visa_cvv.png) no-repeat 0 0;
width: 200px;
height: 130px;
margin: 30px auto;
opacity: 1
}
.amexCvvHelp {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/amex_cvv.png) no-repeat 0 0;
width: 200px;
height: 130px;
margin: 30px auto;
opacity: 1
}
.postpaid {
position: relative;
top: -8px;
font-size: 14px
}
@media (-webkit-min-device-pixel-ratio:2),
(-o-min-device-pixel-ratio:2/1),
(min-resolution:192dpi) {
.postpaid {
font-size: 12px
}
}
#appMountPoint img.logoIcon {
background-image: none;
width: auto
}
#appMountPoint img.logoIcon.Azteca {
height: 18px;
margin-top: 3px
}
#appMountPoint img.logoIcon.KLARNA,
#appMountPoint img.logoIcon.SOFORT {
height: 16px;
margin-top: 4px
}
#appMountPoint .logosContainer .logos-inline {
float: none;
white-space: nowrap;
margin-top: -4px
}
#appMountPoint .logosContainer .logoIcon {
margin-top: 4px;
margin-right: 6px;
width: auto;
background-image: none
}
@media only screen and (max-width:500px) {
#appMountPoint .logosContainer .logoIcon {
height: 16px
}
#appMountPoint .logosContainer .logoIcon.Azteca {
height: 12px;
margin-top: 5px
}
#appMountPoint .logosContainer .logoIcon.KLARNA,
#appMountPoint .logosContainer .logoIcon.SOFORT {
height: 10px;
margin-top: 6px
}
}
#appMountPoint .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 .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 .paymentPicker .card-type-text,
#appMountPoint .paymentPicker .logosContainer,
#appMountPoint .paymentPicker .selectionLabel {
min-height: 20px;
line-height: 20px
}
#appMountPoint .paymentPicker .card-type-text {
margin-right: 0;
margin-top: 5px;
margin-bottom: 5px;
float: none;
max-width: none
}
#appMountPoint .paymentPicker .selectionLabel {
display: block
}
@media only screen and (max-width:500px) {
#applePayDisplayStringId .card-type-text {
display: none
}
#applePayDisplayStringId .logosContainer {
display: inline-block
}
}
.applePayPaymentOptionsContainer {
min-height: 133px
}
.recaptcha-terms-of-use-container {
max-width: 440px;
margin: 20px auto 0
}
.recaptcha-terms-of-use {
margin: 0;
font-size: 13px;
color: #828282
}
.refunds-message-container {
max-width: 440px;
margin: 20px auto 0;
font-size: 13px;
color: #828282
}
.offerDisclaimer {
text-align: left
}
.confirmOffer .paymentContainer .stepHeader {
margin-top: 0
}
.confirmOffer .contextContainer>.contextRowFirst {
margin-top: 0
}
.confirmOffer .changePlanContainer {
margin: 30px 0 20px
}
.confirmOffer .planInfo,
.confirmOffer .planName,
.multiMonthPayment .planInfo,
.multiMonthPayment .planName {
display: block;
margin-bottom: 0
}
.confirmOffer .planDesc,
.multiMonthPayment .planDesc {
display: inline-block
}
.confirmOffer .discountTag,
.multiMonthPayment .discountTag {
display: inline-block;
padding: 2px 6px;
margin-left: 1em;
background: #3d5afe -webkit-gradient(linear, left top, right top, from(#3d5afe), to(#7b18a5));
background: #3d5afe -webkit-linear-gradient(left, #3d5afe 0, #7b18a5 100%);
background: #3d5afe -moz- oldlinear-gradient(left, #3d5afe 0, #7b18a5 100%);
background: #3d5afe -o-linear-gradient(left, #3d5afe 0, #7b18a5 100%);
background: #3d5afe linear-gradient(to right, #3d5afe 0, #7b18a5 100%);
color: #fff;
font-weight: 700;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px
}
.confirmOffer .offerDisclaimer,
.multiMonthPayment .offerDisclaimer {
margin-top: 30px;
font-size: .875rem
}
div.basicLayout .confirmOffer .paymentContainer {
text-align: center
}
.card_changePlanContainer {
color: #737373;
margin: 20px 3% 0
}
.card_changePlanContainer .card_changePlanTitle {
font-weight: 700;
font-size: 13px
}
div[lang^=th] .card_changePlanContainer .card_changePlanTitle {
font-size: 16px
}
.card_changePlanContainer .card_planDesc {
width: 60%;
display: inline-block
}
.card_changePlanContainer .card_changePlanLink {
float: right;
font-weight: 700;
color: #737373
}
.card_changePlanContainer .changeCardLink {
float: right;
font-weight: 700;
color: #0071eb
}
.card_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-security-pass {
background: #03aefd
}
.ui-message-security-pass>.ui-message-svg-icon {
padding: 20px 0 20px 20px;
margin-right: -13px
}
.ui-message-security-pass>.ui-message-svg-icon svg {
width: 25px
}
.ui-message-security-pass>.ui-message-svg-icon svg path {
fill: #fff
}
.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'
}
.visually-hidden {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
overflow: hidden;
position: absolute;
width: 1px
}
.planGrid__selector {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 0;
margin: 0;
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
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid--has1Plans .planGrid__selector {
width: 20%
}
.planGrid--has2Plans .planGrid__selector {
width: 40%
}
.planGrid--has3Plans .planGrid__selector {
width: 60%
}
.planGrid--has4Plans .planGrid__selector {
width: 65%
}
}
@media only screen and (max-width:600px) {
.planGrid__selector {
width: 100%
}
}
.planGrid__selectorDescription,
.planGrid__selectorTitle {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
overflow: hidden;
position: absolute;
width: 1px
}
.planGrid__selectorChoice {
-webkit-box-flex: 1;
-webkit-flex: 1 1 auto;
-moz-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative
}
.planGrid__selectorInput {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
z-index: -1;
margin: 0;
padding: 0;
border: 0;
background: 0 0
}
.planGrid__selectorInput:focus {
outline: 0
}
.planGrid__selectorLabel {
-webkit-touch-callout: none;
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__planSelector {
-webkit-box-ordinal-group: 2;
-webkit-order: 1;
-moz-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1
}
}
@media only screen and (max-width:600px) {
.planGrid__planSelector {
-webkit-box-ordinal-group: 3;
-webkit-order: 2;
-moz-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2
}
}
.planGrid--has1Plans .planGrid__planChoice {
width: -webkit-calc(100% / 1);
width: -moz-calc(100% / 1);
width: calc(100% / 1)
}
.planGrid--has2Plans .planGrid__planChoice {
width: -webkit-calc(100% / 2);
width: -moz-calc(100% / 2);
width: calc(100% / 2)
}
.planGrid--has3Plans .planGrid__planChoice {
width: -webkit-calc(100% / 3);
width: -moz-calc(100% / 3);
width: calc(100% / 3)
}
.planGrid--has4Plans .planGrid__planChoice {
width: -webkit-calc(100% / 4);
width: -moz-calc(100% / 4);
width: calc(100% / 4)
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__planChoice {
padding: 12px 0
}
}
@media only screen and (max-width:600px) {
.planGrid__planChoice {
padding: 8px 4px
}
}
@media only screen and (min-width:951px) {
.planGrid__planInput,
.planGrid__planLabel,
.planGrid__planLabelDarkOutline,
.planGrid__planLabelGrey,
.planGrid__planLabelOutline {
width: 120px;
height: 120px
}
}
@media only screen and (max-width:950px) and (min-width:601px) {
.planGrid__planInput,
.planGrid__planLabel,
.planGrid__planLabelDarkOutline,
.planGrid__planLabelGrey,
.planGrid__planLabelOutline {
width: 90px;
height: 90px
}
}
@media only screen and (max-width:600px) {
.planGrid__planInput,
.planGrid__planLabel,
.planGrid__planLabelDarkOutline,
.planGrid__planLabelGrey,
.planGrid__planLabelOutline {
width: 100%;
height: 75px
}
}
.planGrid__planInput {
position: absolute;
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%);
opacity: 0
}
.planGrid__planLabel,
.planGrid__planLabelDarkOutline,
.planGrid__planLabelGrey,
.planGrid__planLabelOutline {
padding: 1px;
background: #e50914;
color: #fff;
font-weight: 700;
opacity: .6;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
font-size: 17px;
margin: 0 auto
}
.planGrid__planInput:active+.planGrid__planLabel,
.planGrid__planInput:active+.planGrid__planLabelDarkOutline,
.planGrid__planInput:active+.planGrid__planLabelGrey,
.planGrid__planInput:active+.planGrid__planLabelOutline,
.planGrid__planInput:focus+.planGrid__planLabel,
.planGrid__planInput:focus+.planGrid__planLabelDarkOutline,
.planGrid__planInput:focus+.planGrid__planLabelGrey,
.planGrid__planInput:focus+.planGrid__planLabelOutline {
-webkit-box-shadow: 0 0 3px 0 #e50914;
-moz-box-shadow: 0 0 3px 0 #e50914;
box-shadow: 0 0 3px 0 #e50914
}
.planGrid__planInput:checked+.planGrid__planLabel,
.planGrid__planInput:checked+.planGrid__planLabelDarkOutline,
.planGrid__planInput:checked+.planGrid__planLabelGrey,
.planGrid__planInput:checked+.planGrid__planLabelOutline {
opacity: 1
}
.planGrid__planLabel::after,
.planGrid__planLabelDarkOutline::after,
.planGrid__planLabelGrey::after,
.planGrid__planLabelOutline::after {
content: '';
display: block;
border: 0 solid transparent;
border-top-color: #e50914;
position: absolute;
top: 100%;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%)
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__planInput:checked+.planGrid__planLabel::after,
.planGrid__planInput:checked+.planGrid__planLabelDarkOutline::after,
.planGrid__planInput:checked+.planGrid__planLabelGrey::after,
.planGrid__planInput:checked+.planGrid__planLabelOutline::after {
border-width: 10px;
border-bottom-width: 0
}
}
@media only screen and (max-width:600px) {
.planGrid__planInput:checked+.planGrid__planLabel::after,
.planGrid__planInput:checked+.planGrid__planLabelDarkOutline::after,
.planGrid__planInput:checked+.planGrid__planLabelGrey::after,
.planGrid__planInput:checked+.planGrid__planLabelOutline::after {
border-width: 15px;
border-bottom-width: 0
}
}
@media only screen and (max-width:600px) {
.planGrid--has4Plans .planGrid__planLabel,
.planGrid--has4Plans .planGrid__planLabelDarkOutline,
.planGrid--has4Plans .planGrid__planLabelGrey,
.planGrid--has4Plans .planGrid__planLabelOutline {
font-size: 12px
}
}
.planGrid__planLabelGrey {
opacity: 1;
background: #d6d6d6;
color: #232323
}
.planGrid__planInput:active+.planGrid__planLabelGrey,
.planGrid__planInput:checked+.planGrid__planLabelGrey,
.planGrid__planInput:focus+.planGrid__planLabelGrey {
-webkit-box-shadow: 0 0 3px 0 #e50914;
-moz-box-shadow: 0 0 3px 0 #e50914;
box-shadow: 0 0 3px 0 #e50914;
background: #e50914;
color: #fff
}
.planGrid__planLabelOutline {
opacity: 1;
background: #fff;
color: #232323;
border: 2px solid #c4c4c4
}
.planGrid__planInput:active+.planGrid__planLabelOutline,
.planGrid__planInput:checked+.planGrid__planLabelOutline,
.planGrid__planInput:focus+.planGrid__planLabelOutline {
-webkit-box-shadow: 0 0 3px 0 #e50914;
-moz-box-shadow: 0 0 3px 0 #e50914;
box-shadow: 0 0 3px 0 #e50914;
background: #e50914;
color: #fff;
border: none
}
.planGrid__planLabelDarkOutline {
opacity: 1;
background: #fff;
color: #232323;
border: 2px solid #747474
}
.planGrid__planInput:active+.planGrid__planLabelDarkOutline,
.planGrid__planInput:checked+.planGrid__planLabelDarkOutline,
.planGrid__planInput:focus+.planGrid__planLabelDarkOutline {
-webkit-box-shadow: 0 0 3px 0 #e50914;
-moz-box-shadow: 0 0 3px 0 #e50914;
box-shadow: 0 0 3px 0 #e50914;
background: #e50914;
color: #fff;
border: none
}
.planGrid__cell {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #a6a6a6;
fill: #a6a6a6;
-webkit-box-flex: 1;
-webkit-flex: 1 1 auto;
-moz-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
text-align: center;
display: block
}
.planGrid__cell:not(.planGrid__featureCell) {
font-weight: 700;
color: #737373;
fill: #737373
}
.planGrid__cell.planGrid__cell--isSelected:not(.planGrid__featureCell) {
color: #e50914;
fill: #e50914
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__cell {
padding: 12px 16px
}
.planGrid--has1Plans .planGrid__cell {
width: -webkit-calc(20% / 1);
width: -moz-calc(20% / 1);
width: calc(20% / 1)
}
.planGrid--has2Plans .planGrid__cell {
width: -webkit-calc(40% / 2);
width: -moz-calc(40% / 2);
width: calc(40% / 2)
}
.planGrid--has3Plans .planGrid__cell {
width: -webkit-calc(60% / 3);
width: -moz-calc(60% / 3);
width: calc(60% / 3)
}
.planGrid--has4Plans .planGrid__cell {
width: -webkit-calc(65% / 4);
width: -moz-calc(65% / 4);
width: calc(65% / 4)
}
}
@media only screen and (max-width:600px) {
.planGrid__cell {
min-height: 37px;
padding: 8px;
position: relative
}
.planGrid--has1Plans .planGrid__cell {
width: -webkit-calc(100% / 1);
width: -moz-calc(100% / 1);
width: calc(100% / 1)
}
.planGrid--has2Plans .planGrid__cell {
width: -webkit-calc(100% / 2);
width: -moz-calc(100% / 2);
width: calc(100% / 2)
}
.planGrid--has3Plans .planGrid__cell {
width: -webkit-calc(100% / 3);
width: -moz-calc(100% / 3);
width: calc(100% / 3)
}
.planGrid--has4Plans .planGrid__cell {
width: -webkit-calc(100% / 4);
width: -moz-calc(100% / 4);
width: calc(100% / 4)
}
}
.planGrid__featureCell {
color: #333;
fill: #333;
-webkit-box-flex: 0;
-webkit-flex: 0 0 auto;
-moz-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
text-align: left
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid--has1Plans .planGrid__featureCell {
width: 80%
}
.planGrid--has2Plans .planGrid__featureCell {
width: 60%
}
.planGrid--has3Plans .planGrid__featureCell {
width: 40%
}
.planGrid--has4Plans .planGrid__featureCell {
width: 35%
}
}
@media only screen and (max-width:600px) {
.planGrid__featureCell {
text-align: center;
font-size: 13px;
padding: 16px 8px 4px
}
.planGrid__featureCell.planGrid__cell {
width: 100%
}
.planGrid__featureTableRow:not(:first-child) .planGrid__featureCell::before {
background: #ccc;
content: '';
display: block;
height: 1px;
left: 4px;
position: absolute;
right: 4px;
top: 3px
}
}
.planGrid__booleanCell {
position: relative
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__booleanCell {
padding-top: 11px;
padding-bottom: 5px
}
}
@media only screen and (max-width:600px) {
.planGrid__booleanCell {
padding-top: 4px;
padding-bottom: 4px
}
}
.planGrid__booleanIcon {
width: 26px;
height: 26px;
display: inline-block
}
.planGrid__booleanGraphic {
width: 26px;
height: 26px
}
.planGrid__booleanLabel {
position: absolute;
left: 50%;
top: 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%);
width: 26px;
height: 26px;
overflow: hidden;
opacity: 0;
line-height: 1em;
font-size: 72px
}
@media only screen and (max-width:950px) and (min-width:601px) {
.planGrid--has4Plans .planGrid__stringCell {
font-size: 14px
}
}
@media only screen and (max-width:600px) {
.planGrid--has4Plans .planGrid__stringCell {
font-size: 12px;
overflow-wrap: break-word
}
}
.planGrid__planMaxScreenCountCell {
position: relative
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__planMaxScreenCountCell {
padding-top: 9px;
padding-bottom: 9px
}
}
@media only screen and (max-width:600px) {
.planGrid__planMaxScreenCountCell {
padding-top: 4px;
padding-bottom: 6px
}
}
.planGrid__planMaxScreenCountLabel {
display: inline-block;
border: 2px solid #737373;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
width: 22px;
height: 22px;
text-align: center;
line-height: 22px;
color: #737373;
font-size: 20px;
font-weight: 400
}
.planGrid__cell--isSelected .planGrid__planMaxScreenCountLabel {
color: #e50914;
border-color: #e50914
}
.planGrid__supportedDevicesCell {
padding-top: 2px;
padding-bottom: 6px
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__supportedDevicesCell {
padding-top: 8px;
padding-bottom: 12px
}
}
.planGrid__supportedDevicesIcon {
width: 26px;
height: 26px;
margin-bottom: -2px;
margin-top: 6px
}
.planGrid__supportedDevicesLabel {
font-size: 12px;
font-weight: 700;
line-height: 17px;
margin-bottom: 6px
}
@media only screen and (max-width:950px) and (min-width:601px) {
.planGrid--has4Plans .planGrid__videoQualityLabel {
font-size: 14px
}
}
@media only screen and (max-width:600px) {
.planGrid--has4Plans .planGrid__videoQualityLabel {
font-weight: 700;
font-size: 12px
}
}
.planGrid__videoQualityLabel+.planGrid__videoQualityLabel {
font-size: 12px
}
@media only screen and (max-width:600px) {
.planGrid--has4Plans .planGrid__videoQualityLabel+.planGrid__videoQualityLabel {
font-weight: 400
}
}
.planGrid__featureTable {
border-collapse: collapse;
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: 10px
}
.planGrid__featureTableBody {
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
}
.planGrid__featureTableCaption {
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
overflow: hidden;
position: absolute;
width: 1px
}
.planGrid__featureTableRow {
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
@media only screen and (min-width:951px),
only screen and (max-width:950px) and (min-width:601px) {
.planGrid__featureTableRow {
border-bottom: 1px solid #ccc;
min-height: 60px
}
.planGrid__featureTableRow:last-child {
border: 0
}
}
@media only screen and (max-width:600px) {
.planGrid__featureTableRow {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap
}
}
.planGrid__featureTableRow--supportedDevices {
-webkit-box-align: start;
-webkit-align-items: start;
-moz-box-align: start;
-ms-flex-align: start;
align-items: start
}
.planGrid__disclaimer {
padding: 0 150px 0 16px;
color: #737373;
font-size: 13px;
display: block
}
@media screen and (max-width:600px) {
.planGrid__disclaimer {
padding: 0 16px
}
}
.planGrid__disclaimer+.planGrid__disclaimer {
margin-top: 10px
}
.plan-card-container .planGrid__disclaimer {
padding: 0 16px
}
@media only screen and (min-width:951px) {
.planGrid--hasFixedHeader {
padding-top: 144px
}
}
@media only screen and (max-width:950px) and (min-width:601px) {
.planGrid--hasFixedHeader {
padding-top: 114px
}
}
@media only screen and (max-width:600px) {
.planGrid--hasFixedHeader {
padding-top: 91px
}
}
.planGrid__header {
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;
-webkit-box-align: end;
-webkit-align-items: flex-end;
-moz-box-align: end;
-ms-flex-align: end;
align-items: flex-end
}
.planGrid--hasFixedHeader .planGrid__header {
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
left: 50%;
max-width: 978px;
padding: 0 16px;
position: fixed;
top: 0;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
width: 100%;
z-index: 1
}
.centerContainer.planBundleCards {
max-width: 1200px
}
.planFormContainer.bundleCardSelection .headerCentered {
text-align: center;
margin-bottom: 30px
}
.planFormContainer.bundleCardSelection .headerCentered .stepTitle {
font-size: 38px
}
.planBundleCards--disclaimersContainer {
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;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0 5vw;
text-align: center
}
.planBundleCards--container {
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-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
@media screen and (max-width:500px) {
.planBundleCards--container.numCards-2 {
-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
}
}
@media screen and (max-width:750px) {
.planBundleCards--container.numCards-3 {
-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
}
}
@media screen and (max-width:1000px) {
.planBundleCards--container.numCards-4 {
-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
}
}
.planBundleCard--container {
border: 1px solid #dedede;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
padding: 20px 24px 24px 24px;
margin: 12px;
width: 250px;
display: -ms-inline-grid;
display: inline-grid;
grid-gap: 6px;
-ms-grid-rows: auto auto 36px 32px 32px auto;
grid-template-rows: auto auto 36px 32px 32px auto
}
.planBundleCard--container .mobile-color {
color: #1d9db8
}
.planBundleCard--container .basic-color {
color: #fd8d07
}
.planBundleCard--container .standard-color {
color: #e50914
}
.planBundleCard--container .premium-color {
color: #43005f
}
.planBundleCard--container svg {
fill: currentColor
}
.planBundleCard--planName {
font-size: 18px;
font-weight: 600;
margin-bottom: 6px
}
.planBundleCard--amount {
font-size: 32px;
font-weight: 800
}
.planBundleCard--amountSubtext {
font-size: 12px;
line-height: 18px;
color: #353535;
overflow: hidden
}
.planBundleCard--icon {
margin-right: 8px;
-webkit-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0
}
.planBundleCard--pictureQuality {
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;
font-size: 12px;
line-height: 16px;
overflow: hidden
}
.planBundleCard--watchInfo {
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;
font-size: 12px;
line-height: 16px;
overflow: hidden
}
.planBundleCard--cta {
margin-top: 12px;
padding: 11px;
text-align: center;
color: #fff;
font-weight: 600;
border: none;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
font-size: 14px;
white-space: nowrap;
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out
}
.planBundleCard--cta.mobile {
background-color: #1d9db8
}
.planBundleCard--cta.mobile:hover {
background-color: #16778c
}
.planBundleCard--cta.basic {
background-color: #fd8d07
}
.planBundleCard--cta.basic:hover {
background-color: #cf7202
}
.planBundleCard--cta.standard {
background-color: #e50914
}
.planBundleCard--cta.standard:hover {
background-color: #b40710
}
.planBundleCard--cta.premium {
background: -webkit-gradient(linear, left top, right top, from(#1f002c), color-stop(50%, #43005f), to(#670092));
background: -webkit-linear-gradient(left, #1f002c 0, #43005f 50%, #670092 100%);
background: -moz- oldlinear-gradient(left, #1f002c 0, #43005f 50%, #670092 100%);
background: -o-linear-gradient(left, #1f002c 0, #43005f 50%, #670092 100%);
background: linear-gradient(90deg, #1f002c 0, #43005f 50%, #670092 100%);
-webkit-background-size: 200%, 100%;
-moz-background-size: 200%, 100%;
background-size: 200%, 100%
}
.planBundleCard--cta.premium:hover {
background-position: 100%
}
.planFormContainer {
max-width: 1024px;
margin: 0 auto;
overflow: hidden
}
.planFormContainer .headerCentered {
text-align: center
}
.planFormContainer .changeAnytime {
margin-bottom: 20px
}
.planFormContainer .changeAnytime .valueBullets {
margin: 0 auto 26px 0
}
.planFormContainer .changeAnytime .valueBullets li {
list-style-type: none;
margin-left: 0;
line-height: 14px
}
.planFormContainer .changeAnytime .valueBullets li:before {
content: '\F030';
font-family: nf-icon;
font-size: 36px;
line-height: 14px;
top: 12px;
position: relative;
color: #e50914
}
.hasExtendedDiacritics .planFormContainer .stepTitle {
line-height: 39px
}
.planFormContainer>.radioSelect {
height: 48px;
margin-bottom: 5px
}
.messageContainer {
text-align: left
}
.messageContainer:focus {
outline: 0
}
.loading-container,
.verify-card-iframe {
display: block;
height: 400px;
max-width: 100%;
width: 400px;
margin: 20px auto 0;
border: 4px solid #efefef;
background: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
@media screen and (max-width:440px) {
.loading-container,
.verify-card-iframe {
border-left: none;
border-right: none
}
}
.loading-container .loading-message,
.verify-card-iframe .loading-message {
text-align: center;
margin-bottom: 0
}
.verify-card-iframe-improved {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
@media screen and (max-width:440px) {
.verify-card-iframe-improved {
border-left: 4px solid #efefef;
border-right: 4px solid #efefef
}
}
.iframe-holder {
position: relative;
margin: 0 -webkit-calc(-1 * var(--layout-container-side-padding));
margin: 0 -moz-calc(-1 * var(--layout-container-side-padding));
margin: 0 calc(-1 * var(--layout-container-side-padding))
}
.loading-container {
margin: 0;
border: none;
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-flow: column wrap;
-moz-box-orient: vertical;
-moz-box-direction: normal;
-ms-flex-flow: column wrap;
flex-flow: column wrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center
}
.loading-container .basic-spinner {
margin: 0 0 0 12.5%
}
.stepUpAuthenticationIframe {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: block;
width: 400px;
max-width: 100%;
margin: 20px auto 0;
border: 4px solid #efefef;
background: #fff;
height: 400px
}
.stepUpAuthenticationIframe--02 {
width: 390px
}
.stepUpAuthenticationIframe--03 {
height: 600px;
width: 500px
}
.stepUpAuthenticationIframe--04 {
width: 600px
}
.contextContainer:empty {
display: 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
}
.nfdialog.verifyCardContainer {
text-align: center
}
.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
}
.verifyCodeContainer {
text-align: left;
max-width: 440px;
margin: 0 auto
}
.verifyCodeContainer .stepLogo {
position: relative;
width: 60px;
height: 60px;
display: block;
margin: 10% 0 10%
}
.verifyCodeContainer .contextRow {
display: inline-block
}
.verifyCodeContainer .contextBody {
margin-bottom: 30px;
font-size: 18px
}
.verifyCodeContainer .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
}
.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 .plan-user-addendum,
.contextContainer .plan-user-addendum {
font-size: 14px;
padding: 0 14px 14px
}
.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 .mop-title,
.confirmFormContainer .user-info .user-email,
.contextContainer .user-info .mop-title,
.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
}
.confirmFormContainer .standardized-plan {
background-color: #f4f4f4;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px
}
.confirmFormContainer .standardized-plan .simpleForm {
padding-left: 14px;
padding-right: 14px;
padding-bottom: 14px
}
.confirmFormContainer .standardized-plan .simpleForm .nfFormSpace {
margin: 0
}
.confirmFormContainer .standardized-plan .plan-choice {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 14px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border-bottom: 1px solid #e6e6e6
}
.confirmFormContainer .standardized-plan .selected-plan {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
max-width: 60%
}
.confirmFormContainer .standardized-plan .selected-plan .plan-name {
font-size: 16px;
font-weight: 400;
color: #737373;
display: inline
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .selected-plan .plan-name {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .selected-plan .plan-price {
font-size: 16px;
font-weight: 700;
color: #333;
display: block;
margin-bottom: 5px
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .selected-plan .plan-price {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .plan-trial {
margin-left: 20px
}
.confirmFormContainer .standardized-plan .change_plan {
font-size: 16px
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .change_plan {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .change_plan a {
font-size: 16px;
font-weight: 700;
cursor: pointer
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .change_plan a {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .change_plan a.gray {
color: #737373
}
.confirmFormContainer .standardized-plan .plan-user {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 14px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.confirmFormContainer .standardized-plan .plan-user .user-info {
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;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
font-size: 16px;
font-weight: 700;
color: #333
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .plan-user .user-info {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .plan-user .logos,
.confirmFormContainer .standardized-plan .plan-user .user-confirm-credit,
.confirmFormContainer .standardized-plan .plan-user .user-confirm-paypal {
margin-bottom: 5px
}
.confirmFormContainer .standardized-plan .plan-user .user-name {
font-size: 16px;
font-weight: 400;
color: #737373;
overflow-x: hidden;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
-webkit-box-ordinal-group: 3;
-webkit-order: 2;
-moz-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .plan-user .user-name {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .plan-user .gift-balance-container {
margin-top: 5px;
-webkit-box-ordinal-group: 4;
-webkit-order: 3;
-moz-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3
}
.confirmFormContainer .standardized-plan .plan-user .select-user {
margin-left: 20px
}
.confirmFormContainer .standardized-plan .plan-user .select-user .select-user a {
font-size: 16px;
font-weight: 700;
cursor: pointer
}
@media screen and (max-width:740px) {
.confirmFormContainer .standardized-plan .plan-user .select-user .select-user a {
font-size: 14px
}
}
.confirmFormContainer .standardized-plan .plan-user .select-user .select-user a.gray {
color: #737373
}
.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
}
.regFormContainer .messageFeesMayApply {
font-size: 13px;
color: #8c8c8c
}
.passwordFormContainer .submitBtnContainer {
text-align: left
}
.passwordFormContainer .submitBtnContainer .link-forgot-password {
display: inline-block;
margin: 10px 0;
text-align: left
}
.passwordFormContainer .input-readOnly {
padding: 10px 0
}
.passwordFormContainer .value-readOnly {
font-weight: 700
}
.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: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, .97)
}
.close-button {
position: absolute;
top: 20px;
right: 20px
}
.tooltipDesc {
text-align: center;
margin: auto;
padding-top: 80px;
max-width: 270px
}
.otherCvvHelp {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/visa_cvv.png) no-repeat 0 0;
width: 200px;
height: 130px;
margin: 30px auto;
opacity: 1
}
.amexCvvHelp {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/amex_cvv.png) no-repeat 0 0;
width: 200px;
height: 130px;
margin: 30px auto;
opacity: 1
}
.otherCvv {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/visa_cvv.png) no-repeat 0 0;
width: 200px;
height: 130px;
margin: 0 auto
}
.amexCvv {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/amex_cvv.png) no-repeat 0 0;
width: 200px;
height: 130px;
margin: 0 auto
}
@media (-webkit-min-device-pixel-ratio:2),
(-o-min-device-pixel-ratio:2/1),
(min-resolution:192dpi) {
.otherCvvHelp {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/visa_cvv_2x.png) no-repeat 0 0;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain
}
.amexCvvHelp {
background: url(https://assets.nflxext.com/ffe/siteui/acquisition/payment/tooltip/amex_cvv_2x.png) no-repeat 0 0;
-webkit-background-size: contain;
-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
}
}
.btn-bar {
padding: 0 0 1em;
clear: both
}
.btn-bar.hilite {
background-color: #e5e5e5;
padding: 10px
}
.btn-bar.hilite b,
.btn-bar.hilite em {
font-weight: 700;
font-style: normal
}
.btn-bar.noHilite b,
.btn-bar.noHilite em {
font-style: normal;
font-weight: 400
}
.btn-bar.top-padding {
padding-top: 1em
}
.btn-bar-left {
text-align: left
}
.btn-bar-left .btn {
margin-right: 1em;
margin-left: 0
}
.btn-bar-right {
text-align: right
}
.btn-bar-right .btn {
margin-right: 0;
margin-left: 1em
}
.btn-bar-center {
text-align: center
}
.btn-bar-center .btn {
margin-right: .5em;
margin-left: .5em
}
.btn {
display: inline-block;
text-decoration: none;
line-height: 1em;
vertical-align: middle;
cursor: pointer;
font-weight: 400;
letter-spacing: .1px;
-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: 0;
position: relative;
color: #000;
background-color: #e6e6e6;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#ddd));
background-image: -webkit-linear-gradient(top, #e6e6e6, #ddd);
background-image: -moz- oldlinear-gradient(top, #e6e6e6, #ddd);
background-image: -o-linear-gradient(top, #e6e6e6, #ddd);
background-image: linear-gradient(to bottom, #e6e6e6, #ddd);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
box-shadow: 0 1px 0 rgba(0, 0, 0, .2)
}
.btn .btn-text {
position: relative;
top: 1px
}
.btn.disabled {
cursor: default;
opacity: .5
}
.btn.waiting,
.btn.waiting.akira-button,
.btn.waiting.akira-button-red,
.btn.waiting:disabled,
.btn.waiting:disabled.akira-button,
.btn.waiting:disabled.akira-button-red {
color: rgba(255, 255, 255, 0)
}
.btn.waiting span,
.btn.waiting.akira-button span,
.btn.waiting.akira-button-red span,
.btn.waiting:disabled span,
.btn.waiting:disabled.akira-button span,
.btn.waiting:disabled.akira-button-red span {
opacity: 0
}
.btn.hover,
.btn:hover {
text-decoration: none;
background: #eaeaea;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
box-shadow: 0 1px 0 rgba(0, 0, 0, .2)
}
.btn.active,
.btn:active {
background: #c2c2c2
}
.btn.disabled {
background-color: #e6e6e6;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#ddd));
background-image: -webkit-linear-gradient(top, #e6e6e6, #ddd);
background-image: -moz- oldlinear-gradient(top, #e6e6e6, #ddd);
background-image: -o-linear-gradient(top, #e6e6e6, #ddd);
background-image: linear-gradient(to bottom, #e6e6e6, #ddd);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
box-shadow: 0 1px 0 rgba(0, 0, 0, .2)
}
.btn .waitIndicator {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0
}
.btn .waitIndicator .basic-spinner {
position: absolute;
top: 50%;
left: 50%
}
.action-button,
.btn-blue,
.btn-submit {
color: #fff;
background-color: #0080ff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#0080ff), to(#0277ec));
background-image: -webkit-linear-gradient(top, #0080ff, #0277ec);
background-image: -moz- oldlinear-gradient(top, #0080ff, #0277ec);
background-image: -o-linear-gradient(top, #0080ff, #0277ec);
background-image: linear-gradient(to bottom, #0080ff, #0277ec);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.action-button.hover,
.action-button:hover,
.btn-blue.hover,
.btn-blue:hover,
.btn-submit.hover,
.btn-submit:hover {
background: #2490fd;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.action-button.active,
.action-button:active,
.btn-blue.active,
.btn-blue:active,
.btn-submit.active,
.btn-submit:active {
background: #0166c9
}
.action-button.disabled,
.btn-blue.disabled,
.btn-submit.disabled {
background-color: #0080ff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#0080ff), to(#0272e2));
background-image: -webkit-linear-gradient(top, #0080ff, #0272e2);
background-image: -moz- oldlinear-gradient(top, #0080ff, #0272e2);
background-image: -o-linear-gradient(top, #0080ff, #0272e2);
background-image: linear-gradient(to bottom, #0080ff, #0272e2);
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-red {
color: #fff;
background-color: #e50914;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e50914), to(#db0510));
background-image: -webkit-linear-gradient(top, #e50914, #db0510);
background-image: -moz- oldlinear-gradient(top, #e50914, #db0510);
background-image: -o-linear-gradient(top, #e50914, #db0510);
background-image: linear-gradient(to bottom, #e50914, #db0510);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
box-shadow: 0 1px 0 rgba(0, 0, 0, .45)
}
.btn-red .basic-spinner {
-webkit-box-shadow: inset 2px 2px 0 #fff;
-moz-box-shadow: inset 2px 2px 0 #fff;
box-shadow: inset 2px 2px 0 #fff
}
.btn-red.hover,
.btn-red:focus,
.btn-red:hover {
background: #f40612;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
box-shadow: 0 1px 0 rgba(0, 0, 0, .45)
}
.btn-red:focus {
-webkit-box-shadow: 0 0 0 .085em #85050b;
-moz-box-shadow: 0 0 0 .085em #85050b;
box-shadow: 0 0 0 .085em #85050b
}
.btn-red.active,
.btn-red:active {
background: #bb0a12
}
.btn-red.disabled {
background-color: #e50914;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e50914), to(#db0510));
background-image: -webkit-linear-gradient(top, #e50914, #db0510);
background-image: -moz- oldlinear-gradient(top, #e50914, #db0510);
background-image: -o-linear-gradient(top, #e50914, #db0510);
background-image: linear-gradient(to bottom, #e50914, #db0510);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
box-shadow: 0 1px 0 rgba(0, 0, 0, .45)
}
.btn-orange {
color: #000;
background-color: #ffa00a;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ffa00a), to(#f09300));
background-image: -webkit-linear-gradient(top, #ffa00a, #f09300);
background-image: -moz- oldlinear-gradient(top, #ffa00a, #f09300);
background-image: -o-linear-gradient(top, #ffa00a, #f09300);
background-image: linear-gradient(to bottom, #ffa00a, #f09300);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
box-shadow: 0 1px 0 rgba(0, 0, 0, .45)
}
.btn-orange.hover,
.btn-orange:hover {
background: #ffb43d;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
box-shadow: 0 1px 0 rgba(0, 0, 0, .45)
}
.btn-orange.active,
.btn-orange:active {
background: #d68300
}
.btn-orange.disabled {
background-color: #e50914;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e50914), to(#db0510));
background-image: -webkit-linear-gradient(top, #e50914, #db0510);
background-image: -moz- oldlinear-gradient(top, #e50914, #db0510);
background-image: -o-linear-gradient(top, #e50914, #db0510);
background-image: linear-gradient(to bottom, #e50914, #db0510);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .45);
box-shadow: 0 1px 0 rgba(0, 0, 0, .45)
}
.btn-gray,
.btn-plain {
color: #000;
background-color: #e6e6e6;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#ddd));
background-image: -webkit-linear-gradient(top, #e6e6e6, #ddd);
background-image: -moz- oldlinear-gradient(top, #e6e6e6, #ddd);
background-image: -o-linear-gradient(top, #e6e6e6, #ddd);
background-image: linear-gradient(to bottom, #e6e6e6, #ddd);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
box-shadow: 0 1px 0 rgba(0, 0, 0, .2)
}
.btn-gray.hover,
.btn-gray:hover,
.btn-plain.hover,
.btn-plain:hover {
background: #eaeaea;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
box-shadow: 0 1px 0 rgba(0, 0, 0, .2)
}
.btn-gray.active,
.btn-gray:active,
.btn-plain.active,
.btn-plain:active {
background: #c2c2c2
}
.btn-gray.disabled,
.btn-plain.disabled {
background-color: #e6e6e6;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#ddd));
background-image: -webkit-linear-gradient(top, #e6e6e6, #ddd);
background-image: -moz- oldlinear-gradient(top, #e6e6e6, #ddd);
background-image: -o-linear-gradient(top, #e6e6e6, #ddd);
background-image: linear-gradient(to bottom, #e6e6e6, #ddd);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .2);
box-shadow: 0 1px 0 rgba(0, 0, 0, .2)
}
.btn-dark-gray {
color: #fff;
background-color: #8c8c8c;
background-image: -webkit-gradient(linear, left top, left bottom, from(#8c8c8c), to(#7a7a7a));
background-image: -webkit-linear-gradient(top, #8c8c8c, #7a7a7a);
background-image: -moz- oldlinear-gradient(top, #8c8c8c, #7a7a7a);
background-image: -o-linear-gradient(top, #8c8c8c, #7a7a7a);
background-image: linear-gradient(to bottom, #8c8c8c, #7a7a7a);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-dark-gray.hover,
.btn-dark-gray:hover {
background: #878787;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-dark-gray.active,
.btn-dark-gray:active {
background: #555
}
.btn-dark-gray.disabled {
background-color: #8c8c8c;
background-image: -webkit-gradient(linear, left top, left bottom, from(#8c8c8c), to(#7a7a7a));
background-image: -webkit-linear-gradient(top, #8c8c8c, #7a7a7a);
background-image: -moz- oldlinear-gradient(top, #8c8c8c, #7a7a7a);
background-image: -o-linear-gradient(top, #8c8c8c, #7a7a7a);
background-image: linear-gradient(to bottom, #8c8c8c, #7a7a7a);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-darker-gray {
color: #fff;
background-color: #3a3a3a;
background-image: -webkit-gradient(linear, left top, left bottom, from(#3a3a3a), to(#393939));
background-image: -webkit-linear-gradient(top, #3a3a3a, #393939);
background-image: -moz- oldlinear-gradient(top, #3a3a3a, #393939);
background-image: -o-linear-gradient(top, #3a3a3a, #393939);
background-image: linear-gradient(to bottom, #3a3a3a, #393939);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-darker-gray.hover,
.btn-darker-gray:hover {
background: #464646;
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-darker-gray.active,
.btn-darker-gray:active {
background: #444
}
.btn-darker-gray.disabled {
background-color: #3a3a3a;
background-image: -webkit-gradient(linear, left top, left bottom, from(#3a3a3a), to(#393939));
background-image: -webkit-linear-gradient(top, #3a3a3a, #393939);
background-image: -moz- oldlinear-gradient(top, #3a3a3a, #393939);
background-image: -o-linear-gradient(top, #3a3a3a, #393939);
background-image: linear-gradient(to bottom, #3a3a3a, #393939);
-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, .55);
box-shadow: 0 1px 0 rgba(0, 0, 0, .55)
}
.btn-outline {
color: #666;
background: rgba(0, 0, 0, 0);
border: 1px solid #666;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none
}
.btn-outline.hover,
.btn-outline:hover {
background: 0 0;
border-color: #333;
color: #333
}
.btn-outline.active,
.btn-outline:active {
border-color: #1a1a1a;
color: #1a1a1a
}
.btn-outline.disabled {
border-color: #999;
color: #999
}
.btn-white-outline {
color: #fff;
background: rgba(0, 0, 0, 0);
border: solid 1px rgba(255, 255, 255, .75);
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
text-shadow: 0 1px 1px rgba(0, 0, 0, .15)
}
.btn-white-outline.hover,
.btn-white-outline:hover {
background: rgba(0, 0, 0, 0);
border: solid 1px #fff;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none
}
.btn-white-outline.active,
.btn-white-outline:active {
background: rgba(0, 0, 0, 0);
border: solid 1px rgba(255, 255, 255, .55)
}
.btn-white-outline.disabled {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: 0 0;
border: solid 1px rgba(255, 255, 255, .75)
}
.btn-white-outline.btn-medium {
text-shadow: 0 1px 1px rgba(0, 0, 0, .25)
}
.btn-white-outline.btn-small {
text-shadow: 0 1px 1px rgba(0, 0, 0, .35)
}
.btn-white {
color: #fff;
background-color: #e6e6e6;
background-image: -webkit-gradient(linear, left top, left bottom, from(#e6e6e6), to(#ddd));
background-image: -webkit-linear-gradient(top, #e6e6e6, #ddd);
background-image: -moz- oldlinear-gradient(top, #e6e6e6, #ddd);
background-image: -o-linear-gradient(top, #e6e6e6, #ddd);
background-image: linear-gradient(to bottom, #e6e6e6, #ddd);
-webkit-box-shadow: 0 1px 0 rgba(1, 1, 0, .2);
-moz-box-shadow: 0 1px 0 rgba(1, 1, 0, .2);
box-shadow: 0 1px 0 rgba(1, 1, 0, .2)
}
.btn-white.hover,
.btn-white:hover {
background: rgba(0, 0, 0, 0);
border: solid 1px #fff;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none
}
.btn-white.active,
.btn-white:active {
background: rgba(0, 0, 0, 0);
border: solid 1px rgba(255, 255, 255, .55)
}
.btn-white.disabled {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: 0 0;
border: solid 1px rgba(255, 255, 255, .75)
}
.btn.btn-retro-signup {
background-color: #1872d9;
background-image: -webkit-gradient(linear, left top, left bottom, from(#1872d9), to(#135aac));
background-image: -webkit-linear-gradient(top, #1872d9, #135aac);
background-image: -moz- oldlinear-gradient(top, #1872d9, #135aac);
background-image: -o-linear-gradient(top, #1872d9, #135aac);
background-image: linear-gradient(to bottom, #1872d9, #135aac);
color: #fff;
-webkit-box-shadow: inset 0 1px 0 0 #5e9de4;
-moz-box-shadow: inset 0 1px 0 0 #5e9de4;
box-shadow: inset 0 1px 0 0 #5e9de4;
border: 1px solid #265890;
text-shadow: 1px 1px 1px #000;
line-height: 22px;
font-weight: 700;
font-size: 20px;
padding: 15px 40px;
min-width: 250px
}
.btn.btn-retro-signup:hover {
background: #115099;
background-color: #1b7ff2;
background-image: -webkit-gradient(linear, left top, left bottom, from(#1b7ff2), to(#115099));
background-image: -webkit-linear-gradient(top, #1b7ff2, #115099);
background-image: -moz- oldlinear-gradient(top, #1b7ff2, #115099);
background-image: -o-linear-gradient(top, #1b7ff2, #115099);
background-image: linear-gradient(to bottom, #1b7ff2, #115099);
-webkit-box-shadow: 0 4px 10px -6px #010101, inset 0 1px 0 0 #60a6f6;
-moz-box-shadow: 0 4px 10px -6px #010101, inset 0 1px 0 0 #60a6f6;
box-shadow: 0 4px 10px -6px #010101, inset 0 1px 0 0 #60a6f6
}
.btn.btn-retro-signup:active {
background: #0d3c73;
background-color: #115099;
background-image: -webkit-gradient(linear, left top, left bottom, from(#115099), to(#0d3c73));
background-image: -webkit-linear-gradient(top, #115099, #0d3c73);
background-image: -moz- oldlinear-gradient(top, #115099, #0d3c73);
background-image: -o-linear-gradient(top, #115099, #0d3c73);
background-image: linear-gradient(to bottom, #115099, #0d3c73);
-webkit-box-shadow: inset 0 1px 0 0 #073b7e;
-moz-box-shadow: inset 0 1px 0 0 #073b7e;
box-shadow: inset 0 1px 0 0 #073b7e;
color: #b3b3b3;
border: 1px solid #1e5292
}
.btn-block {
display: block;
margin-left: 0;
margin-right: 0
}
.btn {
position: relative;
font-size: 1em;
padding: 24.5px 2em;
min-width: 74px;
min-height: 50px;
margin: .5em .5em .5em 0
}
@media only screen and (max-width:500px) {
.btn {
width: 100%;
margin: .5em auto
}
}
.btn.btn-x-large {
font-size: 26px;
padding: 23px 2em;
min-width: 124px;
min-height: 72px
}
@media only screen and (max-width:500px) {
.btn.btn-x-large {
width: 100%;
margin: .5em auto
}
}
.btn.btn-large {
font-size: 20px;
padding: 14px 2em;
min-width: 112px;
min-height: 48px
}
@media only screen and (max-width:500px) {
.btn.btn-large {
width: 100%;
margin: .5em auto
}
}
.btn.btn-medium {
font-size: 16px;
padding: 10.5px 2em;
min-width: 104px;
min-height: 37px
}
@media only screen and (max-width:500px) {
.btn.btn-medium {
width: 100%;
margin: .5em auto
}
}
.btn.btn-select {
font-size: 16px;
padding: 5.5px 2em;
min-width: 104px;
min-height: 27px
}
.btn.btn-select.t-size-SMALL {
font-size: 10px;
line-height: 9px;
vertical-align: middle
}
.btn.btn-select.t-size-MEDIUM {
font-size: 15px;
line-height: 15px;
vertical-align: middle
}
.btn.btn-select.t-size-LARGE {
font-size: 18px;
line-height: 18px;
vertical-align: middle
}
@media only screen and (max-width:500px) {
.btn.btn-select {
width: 30%;
margin: .5em auto
}
}
.btn.btn-small {
display: block;
width: 100%;
padding: 0;
margin: .5em auto;
line-height: 50px
}
@media only screen and (min-width:500px) {
.btn.btn-small {
display: inline-block;
font-size: 13px;
padding: 12px 2em;
min-width: 98px;
min-height: 37px;
margin-right: .5em;
padding-left: 1em;
padding-right: 1em;
width: auto;
line-height: 1em
}
}
.akira-button {
outline: 0;
padding: .5em 1em;
margin: 0;
display: inline-block;
border: none;
background: #333;
color: #fff;
font-weight: 700
}
.akira-button.btn-medium {
padding: .5em 1em
}
.akira-button:hover {
background-color: #4d4d4d
}
.akira-button:active {
background-color: #4d4d4d
}
.akira-button:disabled {
color: #333;
background-color: #333
}
.akira-button:disabled.waiting {
color: #333
}
.akira-button.akira-button-red {
background-color: #e50914;
color: #fff
}
.akira-button.akira-button-red:hover {
background-color: #ee000c
}
.akira-button.akira-button-red:active {
background-color: #ee000c
}
.akira-button.akira-button-red:disabled {
color: #4d4d4d;
background-color: rgba(229, 9, 20, .3)
}
.outline-btn {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
background-color: transparent;
border: 2px solid #e50914;
color: #e50914;
padding: 13px 2em;
cursor: pointer;
text-decoration: none;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px
}
.outline-btn:focus,
.outline-btn:hover {
background-color: rgba(50, 50, 50, .05);
text-decoration: none
}
.outline-btn:active {
background-color: rgba(50, 50, 50, .15)
}
.outline-btn.outline-btn-white {
color: #fff;
border-color: #fff
}
.outline-btn.outline-btn-white:hover {
background-color: rgba(220, 220, 220, .3);
text-decoration: none
}
.outline-btn.outline-btn-white:active {
background-color: rgba(220, 220, 220, .45)
}
.body-modal-open {
overflow: hidden
}
.nfmodal {
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;
color: #333
}
.nfmodal.opaque {
background-color: #000
}
.nfmodal.opaque .nfdialog {
color: #fff;
background-color: transparent
}
.nfmodal.clearBackground {
background-color: transparent
}
.nfmodal.fluidWidth {
text-align: center
}
.nfmodal.fluidWidth .nfdialog {
display: inline-block;
text-align: left;
max-width: none
}
.nfdialog {
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
}
.nfdialog.small {
width: 500px;
min-height: 150px;
padding-bottom: 0
}
.nfdialog.large {
max-width: 700px;
width: 700px;
min-height: 250px;
margin-top: 3%
}
@media only screen and (max-width:790px) {
.nfdialog.large,
.nfdialog.small {
width: 90%
}
}
@media only screen and (max-width:360px) {
.nfdialog {
width: 95%
}
}
.nfdfoot,
.nfdhead {
-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
}
.nfdfoot.unused,
.nfdhead.unused {
display: none
}
.nfdcontent,
.nfdfoot,
.nfdhead {
padding: 6px 20px
}
.nfdhead {
border-bottom-radius: 0;
position: relative;
margin-bottom: 10px
}
.nfdhead h1 {
margin: 10px 20px 0 0;
padding: 0;
font-weight: 400;
color: inherit
}
.nfdhead h3 {
margin: 5px 0 0
}
.opaque .nfdhead h1 {
font-size: 3.5vw;
text-align: center
}
@media screen and (max-width:800px) {
.opaque .nfdhead h1 {
font-size: 30px
}
}
.buttonbar {
margin-bottom: 25px
}
.buttonbar,
.nfdfoot {
text-align: right;
overflow: hidden
}
.buttonbar .svf-button,
.nfdfoot .svf-button {
float: none;
display: inline-block;
margin-left: 1em;
margin-right: 0;
min-width: 8em;
text-align: center
}
.buttonbar .leftLink,
.nfdfoot .leftLink {
float: left;
margin-left: 0;
margin-right: 1em
}
.buttonbar .rightLink,
.nfdfoot .rightLink {
float: right;
margin-right: 0;
margin-left: 1em
}
.nfdcontent {
padding: 6px 20px 5px
}
@media only screen and (max-width:360px) {
.nfdcontent {
padding: 6px 10px 5px
}
}
.nfdcontent em {
color: #ae1d00;
font-style: normal;
font-weight: 700
}
.nfdcontent .topImg {
display: block;
min-height: 300px;
min-width: 400px;
margin: 15px auto 0
}
.nfdclose {
position: absolute;
height: 30px;
width: 30px;
cursor: pointer;
text-align: center;
line-height: 30px;
margin: 0;
padding: 0;
text-decoration: none;
top: 10px;
right: 10px
}
.nfdclose:hover {
text-decoration: none
}
.nfdclose:before {
content: '\00D7';
font-size: 40px;
color: #666
}
.text-payment,
.text-payment-pbl {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
speak: normal;
display: inline-block
}
.text-payment-pbl {
display: inline
}
.mopType {
unicode-bidi: isolate;
direction: ltr;
margin-left: 0;
overflow: hidden;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis
}
.dcb-payment b {
padding-right: 5px
}
.pbl-payment-type .mopType {
white-space: normal
}
.credit-card-type {
margin-right: 1ex
}
.credit-card-digits {
display: inline-block
}
.icon-payment .text-payment {
text-indent: -9999px;
font-size: 0;
line-height: 0
}
.icon-payment-image {
height: 20px;
margin-right: 5px
}
.icon-payment-amex:before {
content: '\e916';
font-size: 11px
}
.icon-payment-visa:before {
content: '\e901';
font-size: 13px
}
.icon-payment-naranja:before {
content: '\f122';
font-size: 18px
}
.icon-payment-mastercard:before {
content: '\e902';
font-size: 18px
}
.icon-payment-discover:before {
content: '\e903';
font-size: 18px
}
.icon-payment-hsbc:before {
content: '\e904'
}
.icon-payment-ideal:before {
content: '\e905';
font-size: 18px;
margin-right: 3px;
position: relative;
top: 3px
}
.icon-payment-banamex:before {
content: '\e906'
}
.icon-payment-diners:before {
content: '\f047';
font-size: 22px
}
.icon-payment-jcb:before {
content: '\f046'
}
.icon-payment-itau:before {
content: '\e908'
}
.icon-payment-banorte:before {
content: '\e910'
}
.icon-payment-bbva:before {
content: '\e911'
}
.icon-payment-elo:before {
content: '\e912'
}
.icon-payment-paypal:before {
content: '\e914'
}
.icon-payment-gift:before {
content: '\e5d0';
position: relative;
top: 2px
}
.no-payment-type {
font-weight: 700
}
.u-d-block {
display: block
}
.u-d-inline {
display: inline
}
.u-d-inline-block {
display: inline-block
}
.u-ta-center {
text-align: center
}
.u-ta-left {
text-align: left
}
.u-ta-right {
text-align: right
}
.u-p-relative {
position: relative
}
.wallet--container {
margin: 0 auto;
max-width: 700px;
text-align: center
}
.wallet--container .stepLogoContainer {
display: inline-block
}
.wallet--container .stepLogo {
display: block
}
.wallet--subtitle {
margin-top: 10px
}
.wallet--list {
margin-top: 40px
}
.wallet--item {
border-bottom: 1px solid #ccc;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-moz-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 24px 0
}
.wallet--item:last-of-type {
border-bottom: none
}
.wallet--details {
font-weight: 700;
margin-bottom: 10px;
text-align: left;
width: 100%
}
@media (min-width:500px) {
.wallet--details {
margin-bottom: 0;
width: 50%
}
.wallet--details .wallet--context {
white-space: nowrap
}
}
.wallet--backup-header {
margin-top: 10px
}
.wallet--context {
color: #a6a6a6;
font-size: 14px;
font-weight: 400;
margin-top: 10px
}
.wallet--action.-hidden {
visibility: hidden
}
@media (max-width:500px) {
.wallet--action.-col-delete,
.wallet--action.-col-edit,
.wallet--action.-col-primary {
font-size: 14px
}
}
.wallet--action.-col-primary {
text-align: left;
width: 44%
}
@media (min-width:500px) {
.wallet--action.-col-primary {
text-align: center;
width: 18%
}
}
.wallet--action.-col-edit {
width: 30%
}
@media (min-width:500px) {
.wallet--action.-col-edit {
text-align: right;
width: 16%
}
}
.wallet--action.-col-delete {
text-align: right;
width: 22%
}
@media (min-width:500px) {
.wallet--action.-col-delete {
width: 16%
}
}
.wallet--mop {
font-weight: 700;
line-height: 1.5;
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;
-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
}
.wallet--mop .dcb-payment {
font-weight: 400
}
.wallet--mop .dcb-payment b {
padding-left: 0
}
.wallet--upcoming {
font-family: 'Netflix Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
margin-bottom: 5px
}
.wallet--primary {
font-family: 'Netflix Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
border: 1px #1a1a1a solid;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
color: #1a1a1a;
display: inline-block;
font-size: 13px;
font-weight: 600;
margin: 0 5px;
padding: 2px 10px;
pointer-events: none;
position: relative;
top: -1px;
white-space: nowrap
}
@media (max-width:500px) {
.wallet--action .wallet--primary {
margin: 0
}
}
.wallet--add--action {
outline: 0
}
.wallet--add--action span {
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;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center
}
.wallet--add--action svg {
padding-right: 5px;
width: 12px
}
.wallet--modal .nfdtitle {
font-size: 27px
}
.wallet--modal .nf-btn {
margin-bottom: 10px
}
.wallet--modal .nf-btn:last-child {
margin-bottom: 0
}
@media (min-width:500px) {
.wallet--modal .nf-btn {
margin-bottom: 0;
margin-right: 20px
}
.wallet--modal .nf-btn:last-child {
margin-right: 0
}
}
.wallet--modal--description {
margin-bottom: 40px
}
.wallet--modal--description .wallet--mop {
display: inline-block
}
.wallet--disclosure {
color: #828282;
font-size: 13px
}
.btn.wallet--button {
line-height: 1.5
}
@media only screen and (max-width:500px) {
.btn.wallet--button {
padding: 5px
}
}
.billingDate--container {
margin: 0 auto;
max-width: 420px
}
.billingDate--infoContainer {
padding-bottom: 20px
}
.billingDate--infoContainer .billingDate--infoTitle {
color: #757575;
font-size: 13px;
font-weight: 700;
margin-bottom: 5px
}
.billingDate--infoContainer .billingDate--infoValue {
color: #333;
font-weight: 700
}
.billingDate--infoContainer .billingDate--infoValue.-disable {
text-decoration: line-through
}
.billingDate--subtitle {
margin-top: 10px;
margin-bottom: 20px
}
.billingDate--subtitle br {
margin-bottom: 13px
}
.billingDateWidget--container {
margin: .75rem 0
}
.billingDateWidget--container .billingDateWidget--labels {
position: relative;
font-size: 13px
}
.billingDateWidget--container .billingDateWidget--labels .billingDateWidget--todayLabel {
position: absolute;
width: 38%;
text-align: left;
left: 0
}
.billingDateWidget--container .billingDateWidget--labels .billingDateWidget--currentBillingLabel {
width: 20%;
text-align: center;
margin: 0 auto;
text-decoration: line-through
}
.billingDateWidget--container .billingDateWidget--labels .billingDateWidget--newBillingLabel {
position: absolute;
white-space: nowrap;
left: 65%;
top: 0
}
.billingDateWidget--container .billingDateWidget--timelineBar {
position: relative;
background: -webkit-gradient(linear, left top, right top, color-stop(65%, #e5e5e5), to(rgba(255, 255, 255, 0)));
background: -webkit-linear-gradient(left, #e5e5e5 65%, rgba(255, 255, 255, 0) 100%);
background: -moz- oldlinear-gradient(left, #e5e5e5 65%, rgba(255, 255, 255, 0) 100%);
background: -o-linear-gradient(left, #e5e5e5 65%, rgba(255, 255, 255, 0) 100%);
background: linear-gradient(to right, #e5e5e5 65%, rgba(255, 255, 255, 0) 100%);
width: 100%;
height: 1.5em;
-webkit-border-radius: .75em 0 0 .75em;
-moz-border-radius: .75em 0 0 .75em;
border-radius: .75em 0 0 .75em;
margin: .5em .1em 1.25em
}
.billingDateWidget--container .billingDateWidget--timelineBar .billingDateWidget--cardIcon {
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;
position: absolute;
top: -.25em
}
.billingDateWidget--container .billingDateWidget--timelineBar .billingDateWidget--cardIcon.-today {
left: 0
}
.billingDateWidget--container .billingDateWidget--timelineBar .billingDateWidget--cardIcon.-newDate {
left: 65%
}
.billingDateWidget--container .billingDateWidget--timelineBar .billingDateWidget--arrows {
width: 20%;
margin: 0 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;
height: 100%
}
.billingDateWidget--container .billingDateWidget--timelineBar .billingDateWidget--arrows svg {
margin: 0 auto
}
.billingDate--scheduleContainer {
font-size: 13px
}
.billingDate--scheduleContainer .billingDate--scheduleRow {
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-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
margin-bottom: 10px
}
.billingDate--scheduleContainer .billingDate--scheduleRow.-bold {
font-weight: 700
}
.billingDate--scheduleContainer .billingDate--scheduleRow.-lessSpace {
margin-bottom: 5px
}
.billingDate--scheduleContainer .billingDate--scheduleColumn {
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;
-webkit-box-flex: 1;
-webkit-flex: 1;
-moz-box-flex: 1;
-ms-flex: 1;
flex: 1
}
.billingDate--scheduleContainer .billingDate--scheduleColumn.-right {
text-align: right
}
.billingDate--scheduleContainer .billingDate--scheduleColumn.-left {
text-align: left;
padding: 1em;
font-size: 15px;
line-height: 2em
}
.billingDate--agreement {
margin: 20px 0;
color: #828282;
font-size: 13px
}
[lang^=zh] .billingDate--newDateSelector {
direction: rtl
}
[lang^=zh] .billingDate--newDateSelector .-left {
text-align: right
}
.yourAccountError--container {
margin: 0 auto;
max-width: 420px
}
.freeTrialMessaging {
width: 100%;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
text-align: center;
margin: 0 auto;
color: #fff
}
.freeTrialMessaging .content {
background-color: #0071eb;
padding: 20px 0;
margin: 20px 32px 0
}
@media screen and (min-width:500px) {
.freeTrialMessaging {
max-width: 440px
}
.freeTrialMessaging .content {
margin: 20px 0 0
}
}
.otpCodeEntryContainer,
.otpPhoneEntryContainer {
text-align: left;
max-width: 440px;
margin: 0 auto
}
.otpCodeEntryContainer .stepLogo,
.otpPhoneEntryContainer .stepLogo {
position: relative;
width: 60px;
height: 60px;
display: block;
margin: 35px 0 16px 0
}
.otpCodeEntryContainer .contextRow,
.otpPhoneEntryContainer .contextRow {
display: inline-block
}
.otpCodeEntryContainer .contextBody,
.otpPhoneEntryContainer .contextBody {
margin: 0 0 15px 0;
font-size: 18px
}
.otpCodeEntryContainer .centerOtpCode,
.otpPhoneEntryContainer .centerOtpCode {
margin: 10px 0 0 60px
}
.otpCodeEntryContainer .code-entry-input,
.otpPhoneEntryContainer .code-entry-input {
max-width: 160px;
padding-bottom: 20px
}
.otpCodeEntryContainer .otpPhoneWrapper .country-name,
.otpPhoneEntryContainer .otpPhoneWrapper .country-name {
padding: 4px 0 0 36px
}
.otpCodeEntryLinks {
text-align: left;
max-width: 440px;
margin: 0 auto;
padding-top: 20px
}
.otpCodeEntryLinks .resend-container {
margin-top: 20px
}
.otpCodeEntryLinks .resend-container>.basic-spinner {
top: 10px;
left: 10px
}
.otpCodeEntryLinks .resend-container .resend-message {
margin-left: 30px
}
.extraGapForCountries .submitBtnContainer {
margin-bottom: 385px
}
.otpPhoneSelect .submitBtnContainer .nf-btn-primary {
margin-bottom: 20px
}
.phoneSelectInput-wrapper {
margin-bottom: 40px
}
.phoneSelectInput-wrapper .radioSelectLabel {
text-align: center;
display: block;
color: #8c8c8c;
font-size: 13px;
margin: 20px 0
}
.phoneSelectInput-wrapper .structural .radioSelectOption .ui-binary-input {
margin: 0 auto;
max-width: 160px
}
.orderInfoItem {
list-style-type: none;
margin: 0;
padding: 0;
border-top: 1px solid #e6e6e6
}
.orderInfoItem:first-child {
border-top: 0
}
.orderInfoItem__content {
-webkit-box-flex: 1;
-webkit-flex: 1 1 auto;
-moz-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
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;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
padding: 7px 14px;
line-height: 16px;
min-height: 72px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden
}
.orderInfoItem__content .userIdentifier {
line-height: initial;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
margin-top: -2px
}
.orderInfoItem__content-container {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.orderInfoItem__text+.orderInfoItem__text {
padding-top: 5px
}
.orderInfoItem__header {
font-size: 13px;
color: #737373;
font-weight: 500
}
@media screen and (max-width:740px) {
.orderInfoItem__header {
font-size: 11px
}
}
.orderInfoItem__title {
font-size: 16px;
font-weight: 700;
color: #333
}
@media screen and (max-width:740px) {
.orderInfoItem__title {
font-size: 14px
}
}
.orderInfoItem__description {
font-size: 16px;
font-weight: 400;
color: #737373
}
@media screen and (max-width:740px) {
.orderInfoItem__description {
font-size: 14px
}
}
.orderInfoItem__button {
font-size: 16px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: 0 0;
border: 0;
margin: 0;
padding: 14px;
-webkit-box-flex: 0;
-webkit-flex: 0 0 auto;
-moz-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
font-weight: 700;
color: #0071eb;
cursor: pointer;
font-family: inherit
}
@media screen and (max-width:740px) {
.orderInfoItem__button {
font-size: 14px
}
}
.orderInfoItem__button:hover {
text-decoration: underline
}
.trialPlanItem__price {
color: #e50914
}
.paymentItem__cvv {
border-top: 0
}
.paymentItem__cvv .orderInfoItem__content {
padding-top: 0;
padding-bottom: 14px;
min-height: 66px
}
.paymentItem__cvv .nfFormSpace {
margin-bottom: 0
}
.orderInfoItem__description .gift-balance-container {
font-weight: 700
}
.orderInfoItem__description div+.gift-balance-container {
display: block;
padding-top: 5px
}
.orderInfo {
background-color: #f4f4f4;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
list-style-type: none;
margin: 0;
padding: 0;
text-align: left
}
@media only screen and (max-width:600px) {
.email-verified-content {
margin-top: 30%
}
}
.email-verified-content {
margin-top: 100px
}
.email-verified-content .submitBtnContainer {
margin-top: 50px
}
.interstitialModal {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
padding: 20px;
background-color: rgba(0, 0, 0, .55);
-webkit-transition-timing-function: cubic-bezier(.25, .1, .25, 1);
-moz-transition-timing-function: cubic-bezier(.25, .1, .25, 1);
-o-transition-timing-function: cubic-bezier(.25, .1, .25, 1);
transition-timing-function: cubic-bezier(.25, .1, .25, 1);
-webkit-transition-duration: .2s;
-moz-transition-duration: .2s;
-o-transition-duration: .2s;
transition-duration: .2s
}
.interstitialModal__dialog {
width: 100%;
max-width: 400px;
margin: auto;
padding: 2px 24px 0;
opacity: 0;
-webkit-transform: translateY(-40);
-moz-transform: translateY(-40);
-ms-transform: translateY(-40);
-o-transform: translateY(-40);
transform: translateY(-40);
padding-bottom: 0;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 4px 12px rgba(0, 0, 0, .4);
box-shadow: 0 4px 12px rgba(0, 0, 0, .4);
-webkit-transition-timing-function: cubic-bezier(.15, .1, .15, .1);
-moz-transition-timing-function: cubic-bezier(.15, .1, .15, .1);
-o-transition-timing-function: cubic-bezier(.15, .1, .15, .1);
transition-timing-function: cubic-bezier(.15, .1, .15, .1);
-webkit-transition-duration: .2s;
-moz-transition-duration: .2s;
-o-transition-duration: .2s;
transition-duration: .2s;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box
}
.interstitialModal__dialog .nfdhead {
margin: 18px 0 10px;
padding: 0
}
.interstitialModal__dialog .nfdtitle {
margin: 0;
text-align: center;
font-weight: 700;
font-size: 20px;
line-height: 24px
}
.interstitialModal__dialog .nfdcontent {
margin: 10px 0 20px;
padding: 0;
font-size: 16px;
line-height: 20px;
text-align: center
}
.interstitialModal__dialog .nfdfoot {
margin: 20px 0 24px;
padding: 0
}
.interstitialModal__dialog .btn-bar {
text-align: center;
padding: 0
}
.interstitialModal__dialog .modal-action-button {
width: 100%;
margin: 0;
min-height: 48px;
font-size: 17px
}
.interstitialModal__dialog .modal-cancel-button {
width: 100%;
margin: 0;
min-height: 48px;
font-size: 17px
}
.uouModal__plans {
margin: 16px 0 20px
}
.uouUpgradeModal {
padding-top: 110px;
background: #fff url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/uouGift@1x.png) no-repeat center 20px;
-webkit-background-size: 174px 90px;
-moz-background-size: 174px 90px;
background-size: 174px 90px
}
@media (-webkit-min-device-pixel-ratio:2),
(-o-min-device-pixel-ratio:2/1),
(min-resolution:192dpi) {
.uouUpgradeModal {
background-image: url(https://assets.nflxext.com/ffe/siteui/acquisition/simplicity/uouGift@2x.png)
}
}
.fullscreen-spinner-overlay--glass {
background-color: rgba(255, 255, 255, .65);
bottom: 0;
left: 0;
position: fixed;
right: 0;
top: 0;
z-index: 100
}
.fullscreen-spinner-overlay--glass.-blur {
-webkit-backdrop-filter: blur(1px);
backdrop-filter: blur(1px)
}
.fullscreen-spinner-overlay--content {
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
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;
margin-top: 30vh;
text-align: center
}
.fullscreen-spinner-overlay--messages {
display: -ms-grid;
display: grid;
grid-template-areas: "message";
-ms-grid-columns: minmax(auto, 380px);
grid-template-columns: minmax(auto, 380px);
margin: 0 40px
}
.fullscreen-spinner-overlay--message {
grid-area: message;
opacity: 0;
-webkit-transition: visibility 0s ease .5s, opacity .5s ease;
-o-transition: visibility 0s ease .5s, opacity .5s ease;
-moz-transition: visibility 0s ease .5s, opacity .5s ease;
transition: visibility 0s ease .5s, opacity .5s ease;
visibility: hidden
}
.fullscreen-spinner-overlay--message.-visible {
opacity: 1;
-webkit-transition: opacity .5s ease .5s;
-o-transition: opacity .5s ease .5s;
-moz-transition: opacity .5s ease .5s;
transition: opacity .5s ease .5s;
visibility: visible
}
.fullscreen-spinner-overlay--spacer {
min-height: 300px
}
.fullscreen-spinner-overlay--body-overflow {
overflow: hidden
}
.upi-waiting--body #appMountPoint .simpleContainer {
padding-bottom: 0
}
.upi-waiting--container {
margin: 0 auto;
max-width: 500px;
position: relative
}
@media screen and (max-width:500px) {
.onboardingContainer .simpleContainer .upi-waiting--container.centerContainer,
div.basicLayout .upi-waiting--container.centerContainer {
padding-bottom: 32px
}
}
.upi-waiting--list {
margin: 0
}
.upi-waiting--list-item {
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
margin: 32px 16px
}
.upi-waiting--list-item-text {
font-size: 15px;
margin-left: 6px
}
.upi-waiting--timer-content {
-webkit-box-align: center;
-webkit-align-items: center;
-moz-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #f8f8f8;
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;
font-size: 15px;
height: 90px;
-webkit-box-pack: center;
-webkit-justify-content: center;
-moz-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-top: 200px
}
@media screen and (max-width:500px) {
.upi-waiting--timer-content {
bottom: 0;
left: 0;
position: absolute;
margin-top: 0;
right: 0
}
}
#upi-waiting-time-text {
font-size: 20px
}
.upi-waiting--continue-container {
display: none;
margin-top: 200px
}
.upi-waiting--continue-container.-visible {
display: block
}
@media screen and (max-width:500px) {
.upi-waiting--continue-container {
display: block;
margin-top: 0;
visibility: hidden
}
.upi-waiting--continue-container.-visible {
visibility: visible
}
}
.upi-waiting--continue-header {
font-size: 20px
}
#register-with-email-button button,
#register-with-phone-number-button button {
background-position: left .8em center;
background-repeat: no-repeat;
border-color: #d2d2d2;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
padding-left: 2.5em;
text-align: left
}
#register-with-phone-number-button button {
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='17' height='19' xmlns='http://www.w3.org/2000/svg'%3e%3cg fill='none' fill-rule='evenodd'%3e%3cpath d='M-7-6h30v30H-7z'/%3e%3cpath d='M2.342.727S.514 1.837.122 4.187C-.27 6.538.35 8.04 1.036 9.411c.686 1.37 2.84 4.896 5.29 6.56 2.447 1.666 3.035 2.189 5.483 2.189 2.45 0 3.233-1.111 4.114-1.796 0 0 1.633-1.078.458-2.383-1.175-1.306-1.894-1.894-2.285-2.025-.392-.13-1.634-.717-2.548.261-.915.98-.718.719-.915.98-.195.261-.98.588-2.154-.066-1.175-.651-2.938-2.872-3.46-3.59-.522-.718-1.175-2.35-.066-3.2 1.111-.848 2.024-1.436 1.502-2.939C5.933 1.902 5.019.793 4.627.466c-.391-.327-.849-.98-2.285.26' fill='%23E50914'/%3e%3c/g%3e%3c/svg%3e")
}
#register-with-email-button button {
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='20' height='15' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cdefs%3e%3cpath id='a' d='M0 .088h18.258v8.985H0z'/%3e%3c/defs%3e%3cg fill='none' fill-rule='evenodd'%3e%3cpath d='M-5-8h30v30H-5z'/%3e%3cpath d='M9.3 8.236a.914.914 0 0 1 .098.085.938.938 0 0 0 .677.29.94.94 0 0 0 .595-.22.75.75 0 0 1 .11-.077l8.346-6.256v-.413C19.126.74 18.388 0 17.483 0H2.645A1.65 1.65 0 0 0 1 1.645v.31l8.3 6.281z' fill='%23E50914'/%3e%3cg transform='translate(.932 5)'%3e%3cmask id='b' fill='%23fff'%3e%3cuse xlink:href='%23a'/%3e%3c/mask%3e%3cpath d='M10.772 5.754l-.065.044a2.564 2.564 0 0 1-1.566.531 2.58 2.58 0 0 1-1.82-.742L.002.088v7.327c0 .913.745 1.658 1.656 1.658h14.945c.91 0 1.656-.745 1.656-1.658V.118l-7.486 5.636z' fill='%23E50914' mask='url(%23b)'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e")
}
.register-with-phone-number-button-container {
margin-bottom: 10px
}
.consolidated-registration-input .nfEmailPhoneControls .country-select {
display: none
}
.consolidated-registration-input .nfEmailPhoneHasSelector .nfTextField {
padding-right: 60px
}
.consolidated-registration-input .nfEmailPhoneHasSelector .country-select {
border: none;
display: block;
position: absolute;
top: 10px;
width: 100%;
z-index: 1
}
.consolidated-registration-input .nfEmailPhoneHasSelector .ui-select-wrapper-link {
position: absolute;
right: 10px;
width: 45px
}
.consolidated-registration-input .nfEmailPhoneHasSelector .ui-select-options {
height: 200px;
left: 0;
position: absolute;
top: 50px;
width: 100%;
min-width: 256px
}
.consolidated-registration-input .nfEmailPhoneHasSelector .native-select {
position: absolute;
right: 10px;
width: 45px;
height: 45px;
top: 0
}
.planFormContainer.planCardSelection {
max-width: 440px
}
.planFormContainer.planCardSelection .submitBtnContainer.submit-button {
margin: 20px 0 0 0;
padding: 0
}
.plan-card-container {
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0 auto;
padding: 0 16px 10px 16px
}
.plan-card-container .see-more {
border: none;
background-color: transparent;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10px;
margin-top: 10px;
width: 100%;
text-align: center;
cursor: pointer;
font-size: 16px
}
.plan-card-container .see-more.link {
background-color: #eee;
color: #4d4d4d;
font-size: 14px;
margin-top: 16px;
padding: 16px 40px 18px
}
@media screen and (max-width:360px) {
.plan-card-container .see-more.link {
padding: 16px 20px 18px
}
}
.plan-card-container .see-more.link .see-all-plans-link {
color: #0071eb
}
.plan-card-container .see-more.link .see-all-plans-link:hover {
text-decoration: underline
}
.plan-card-container .see-more.caret:after {
content: ' ';
display: block;
color: #333;
margin: 5px auto auto;
width: 10px;
height: 10px;
border-left: 3px solid #e50914;
border-bottom: 3px solid #e50914;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg)
}
.plan-card-container .legal-disclaimer {
padding: 0;
margin-top: 30px
}
.plan-card {
display: block;
padding: 14px 14px 18px;
text-align: left;
border-bottom: 1px solid rgba(0, 0, 0, .1);
border-top: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: normal
}
.plan-card .header {
display: inline-block
}
.plan-card .header-text {
display: inline-block;
vertical-align: middle
}
.plan-card .header-text .title {
color: #333;
font-size: 19px;
font-weight: 700;
line-height: 24px
}
.plan-card .header-text .subtitle {
color: #333;
font-size: 16px;
line-height: 20px
}
.plan-card input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none
}
.plan-card input[type=radio] {
border: 1px solid #757575;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
width: 26px;
min-width: 26px;
height: 26px;
min-height: 26px;
padding: 3px;
margin-right: 10px;
margin-top: 9px;
cursor: pointer
}
.plan-card input[type=radio]:checked {
background: #0071eb;
-webkit-background-clip: content-box;
-moz-background-clip: content-box;
background-clip: content-box
}
.plan-card input[type=radio]:active,
.plan-card input[type=radio]:focus {
-webkit-box-shadow: 0 0 5px #0071eb;
-moz-box-shadow: 0 0 5px #0071eb;
box-shadow: 0 0 5px #0071eb;
outline: 0
}
.plan-card .divider {
margin: 12px 0 18px
}
.plan-card .divider.visible {
border-bottom: 1px solid rgba(0, 0, 0, .1)
}
.plan-card .radioContainer {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex
}
.plan-card .plan-icon {
height: 26px;
-webkit-background-size: contain;
-moz-background-size: contain;
background-size: contain;
margin: 0 0 8px
}
.cards-flex-container .plan-card .header-text .title {
font-size: 23px;
font-weight: 700
}
.cards-flex-container .cardBody {
margin-left: 42px
}
.cards-flex-container .cardBody .features {
margin-bottom: 2px
}
.cards-flex-container .cardBody .label {
font-size: 13px
}
.cards-flex-container .cardBody .details .bullets {
margin-bottom: 1px
}
.cards-flex-container .cardBody .details .bullets li {
list-style: none;
margin: 0 0 5px 0;
font-size: 13px
}
.cards-flex-container .cardBody .details .bullets .prop {
position: relative;
left: -21px
}
.cards-flex-container .cardBody .details .bullets .checkmark {
height: 20px;
width: 20px;
position: relative;
left: -30px;
top: 5px
}
.cards-flex-container .cardBody .details button {
background: 0 0;
border: none;
padding: 0;
font-size: 13px;
font-weight: 700
}
.cards-flex-container .cardBody .details button .chevron {
height: 20px;
width: 20px;
position: relative;
top: 6px
}
.cards-flex-container .icons {
margin-bottom: 10px
}
.cards-flex-container .icons .iconLargeText,
.cards-flex-container .icons .iconMediumText,
.cards-flex-container .icons .iconText {
font-weight: 700;
font-size: 19px;
margin-right: 10px;
vertical-align: middle
}
.cards-flex-container .icons .iconMediumText {
font-size: 24px
}
.cards-flex-container .icons .iconLargeText {
font-size: 31px
}
.cards-flex-container .icons .iconBadge {
color: #fff;
font-size: 14px;
line-height: 16px;
padding: 4px 10px 4px 10px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
margin-right: 10px;
vertical-align: middle
}
.cards-flex-container .icons .iconSVG {
vertical-align: middle
}
.cards-flex-container .deviceBasedIcon+.deviceBasedIcon {
margin-left: 8px
}
.cards-flex-container .featureIcon+.featureIcon {
margin-left: 12px
}
.supplimental-flex-container {
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
}
.supplimental-flex-container .submitBtnContainer.submit-button {
-webkit-box-ordinal-group: 4;
-webkit-order: 3;
-moz-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3;
margin-top: 24px
}
.supplimental-flex-container .see-more-text {
-webkit-box-ordinal-group: 4;
-webkit-order: 3;
-moz-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3;
padding: 0;
margin-top: 30px
}
.supplimental-flex-container .vat-disclaimer {
-webkit-box-ordinal-group: 3;
-webkit-order: 2;
-moz-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
margin-top: 24px;
padding: 0
}
.supplimental-flex-container .legal-disclaimer {
-webkit-box-ordinal-group: 2;
-webkit-order: 1;
-moz-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
margin-top: 24px
}
.plan-card.standalone {
padding: 16px 18px 16px 16px;
border: 1px solid rgba(0, 0, 0, .1);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 10px rgba(0, 0, 0, .2);
box-shadow: 0 1px 10px rgba(0, 0, 0, .2);
-webkit-transition: margin .2s, padding .2s;
-o-transition: margin .2s, padding .2s;
-moz-transition: margin .2s, padding .2s;
transition: margin .2s, padding .2s
}
.plan-card.standalone.with-shadow {
margin-left: -10px;
margin-right: -10px;
padding-left: 30px;
padding-right: 30px
}
.plan-card.standalone+.plan-card.standalone {
margin-top: 20px
}
.alt-visuals .plan-card.standalone {
-webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, .2);
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, .2);
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
padding-top: 15px
}
.alt-visuals .plan-card.standalone.with-shadow {
margin-left: 0;
margin-right: 0;
padding: 16px 18px 16px 16px;
-webkit-box-shadow: 0 2px 8px 1px rgba(0, 0, 0, .3);
-moz-box-shadow: 0 2px 8px 1px rgba(0, 0, 0, .3);
box-shadow: 0 2px 8px 1px rgba(0, 0, 0, .3)
}
.alt-visuals .plan-card.standalone .header-text .title {
line-height: 23px;
font-size: 19px
}
.alt-visuals .plan-card.standalone .header-text .subtitle {
line-height: 19px
}
.alt-visuals .plan-card.standalone .cardBody .label {
color: #4d4d4d
}
.alt-visuals .plan-card.standalone .devices.twoRows,
.alt-visuals .plan-card.standalone .features.twoRows {
margin-bottom: 18px
}
.alt-visuals .plan-card.standalone .divider {
margin-top: 15px;
margin-bottom: 18px
}
.alt-visuals .plan-card.standalone+.alt-visuals .plan-card.standalone {
margin-top: 14px
}
.alt-visuals:not(.device-based-tiering2-cell-4) .planGrid__disclaimer {
-webkit-box-ordinal-group: 6;
-webkit-order: 5;
-moz-box-ordinal-group: 6;
-ms-flex-order: 5;
order: 5;
margin-top: 24px
}
.alt-visuals:not(.device-based-tiering2-cell-4) .planGrid__disclaimer.legal-disclaimer {
margin-top: 20px
}
.alt-visuals:not(.device-based-tiering2-cell-4) .planGrid__vatDisclaimer {
-webkit-box-ordinal-group: 5;
-webkit-order: 4;
-moz-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
margin-top: 24px;
padding: 0
}
.alt-visuals .supplimental-flex-container .submitBtnContainer.submit-button {
margin-top: 26px
}
.planFormContainer .clickable {
cursor: pointer
}
.plan-card-container .interstitialModal {
padding: 32px
}
.plan-card-container .interstitialModal .nfdhead {
display: none
}
.plan-card-container .upgrade-modal {
padding: 20px
}
.plan-card-container .upgrade-modal .modal-cancel-button {
color: #4d4d4d;
background-color: #fff;
background-image: none
}
.plan-card-container .upgrade-modal .modal-cancel-button:hover {
color: #181818
}
.plan-card-container .upgrade-modal .nfdfoot {
margin: 0
}
.plan-card-container .upgrade-modal .nfdcontent {
margin-top: 20px;
margin-bottom: 20px
}
.plan-card-container .upgrade-header {
margin-top: 16px;
margin-bottom: 16px;
font-weight: 700;
font-size: 19px;
line-height: 1.5em
}
.plan-card-container .upgrade-message {
font-weight: 400;
font-size: 16px;
line-height: 1.5em
}
.plan-card .highlights {
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
}
.plan-card .highlights .highlight {
width: -webkit-calc(50% - 11px);
width: -moz-calc(50% - 11px);
width: calc(50% - 11px);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #4d4d4d;
font-size: 13px;
font-weight: 400;
line-height: 16px
}
.plan-card .highlight+.highlight {
margin-left: 22px
}
@media screen and (max-width:360px) {
.plan-card .highlights {
-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
}
.plan-card .highlights .highlight {
width: 100%
}
.plan-card .highlight+.highlight {
margin: 18px 0 0
}
}
.plan-card.standalone {
padding: 16px 18px 16px 16px;
border: 1px solid rgba(0, 0, 0, .1);
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px
}
.plan-card.standalone.with-shadow {
-webkit-box-shadow: 0 1px 10px rgba(0, 0, 0, .2);
-moz-box-shadow: 0 1px 10px rgba(0, 0, 0, .2);
box-shadow: 0 1px 10px rgba(0, 0, 0, .2)
}
.plan-card.standalone+.plan-card.standalone {
margin-top: 15px
}
.plan-card.blue .plan-icon-screen-screens-1s {
width: 26px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/screens_1S-blue_v2.svg)
}
.plan-card.blue .plan-icon-screen-people-1s {
width: 16px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/people_1S-blue_v2.svg)
}
.plan-card.blue .plan-icon-quality-bold-sd,
.plan-card.blue .plan-icon-quality-jp-sd {
width: 43px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_SD-blue_v2.svg)
}
.plan-card.blue.standalone {
border: 1px solid #e6e6e6
}
.plan-card.blue .divider.visible {
border-color: #e6e6e6
}
.plan-card.blue .submit-button button {
background-color: #2075c5
}
.plan-card.red .plan-icon-screen-screens-2s {
width: 35px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/screens_2S-red_v2.svg)
}
.plan-card.red .plan-icon-screen-screens-4s {
width: 53px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/screens_4S-red_v2.svg)
}
.plan-card.red .plan-icon-screen-people-1s {
width: 16px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/people_1S-blue_v2.svg)
}
.plan-card.red .plan-icon-screen-people-2s {
width: 36px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/people_2S-red_v2.svg)
}
.plan-card.red .plan-icon-screen-people-4s {
width: 76px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/people_4S-red_v2.svg)
}
.plan-card.red .plan-icon-quality-bold-sd,
.plan-card.red .plan-icon-quality-jp-sd {
width: 43px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_SD-blue_v2.svg)
}
.plan-card.red .plan-icon-quality-bold-uhd,
.plan-card.red .plan-icon-quality-jp-uhd {
width: 102px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_4KHDR-red_v2.svg)
}
.plan-card.red .plan-icon-quality-bold-hd {
width: 43px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_HD-red_v2.svg)
}
.plan-card.red .plan-icon-quality-jp-hd {
width: 92px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_HI-VISION-red-localized.svg)
}
.plan-card.red.standalone {
border: 1px solid #e6e6e6
}
.plan-card.red .divider.visible {
border-color: #e6e6e6
}
.plan-card.red .submit-button button {
background-color: #e50914
}
.plan-card.magenta .plan-icon-screen-screens-2s {
width: 35px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/screens_2S-magenta_v2.svg)
}
.plan-card.magenta .plan-icon-screen-screens-4s {
width: 53px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/screens_4S-magenta_v2.svg)
}
.plan-card.magenta .plan-icon-screen-people-2s {
width: 36px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/people_2S-magenta_v2.svg)
}
.plan-card.magenta .plan-icon-screen-people-4s {
width: 76px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/people_4S-magenta_v2.svg)
}
.plan-card.magenta .plan-icon-quality-bold-uhd,
.plan-card.magenta .plan-icon-quality-jp-uhd {
width: 102px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_4KHDR-magenta_v2.svg)
}
.plan-card.magenta .plan-icon-quality-bold-hd,
.plan-card.magenta .plan-icon-quality-jp-hd {
width: 43px;
background: center center no-repeat url(https://assets.nflxext.com/ffe/siteui/acquisition/planSelection/cards/svg/quality_HD-magenta_v2.svg)
}
.plan-card.magenta.standalone {
border: 1px solid #e6e6e6
}
.plan-card.magenta .divider.visible {
border-color: #e6e6e6
}
.plan-card.magenta .submit-button button {
background-color: #ab1256
}
.upi-mandate-info--container {
text-align: left;
max-width: 440px;
margin: 0 auto
}
.upi-mandate-info--card {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0 3px 8px 1px rgba(0, 0, 0, .25);
-moz-box-shadow: 0 3px 8px 1px rgba(0, 0, 0, .25);
box-shadow: 0 3px 8px 1px rgba(0, 0, 0, .25);
margin: 32px 1px 64px;
padding: 15px
}
.upi-mandate-info--card-header {
font-size: 19px;
font-weight: 700
}
.upi-mandate-info--card-subheader {
font-size: 16px;
border-bottom: 1px solid #dcdcdc;
padding-bottom: 15px
}
.upi-mandate-info--card-list {
margin: 0
}
.upi-mandate-info--card-list-item {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
margin: 9px 0 2px
}
.upi-mandate-info--card-list-item-text {
font-size: 15px;
margin-left: 6px
}
Zerion Mini Shell 1.0