/* Minification failed. Returning unminified contents. (194,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (229,17): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (237,28): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (238,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (239,17): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (386,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (391,22): run-time error CSS1039: Token not allowed after unary operator: '-primary' (392,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (782,28): run-time error CSS1039: Token not allowed after unary operator: '-mobimoney-loud' (783,28): run-time error CSS1039: Token not allowed after unary operator: '-mobimoney-quiet' (819,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (833,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (877,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1126,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (1143,22): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (1312,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-state-4' (1313,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (1320,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-state-4' (1324,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1346,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1353,17): run-time error CSS1039: Token not allowed after unary operator: '-hint' (1360,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1374,28): run-time error CSS1039: Token not allowed after unary operator: '-neutral-0' (1390,25): run-time error CSS1039: Token not allowed after unary operator: '-brand-outline-light-2' (1432,28): run-time error CSS1039: Token not allowed after unary operator: '-informative-loud' (1444,28): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (1475,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (1476,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (1498,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (1506,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (1512,17): run-time error CSS1039: Token not allowed after unary operator: '-insurance-copy' (1518,17): run-time error CSS1039: Token not allowed after unary operator: '-insurance-copy' (1522,17): run-time error CSS1039: Token not allowed after unary operator: '-insurance-copy' (1529,17): run-time error CSS1039: Token not allowed after unary operator: '-insurance-copy' (1534,17): run-time error CSS1039: Token not allowed after unary operator: '-insurance-copy' (1542,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (1543,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (1544,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1550,28): run-time error CSS1039: Token not allowed after unary operator: '-neutral-0' (1551,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-primary' (1552,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1800,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1813,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (1814,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1819,24): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1832,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1837,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1843,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1956,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (1970,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (1980,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2002,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2003,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2004,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (2009,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2014,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2019,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2037,29): run-time error CSS1039: Token not allowed after unary operator: '-error' (2042,29): run-time error CSS1039: Token not allowed after unary operator: '-warning' (2046,29): run-time error CSS1039: Token not allowed after unary operator: '-success' (2099,40): run-time error CSS1039: Token not allowed after unary operator: '-error' (2100,29): run-time error CSS1039: Token not allowed after unary operator: '-error' (2101,34): run-time error CSS1039: Token not allowed after unary operator: '-error-quiet' (2105,29): run-time error CSS1039: Token not allowed after unary operator: '-error' (2109,40): run-time error CSS1039: Token not allowed after unary operator: '-warning' (2110,29): run-time error CSS1039: Token not allowed after unary operator: '-warning' (2111,34): run-time error CSS1039: Token not allowed after unary operator: '-warning-quiet' (2115,29): run-time error CSS1039: Token not allowed after unary operator: '-warning' (2119,40): run-time error CSS1039: Token not allowed after unary operator: '-success' (2120,29): run-time error CSS1039: Token not allowed after unary operator: '-success' (2121,34): run-time error CSS1039: Token not allowed after unary operator: '-success-quiet' (2125,29): run-time error CSS1039: Token not allowed after unary operator: '-success' (2142,32): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (2156,21): run-time error CSS1039: Token not allowed after unary operator: '-black' (2164,26): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (2165,32): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2189,32): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2195,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2196,60): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2221,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2231,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2239,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2257,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2258,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2259,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (2262,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2265,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2268,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2279,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (2292,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2300,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2321,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2322,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2326,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2330,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2375,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (2376,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-2' (2389,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-2' (2393,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-1' (2394,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-1' (2395,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2398,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-2' (2399,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-2' (2400,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2403,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-3' (2404,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-3' (2405,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2408,28): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (2409,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (2410,17): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (2432,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2440,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2486,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2496,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2517,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (2518,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2519,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2523,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2527,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2536,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2543,16): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2560,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (2561,28): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2562,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2577,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2596,16): run-time error CSS1039: Token not allowed after unary operator: '-black' (2600,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (2629,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2639,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-state-4' (2641,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2655,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-state-4' (2656,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2678,28): run-time error CSS1039: Token not allowed after unary operator: '-neutral-0' (2694,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-state-4' (2696,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2710,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-state-4' (2711,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2733,28): run-time error CSS1039: Token not allowed after unary operator: '-neutral-0' (2742,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (2748,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2760,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (2765,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2774,32): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (2788,32): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (2805,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance-quiet' (2811,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (2816,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2824,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (2833,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance-quiet' (2836,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (2882,32): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (2887,32): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (2892,32): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-3' (2904,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (2905,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2912,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2915,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (2916,17): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (2949,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (2950,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-primary' (2951,17): run-time error CSS1039: Token not allowed after unary operator: '-surface-primary' (2958,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (2964,28): run-time error CSS1039: Token not allowed after unary operator: '-neutral-0' (2965,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-primary' (2966,17): run-time error CSS1039: Token not allowed after unary operator: '-surface-primary' (2968,18): run-time error CSS1030: Expected identifier, found '.' (2968,36): run-time error CSS1031: Expected selector, found ')' (2968,36): run-time error CSS1025: Expected comma or open brace, found ')' (2985,22): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2986,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (2989,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-3' (2990,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (2993,22): run-time error CSS1039: Token not allowed after unary operator: '-error-quiet' (2994,17): run-time error CSS1039: Token not allowed after unary operator: '-error' (2997,22): run-time error CSS1039: Token not allowed after unary operator: '-success-quiet' (2998,17): run-time error CSS1039: Token not allowed after unary operator: '-success' (3001,22): run-time error CSS1039: Token not allowed after unary operator: '-warning-quiet' (3002,17): run-time error CSS1039: Token not allowed after unary operator: '-warning' (3030,35): run-time error CSS1039: Token not allowed after unary operator: '-primary' (3045,16): run-time error CSS1039: Token not allowed after unary operator: '-primary' (3064,17): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (3070,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (3071,28): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (3078,31): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (3080,28): run-time error CSS1039: Token not allowed after unary operator: '-white' (3089,17): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (3107,22): run-time error CSS1039: Token not allowed after unary operator: '-disabled' (3113,22): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (3118,17): run-time error CSS1039: Token not allowed after unary operator: '-error-loud' (3128,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (3129,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (3156,28): run-time error CSS1039: Token not allowed after unary operator: '-error-quiet' (3157,28): run-time error CSS1039: Token not allowed after unary operator: '-error-loud' (3162,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-primary' (3164,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (3179,28): run-time error CSS1039: Token not allowed after unary operator: '-error-quiet' (3180,28): run-time error CSS1039: Token not allowed after unary operator: '-error-loud' (3181,17): run-time error CSS1039: Token not allowed after unary operator: '-error-loud' (3212,28): run-time error CSS1039: Token not allowed after unary operator: '-success-loud' (3222,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (3231,17): run-time error CSS1039: Token not allowed after unary operator: '-accent-2' (3239,17): run-time error CSS1039: Token not allowed after unary operator: '-error-loud' (3258,22): run-time error CSS1039: Token not allowed after unary operator: '-white' (3259,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (3264,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-outline-light' (3265,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-2' (3413,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-3' (3414,28): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-3' (3427,17): run-time error CSS1039: Token not allowed after unary operator: '-hint' (3437,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (3439,28): run-time error CSS1039: Token not allowed after unary operator: '-insurance' (3447,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (3511,22): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3520,22): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-60' (3521,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (3525,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-3' (3526,28): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3539,38): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-60' (3539,59): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3548,38): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3548,59): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green' (3607,22): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3616,22): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-60' (3617,17): run-time error CSS1039: Token not allowed after unary operator: '-white' (3621,22): run-time error CSS1039: Token not allowed after unary operator: '-surface-light-3' (3622,28): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3635,38): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-60' (3635,59): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3644,38): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green-80' (3644,59): run-time error CSS1039: Token not allowed after unary operator: '-pjn-green' (3773,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-2' (3899,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3900,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3901,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3902,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3903,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3904,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3905,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3906,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3907,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3908,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3909,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3910,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3911,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3913,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3914,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3915,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3916,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3917,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3918,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3920,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3921,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3922,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3924,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3925,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3926,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3927,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3928,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3929,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3930,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3931,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3932,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3933,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3934,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3935,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3937,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3938,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3939,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3940,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3941,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3942,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3944,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3945,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3946,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3947,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3948,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3949,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3950,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3951,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3952,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3953,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3954,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3955,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (3956,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-' (4010,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (4052,17): run-time error CSS1039: Token not allowed after unary operator: '-primary' (4058,14): run-time error CSS1039: Token not allowed after unary operator: '-primary-dark-state-2' (4090,17): run-time error CSS1039: Token not allowed after unary operator: '-black' (4519,25): run-time error CSS1039: Token not allowed after unary operator: '-primary' (4578,25): run-time error CSS1039: Token not allowed after unary operator: '-primary' (4639,19): run-time error CSS1039: Token not allowed after unary operator: '-primary' (4832,20): run-time error CSS1039: Token not allowed after unary operator: '-primary' (4961,26): run-time error CSS1039: Token not allowed after unary operator: '-primary' */ @charset "UTF-8"; /*FinChoice Base Style Changes*/ .lds-dual-ring { display: inline-block; width: 80px; height: 80px; } .lds-dual-ring:after { content: " "; display: block; width: 64px; height: 64px; margin: 8px; border-radius: 50%; /* border: 6px solid var(--primary); border-color: var(--primary) var(--primary) var(--primary) transparent;*/ background-image: url("data:image/svg+xml,%3Csvg width='62' height='63' viewBox='0 0 62 63' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M59 31.0649C59 15.601 46.464 3.06494 31 3.06494C15.536 3.06494 3 15.601 3 31.0649C3 46.5289 15.536 59.0649 31 59.0649' stroke='%230D49ED' stroke-width='6' stroke-linecap='round'/%3E%3C/svg%3E"); background-size: cover; background-repeat: no-repeat; -webkit-animation: lds-dual-ring 1.2s linear infinite; animation: lds-dual-ring 1.2s linear infinite; } .lds-dual-ring img { opacity: 0; } @-webkit-keyframes lds-dual-ring { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes lds-dual-ring { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* Swiper Styling */ .swiper-pagination { bottom: -30px !important; } .swiper-container { overflow: visible !important; margin-bottom: 35px !important; } .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after { content: none !important; } .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { content: none !important; } .swiper-button-prev { color: white !important; font-size: 24pt !important; opacity: 0.9 !important; } .swiper-button-next { color: white !important; font-size: 24pt !important; opacity: 0.9 !important; } .swiper-pagination-bullet { width: 10px !important; height: 10px !important; text-align: center; line-height: 10px !important; color: #000; opacity: 1 !important; background: #D1D1D1 !important; } .swiper-pagination-bullet-active { color: #fff; background: #999999 !important; width: 14px !important; height: 14px !important; text-align: center; line-height: 14px !important; margin-bottom: -2px !important; outline: none !important; } /* Mobile Layout */ .mobile-container { max-width: 480px; margin-left: auto; margin-right: auto; background-color: #fefefe; padding-top: 300px; } /* End Mobile Layout*/ ul.ticks { list-style-image: none; list-style-position: inside; margin-top: 10px; margin-left: 20px !important; padding-left: 20px !important; } ul.ticks.li { padding: 10px; } i.lightblue { color: #00B4F7 !important; font-size: 20px; } i.lightgreen { color: #a5d350 !important; font-size: 20px; } i.lightpurple { color: #B01BB1 !important; font-size: 20px; } /* End Site Override Classes */ .button.green { background-color: #00A887; color: #fefefe; border-radius: 8px; } .button.blue.hollow { background-color: #fefefe; color: #0a1f8f; border-radius: 8px; border-color: #0a1f8f; } .button.success { color: #fefefe !important; } .button:focus { background-color: none !important; } .underline { text-decoration: underline; } .text-loans { color: #00B4F7; } .text-mobimoney { color: #a5d350; } .text-insurance { color: #B01BB1; } .fi-icon { font-size: 1.1rem; margin-top: 0.25rem; } .background-primary { background-color: #D70053; } .background-secondary { background-color: var(--primary); } .background-success { background-color: #009848; } .background-warning { background-color: #ffae00; } .background-alert { background-color: #CD001F; } .floated-label-wrapper { position: relative; } .floated-label-wrapper label { background: #fefefe; color: #D70053; font-size: 0.75rem; font-weight: 600; left: 0.75rem; opacity: 0; padding: 0 0.25rem; position: absolute; top: 2rem; -webkit-transition: all 0.15s ease-in; transition: all 0.15s ease-in; z-index: -1; } label.disabled { color: var(--disabled); } input[disabled], input[readonly], textarea:disabled, textarea[readonly], select:disabled { border: 1px solid var(--disabled) !important; background: var(--white) !important; color: var(--disabled) !important; } input[type="date"] { height: 47px !important; padding: 13px 16px !important; } .floated-label-wrapper label input[type=text], .floated-label-wrapper label input[type=email], .floated-label-wrapper label input[type=password] { border-radius: 4px; font-size: 1.75em; padding: 0.5em; } .floated-label-wrapper label.show { opacity: 1; top: -0.85rem; z-index: 1; -webkit-transition: all 0.15s ease-in; transition: all 0.15s ease-in; } /*Checkboxsss*/ .checkbox.inline:last-child, .radio.inline:last-child { margin-right: 0; } .checkbox label, .radio label { display: block; position: relative; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; font-size: 0.875rem; line-height: 1; } .checkbox input[type=checkbox], .radio input[type=radio] { /*position: absolute;*/ top: 0; left: 0; visibility: hidden; } .checkbox .custom-checkbox, .radio .custom-radio { display: inline-block; vertical-align: top; margin: 0 6px 0 0; width: 18px; height: 18px; border: 1px solid #1583cc; position: relative; } .checkbox .custom-checkbox { background: #1583cc; -webkit-box-shadow: inset 0 0 0 12px #fff; box-shadow: inset 0 0 0 12px #fff; top: -2px; } .checkbox .icon-check { width: 20px; height: 20px; background-size: cover; position: absolute; top: 0px; left: 0px; -webkit-transform: scale(0); transform: scale(0); -webkit-transition: all 180ms ease; transition: all 180ms ease; } .icon-check:before { position: absolute; content: "✓"; width: 12px; font-size: 12.66667px; text-align: center; line-height: 16px; color: #fff; font-weight: bold; } .checkbox input[type=checkbox]:checked+.custom-checkbox { border-color: #2095F0; -webkit-box-shadow: none; box-shadow: none; } .checkbox input[type=checkbox]:checked+.custom-checkbox .icon-check { -webkit-transform: scale(1); transform: scale(1); } /*Radios*/ .radio .custom-radio { background: #fff; border-radius: 18px; -webkit-transition: all 180ms ease; transition: all 180ms ease; top: -2px; } .radio input[type=radio]:checked+.custom-radio { border-color: #1583cc; background: #1583cc; } .icon-radio-check { position: absolute; width: 18px; height: 18px; } .icon-radio-check:before { position: absolute; content: "●"; height: 15px; width: 15px; font-size: 16.66667px; text-align: center; line-height: 16px; color: #fff; } .checkbox .primary, .radio .primary { border: 1px solid #D70053; } .checkbox input[type=checkbox]:checked+.primary, .radio input[type=radio]:checked+.primary { background: #D70053; border: 1px solid #D70053; } .checkbox .secondary, .radio .secondary { border: 1px solid var(--primary); } .checkbox input[type=checkbox]:checked+.secondary, .radio input[type=radio]:checked+.secondary { background: var(--primary); border: 1px solid var(--primary); } .checkbox .success, .radio .success { border: 1px solid #009848; } .checkbox input[type=checkbox]:checked+.success, .radio input[type=radio]:checked+.success { background: #009848; border: 1px solid #009848; } .checkbox .alert, .radio .alert { border: 1px solid #CD001F; } .checkbox input[type=checkbox]:checked+.alert, .radio input[type=radio]:checked+.alert { background: #CD001F; border: 1px solid #CD001F; } .checkbox .warning, .radio .warning { border: 1px solid #ffae00; } .checkbox input[type=checkbox]:checked+.warning, .radio input[type=radio]:checked+.warning { background: #ffae00; border: 1px solid #ffae00; } .checkbox .disabled, .radio .disabled { border: 1px solid #2199e8; opacity: 0.35; cursor: not-allowed; pointer-events: none; } li:focus { outline: none !important; } a:focus { outline: none !important; } /* Preloader */ #preloader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #131c26; /* change if the mask should have another color then white */ z-index: 9999; /* makes sure it stays on top */ } /* Pace Status bar */ #status { width: 200px; height: 200px; position: absolute; left: 50%; /* centers the loading animation horizontally one the screen */ top: 50%; /* centers the loading animation vertically one the screen */ background-image: url("../images/icons/ball-triangle.svg"); /* path to your loading animation */ background-repeat: no-repeat; background-position: center; margin: -100px 0 0 -100px; /* is width and height divided by two */ } .top-bar { background-color: #131c26; color: #fefefe; height: 72px; } .top-bar ul { background-color: #131c26; } .top-bar .top-bar-left, .top-bar .top-bar-right { -webkit-box-flex: unset; -ms-flex: unset; flex: unset; max-width: unset; } /* Side Navigation Styles */ .nav-sidebar { width: 260px; background-color: #1f2d3d; overflow: visible !important; -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); } .nav-sidebar .close-button { background: #131c26; color: white; cursor: pointer; display: block; height: 35px; line-height: 35px; position: absolute; right: -40px; text-align: center; top: 9px; width: 40px; font-size: 18px; z-index: 999; font-style: normal; text-decoration: none; font-weight: normal; border-radius: 0 20px 20px 0; -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); } .nav-sidebar ul { margin: 0; font-size: 14px; line-height: 0.5em !important; list-style: none !important; padding: 0; } .nav-sidebar ul li { border-bottom: 1px solid rgba(255, 255, 255, 0.04); } .nav-sidebar ul li i { font-size: 15px; left: 0px; margin-left: 23px; position: relative; width: 30px; top: 0px !important; display: inline-block; height: 30px; text-align: center; padding: 8px 0 0; border-radius: 100%; } .nav-sidebar ul li span { left: 1px; font-weight: normal !important; position: relative; font-weight: normal; text-transform: capitalize; } .nav-sidebar ul li:hover { background: #131c26; color: white !important; text-shadow: none; position: relative; } .nav-sidebar ul li a { color: #fefefe; } .side-menu-noft { line-height: 14px; padding: 2px 8px; border-radius: 11px; margin: 0; position: absolute; left: 100px; top: -5px; font-size: 9px; border: 2px solid rgba(255, 255, 255, 0.1); background-color: #D70053; } /* Profile Class */ .profile { text-transform: uppercase; background: #131c26; width: 100%; position: relative; top: 0px; left: 0; height: 72px; font-size: 13px; margin: 0; padding: 0; z-index: 99; } .profile img { width: 55px; height: 55px; float: left; opacity: 0.9; position: relative; top: 10px; margin-left: 13px; border-radius: 50%; padding: 7px; } .profile h3 { text-shadow: none; margin-bottom: 10px; color: white; opacity: 1; position: relative; top: 25px; letter-spacing: 0; font-weight: normal; font-size: 18px; left: 15px; } .profile h3 small { margin-left: 6px; color: #fff; letter-spacing: 0; background: rgba(255, 255, 255, 0.1); padding: 4px 9px; border-radius: 15px; position: relative; top: -3px; font-size: 9px; } .palette-Deep-Purple-700 { background-color: #131c26 !important; -webkit-box-shadow: inset 2px 3px 4px 0px rgba(0, 0, 0, 0.75); box-shadow: inset 2px 3px 4px 0px rgba(0, 0, 0, 0.75); } @media print, screen and (min-width: 40em) { .position-left.reveal-for-medium~.off-canvas-content { margin-left: 260px; } .off-canvas-content.has-reveal-left { margin-left: 260px; } } @media print, screen and (min-width: 64em) { .off-canvas-content.has-reveal-left { margin-left: 260px; } } /* Small only */ @media screen and (max-width: 39.9375em) { .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; width: 260px; -webkit-transform: translateX(-260px); transform: translateX(-260px); } } /* Medium and up */ @media screen and (min-width: 40em) { .position-left { top: 0; left: 0; height: 100%; overflow-y: auto; width: 260px; -webkit-transform: translateX(-260px); transform: translateX(-260px); } } /* Medium only */ /* Large and up */ /* Large only */ /* End of Side Navigation */ .close-button:hover, .close-button:focus { color: #D70053 !important; outline: none !important; } /* Content Page */ .ContentPage { padding: 20px; } .no-padding { padding: 0px !important; } .no-margin { margin: 0px !important; } /* Developer Styles */ #offCanvasDev { background-color: #fefefe; width: 600px; padding: 10px; } #offCanvasDev ul { margin: 0; font-size: 14px; line-height: 16px !important; list-style: none !important; padding: 0px; } #offCanvasDev .jsonview ul { margin-left: 10px !important; } #offCanvasDev .jsonview ul li:hover { background-color: unset; color: black !important; } /* End of Developer Styles */ /* #region Notifications */ .notification-information { background-color: #beeaff; color: #0072a9; } .notification-information::before { content: "\f05a"; } .notification-success { background-color: #c0efd6; color: #006f00; } .notification-success::before { content: "\f058"; } .notification-warning { background-color: #ffec90; color: #887000; } .notification-warning::before { content: "\f071"; } .notification-danger { background-color: #ffdcdc; color: #dc0000; } .notification-danger::before { content: "\f057"; } .notification-debug { background-color: #e1baff; color: #7000d6; } .notification-debug::before { content: "\f188"; } .notification.success-quiet.debicheck { border: 1px solid var(--mobimoney-loud); background-color: var(--mobimoney-quiet); } .notification.success-quiet.debicheck .debi-check-logo { height: 24px; width: 112px; margin-top: 0; margin-bottom: 0; } .notification.success-quiet.debicheck .body2 { font-weight: 400; } /* #endregion */ /* #region Forms */ /* #region Validation Summary */ .validation-summary-valid { display: none; } .validation-summary-errors { background-color: #f7d9ea; padding: 0.5rem; display: -webkit-box; display: -ms-flexbox; display: flex; } .validation-summary-errors::before { display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; background-color: #f7d9ea; color: var(--primary); font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f057"; /*margin-right: 0.5rem;*/ margin-right: 24px; } .validation-summary-errors ul { margin: 0; list-style: disc; } .validation-summary-errors ul li { color: var(--primary); } /* #endregion */ .help-text { color: #8a8a8a; font-style: normal; margin-top: -0.8rem; } .button { border-radius: 8px; font-weight: 500; padding: 1rem; font-size: 1.2rem; } .page-heading { margin: 1rem 0; margin-top: 0; } .page-heading-card { background-color: #dad9f7; /* todo: use variables */ padding: 0.5rem; margin-bottom: 1rem; } .page-heading-block { padding: 0.5rem; margin-bottom: 1rem; padding-top: 2rem; } .page-heading-block { padding: 0.5rem; margin-bottom: 1rem; padding-top: 2rem; } .heading-card-content { padding-left: 0.5rem; color: var(--primary); /* todo: use variables */ font-weight: 500; } .spacer-1 { display: block; height: 1rem; width: 100%; } .spacer-2 { display: block; height: 1.5rem; width: 100%; } .spacer-3 { display: block; height: 2rem; width: 100%; } .spacer-4 { display: block; height: 2.5rem; width: 100%; } .spacer-5 { display: block; height: 3rem; width: 100%; } /* #endregion */ /* #region OTP */ /* Chrome, Safari, Edge, Opera */ input.otp-field::-webkit-outer-spin-button, input.otp-field::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input.otp-field[type=number] { -moz-appearance: textfield; } /* #endregion */ /* #region Loading Spinner */ .no-scroll { overflow: hidden; } .loading-container { left: 0; top: 0; background-color: white; position: fixed; width: 100%; height: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; z-index: 9999; visibility: hidden; opacity: 0; -webkit-transition: visibility 0s, opacity 0.5s linear; transition: visibility 0s, opacity 0.5s linear; } .loading-container.show { opacity: 0.8; visibility: visible; } .loading-container .loading-text { position: absolute; margin-top: 100px; font-weight: bold; text-shadow: 0px 0px 10px white; font-size: 20px; } .sk-chase { width: 40px; height: 40px; position: absolute; -webkit-animation: sk-chase 2.5s infinite linear both; animation: sk-chase 2.5s infinite linear both; } .sk-chase-dot { width: 100%; height: 100%; position: absolute; left: 0; top: 0; -webkit-animation: sk-chase-dot 2s infinite ease-in-out both; animation: sk-chase-dot 2s infinite ease-in-out both; } .sk-chase-dot:before { content: ""; display: block; width: 25%; height: 25%; background-color: #f09 !important; border-radius: 100%; -webkit-animation: sk-chase-dot-before 2s infinite ease-in-out both; animation: sk-chase-dot-before 2s infinite ease-in-out both; } .sk-chase-dot:nth-child(1) { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .sk-chase-dot:nth-child(2) { -webkit-animation-delay: -1s; animation-delay: -1s; } .sk-chase-dot:nth-child(3) { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .sk-chase-dot:nth-child(4) { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } .sk-chase-dot:nth-child(5) { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; } .sk-chase-dot:nth-child(6) { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } .sk-chase-dot:nth-child(1):before { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .sk-chase-dot:nth-child(2):before { -webkit-animation-delay: -1s; animation-delay: -1s; } .sk-chase-dot:nth-child(3):before { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .sk-chase-dot:nth-child(4):before { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } .sk-chase-dot:nth-child(5):before { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; } .sk-chase-dot:nth-child(6):before { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } @-webkit-keyframes sk-chase { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes sk-chase { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes sk-chase-dot { 80%, 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes sk-chase-dot { 80%, 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes sk-chase-dot-before { 50% { -webkit-transform: scale(0.4); transform: scale(0.4); } 100%, 0% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes sk-chase-dot-before { 50% { -webkit-transform: scale(0.4); transform: scale(0.4); } 100%, 0% { -webkit-transform: scale(1); transform: scale(1); } } /* #endregion */ .log-out-button { margin-bottom: 0; padding: 0.5rem; margin-right: 12px; color: white !important; border-color: white !important; display: inline; } .insurance-label { color: var(--white); box-shadow: 0px 4px 12px 0px rgba(22, 36, 109, 0.1); padding: 6px 10px; text-transform: capitalize; border-radius: 6px; display: inline-block; vertical-align: middle; margin: 0 0 1rem 0; border: 1px solid transparent; transition: background-color 0.25s ease-out, color 0.25s ease-out; font-family: inherit; font-weight: 600; font-size: 13px; -webkit-appearance: none; line-height: 1; text-align: center; cursor: pointer; background: var(--insurance) !important; } /* Disabled Buttons */ .button.disabled, .button[disabled] { opacity: 1 !important; cursor: not-allowed; background-color: #D4D4D4; } .button.disabled, .button[disabled], .button[disabled]:hover { background-color: #D2D2D2 !important; } .main-grid { padding: 0; } .main-grid .content-grid { padding: 0 16px; } .main-grid .content-grid .cell:first-of-type { overflow: visible; } .card { border-radius: 14px; border: 1px solid transparent; padding: 16px 18px; } /* #region Remove spinner buttons on number input fields */ /* Chrome, Safari, Edge, Opera */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } /* Firefox */ input[type=number] { -moz-appearance: textfield; } /* #endregion */ /* #region Password Meter */ .password-strength-meter { margin-top: -5px; } .password-strength-meter .password-strength-label { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .password-strength-meter .password-strength-label .strength-text { font-weight: bold; } .password-strength-meter .progress { height: 0.5rem; } .password-help-block-button { font-size: 20px; bottom: -2px; display: inline-block; color: #69b7dc; position: relative; cursor: pointer; } .password-help-block { background-color: #e6eff9; padding: 1rem 1rem; margin-bottom: 1rem; } .password-help-block ul { margin-bottom: 0; margin-left: 1.5rem; } .password-help-block ul .validation-success { color: #00a500 !important; } .password-help-block.invalid ul li { color: red; } .password-help-block.invalid ul li:last-child { color: black; } input[type=password]::-ms-reveal, input[type=password]::-ms-clear { display: none !important; } .password-text-toggler { cursor: pointer; } .password-text-toggler i { font-size: 22px; } .password-strength-meter .danger { color: red; } .password-strength-meter .warning { color: #ffae00; } .password-strength-meter .success { color: #009848; } /* #endregion */ /* #region Modal Popups */ .reveal { border-radius: 10px; -webkit-box-shadow: 0px 0px 6px 4px #5f5f5f; box-shadow: 0px 0px 6px 4px #5f5f5f; } .reveal .close-button span { font-size: 36px; font-weight: 500; } /* #endregion */ .no-break { white-space: nowrap; } svg { width: auto; height: auto; max-width: 100%; max-height: 100%; } .grid-padding-x>.cell { padding-right: unset; padding-left: unset; } .grid-container>.grid-container { padding-right: unset; padding-left: unset; } .full-width { width: 100%; } .accordion { border: 1px solid var(--primary-light-state-4); background: var(--white); border-radius: 8px; } .accordion .accordion-item .accordion-title { border: unset; border-bottom: 1px solid var(--primary-light-state-4); background: unset; font-size: 13px; font-weight: 600; color: var(--black); padding-right: 40px; line-height: 18.2px; text-decoration: none; } .accordion .accordion-item .accordion-title:before { top: calc(50% - 12px); margin-top: 0; } .accordion .accordion-item .accordion-title:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23FBFCFF'/%3E%3Cpath d='M11.0438 12.5605H7.75833C7.54556 12.5605 7.36594 12.4873 7.2195 12.341C7.07317 12.1946 7 12.0149 7 11.8022C7 11.5894 7.07317 11.4098 7.2195 11.2633C7.36594 11.117 7.54556 11.0438 7.75833 11.0438H11.0438V7.75833C11.0438 7.54556 11.117 7.36594 11.2633 7.2195C11.4098 7.07317 11.5894 7 11.8022 7C12.0149 7 12.1946 7.07317 12.341 7.2195C12.4873 7.36594 12.5605 7.54556 12.5605 7.75833V11.0438H15.846C16.0588 11.0438 16.2384 11.117 16.3848 11.2633C16.5312 11.4098 16.6043 11.5894 16.6043 11.8022C16.6043 12.0149 16.5312 12.1946 16.3848 12.341C16.2384 12.4873 16.0588 12.5605 15.846 12.5605H12.5605V15.846C12.5605 16.0588 12.4873 16.2384 12.341 16.3848C12.1946 16.5312 12.0149 16.6043 11.8022 16.6043C11.5894 16.6043 11.4098 16.5312 11.2633 16.3848C11.117 16.2384 11.0438 16.0588 11.0438 15.846V12.5605Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); } .accordion .accordion-item.is-active .accordion-title:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23FBFCFF'/%3E%3Cpath d='M7.50004 12.6667C7.31115 12.6667 7.15282 12.6028 7.02504 12.475C6.89726 12.3473 6.83337 12.1889 6.83337 12C6.83337 11.8112 6.89726 11.6528 7.02504 11.525C7.15282 11.3973 7.31115 11.3334 7.50004 11.3334H15.5C15.6889 11.3334 15.8473 11.3973 15.975 11.525C16.1028 11.6528 16.1667 11.8112 16.1667 12C16.1667 12.1889 16.1028 12.3473 15.975 12.475C15.8473 12.6028 15.6889 12.6667 15.5 12.6667H7.50004Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); } .accordion .accordion-item .accordion-content p { font-size: 13px; font-weight: 400; color: var(--black); } .accordion .accordion-item .accordion-content p.caption { font-size: 13px; font-style: italic; font-weight: 400; color: var(--hint); margin-top: 8px; } .accordion .accordion-item .accordion-content ul li { font-size: 13px; font-weight: 400; color: var(--black); } .accordion .accordion-item:last-child .accordion-title { border-bottom: unset; } .accordion .accordion-item:last-child .accordion-content { border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; } .accordion .accordion-item.is-active .accordion-content { background-color: var(--neutral-0); border: unset; } .accordion.dashed { border: unset; width: 100%; } .accordion.dashed .accordion-item .accordion-title { padding-right: 0; padding-left: 0; } .accordion.dashed .accordion-item .accordion-title:after { content: ""; border: dashed var(--brand-outline-light-2); border-width: 2px 0 0; height: 1px; width: calc(100% - 3em); display: block; } .accordion.dashed .accordion-item .accordion-title:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23F5F7FF'/%3E%3Cpath d='M11.8334 13.3834L14.4334 10.7834C14.5556 10.6612 14.7112 10.6001 14.9 10.6001C15.0889 10.6001 15.2445 10.6612 15.3667 10.7834C15.4889 10.9056 15.55 11.0612 15.55 11.2501C15.55 11.439 15.4889 11.5945 15.3667 11.7167L12.3 14.7834C12.1667 14.9167 12.0112 14.9834 11.8334 14.9834C11.6556 14.9834 11.5 14.9167 11.3667 14.7834L8.30005 11.7167C8.17783 11.5945 8.11672 11.439 8.11672 11.2501C8.11672 11.0612 8.17783 10.9056 8.30005 10.7834C8.42227 10.6612 8.57783 10.6001 8.76672 10.6001C8.9556 10.6001 9.11116 10.6612 9.23338 10.7834L11.8334 13.3834Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); right: 0; } .accordion.dashed .accordion-item.is-active .accordion-title:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23F5F7FF'/%3E%3Cpath d='M12.1666 11.2001L9.56662 13.8001C9.4444 13.9223 9.28884 13.9834 9.09995 13.9834C8.91106 13.9834 8.75551 13.9223 8.63328 13.8001C8.51106 13.6779 8.44995 13.5223 8.44995 13.3334C8.44995 13.1445 8.51106 12.989 8.63328 12.8668L11.7 9.8001C11.8333 9.66676 11.9888 9.6001 12.1666 9.6001C12.3444 9.6001 12.5 9.66676 12.6333 9.8001L15.7 12.8668C15.8222 12.989 15.8833 13.1445 15.8833 13.3334C15.8833 13.5223 15.8222 13.6779 15.7 13.8001C15.5777 13.9223 15.4222 13.9834 15.2333 13.9834C15.0444 13.9834 14.8888 13.9223 14.7666 13.8001L12.1666 11.2001Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); } .accordion.dashed .accordion-item .accordion-content { border-radius: unset; background: unset; padding: 0; border: unset; } .accordion.dashed .accordion-item .accordion-content ul { margin: 0; list-style: none; } .accordion.dashed .accordion-item .accordion-content .documents-card:not(:first-of-type) { margin-top: 16px; } .accordion.dashed .accordion-item .accordion-content .documents-card p:first-of-type { display: flex; align-items: center; margin-bottom: 4px; } .accordion.dashed .accordion-item .accordion-content .documents-card p:first-of-type:before { content: ''; width: 8px; height: 8px; background-color: var(--informative-loud); display: block; border-radius: 50%; flex-shrink: 0; margin-right: 8px; } .accordion.dashed .accordion-item .accordion-content .documents-card p:last-of-type { margin-left: 16px; } .accordion.dashed .accordion-item .accordion-content .documents-card.success p:first-of-type:before { background-color: var(--success-loud); } thead, tbody, tfoot { border: unset; } .bold { font-weight: 700; } tbody th, tbody td { padding: 0; } #GooglePlayButton { margin-right: 4px; text-align: right; } #HuaweiButton { margin-left: 4px; text-align: left; } #top-banner-marketing-page { background-color: var(--insurance); color: var(--white); border-radius: 8px; padding: 15px; margin-bottom: 24px; } #top-banner-marketing-page .button{ margin: 0; } #top-banner-marketing-page .button { margin: 0; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) { font-size: 30px; } #top-banner-marketing-page > .grid-x { margin-bottom: 24px; } #top-banner-marketing-page > .grid-x.grid-padding-y .cell { padding-top: 0; padding-bottom: 0; } #top-banner-marketing-page .cell:first-child * { color: var(--white); margin-bottom: 8px; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) { flex-direction: column; justify-content: center; align-items: center; display: flex; background-color: var(--white) !important; border-radius: 50%; margin-left: auto; width: 108px; height: 108px; padding: 14px 13px; color: var(--insurance-copy); } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) * { margin-bottom: 0; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) > div:nth-child(1) { color: var(--insurance-copy); font-size: 12px; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) > div:nth-child(2) { color: var(--insurance-copy); font-weight: bold; font-size: 36px; margin-top: -11px; margin-left: -4px; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) > div:nth-child(3){ color: var(--insurance-copy); font-size: 12px; margin-top: -12px; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) > div:nth-child(3) { color: var(--insurance-copy); font-size: 12px; margin-top: -12px; } #top-banner-marketing-page .button, #top-banner-marketing-page .button.primary, #top-banner-marketing-page .button.secondary, #top-banner-marketing-page .button.action { background-color: var(--white) !important; border: 1px solid var(--white) !important; color: var(--black) !important; } #top-banner-marketing-page .button:hover, #top-banner-marketing-page .button.primary:hover, #top-banner-marketing-page .button.secondary:hover, #top-banner-marketing-page .button.action:hover { background-color: var(--neutral-0); border: 1px solid var(--surface-primary); color: var(--black); } #top-banner-marketing-page h3 { line-height: 1; } @media only screen and (max-width: 380px) { #top-banner-marketing-page .grid-x .small-8 { width: 60%; } #top-banner-marketing-page .grid-x .small-4 { width: 40%; } #top-banner-marketing-page .cell h2 { font-size: 30px; } #top-banner-marketing-page > div:nth-child(1) > div:nth-child(2) > div:nth-child(1) { width: 100px; height: 100px; } } ul, ol, dl { line-height: 1.4; } ul.product { list-style: none; font-size: 14px; margin-left: unset; line-height: 1.2; } ul.product.body2 { font-size: 13px; font-weight: 400; line-height: 1.2; } ul.product li{ display: flex; align-items: center; margin-bottom: 8px; line-height: 1.2; } ul.product li:last-child { margin-bottom: 0px; } ul.product li:before { margin-right: 12px; display: flex; align-self: center; content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%230D49ED'/%3E%3Cpath d='M10.5253 13.85L16.1753 8.2C16.3087 8.06667 16.4642 8 16.642 8C16.8198 8 16.9753 8.06667 17.1087 8.2C17.242 8.33333 17.3087 8.49167 17.3087 8.675C17.3087 8.85833 17.242 9.01667 17.1087 9.15L10.992 15.2833C10.8587 15.4167 10.7031 15.4833 10.5253 15.4833C10.3476 15.4833 10.192 15.4167 10.0587 15.2833L7.192 12.4167C7.05867 12.2833 6.99478 12.125 7.00033 11.9417C7.00589 11.7583 7.07533 11.6 7.20867 11.4667C7.342 11.3333 7.50033 11.2667 7.68367 11.2667C7.867 11.2667 8.02533 11.3333 8.15867 11.4667L10.5253 13.85Z' fill='white'/%3E%3C/svg%3E%0A"); } ul.product.loans li:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23098299'/%3E%3Cpath d='M10.5253 13.85L16.1753 8.2C16.3087 8.06667 16.4642 8 16.642 8C16.8198 8 16.9753 8.06667 17.1087 8.2C17.242 8.33333 17.3087 8.49167 17.3087 8.675C17.3087 8.85833 17.242 9.01667 17.1087 9.15L10.992 15.2833C10.8587 15.4167 10.7031 15.4833 10.5253 15.4833C10.3476 15.4833 10.192 15.4167 10.0587 15.2833L7.192 12.4167C7.05867 12.2833 6.99478 12.125 7.00033 11.9417C7.00589 11.7583 7.07533 11.6 7.20867 11.4667C7.342 11.3333 7.50033 11.2667 7.68367 11.2667C7.867 11.2667 8.02533 11.3333 8.15867 11.4667L10.5253 13.85Z' fill='white'/%3E%3C/svg%3E%0A"); } ul.product.mobi-money li:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23F2BE00'/%3E%3Cpath d='M10.5253 13.85L16.1753 8.2C16.3087 8.06667 16.4642 8 16.642 8C16.8198 8 16.9753 8.06667 17.1087 8.2C17.242 8.33333 17.3087 8.49167 17.3087 8.675C17.3087 8.85833 17.242 9.01667 17.1087 9.15L10.992 15.2833C10.8587 15.4167 10.7031 15.4833 10.5253 15.4833C10.3476 15.4833 10.192 15.4167 10.0587 15.2833L7.192 12.4167C7.05867 12.2833 6.99478 12.125 7.00033 11.9417C7.00589 11.7583 7.07533 11.6 7.20867 11.4667C7.342 11.3333 7.50033 11.2667 7.68367 11.2667C7.867 11.2667 8.02533 11.3333 8.15867 11.4667L10.5253 13.85Z' fill='white'/%3E%3C/svg%3E%0A"); } ul.product.insurance li:before { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%237F0038'/%3E%3Cpath d='M10.5253 13.85L16.1753 8.2C16.3087 8.06667 16.4642 8 16.642 8C16.8198 8 16.9753 8.06667 17.1087 8.2C17.242 8.33333 17.3087 8.49167 17.3087 8.675C17.3087 8.85833 17.242 9.01667 17.1087 9.15L10.992 15.2833C10.8587 15.4167 10.7031 15.4833 10.5253 15.4833C10.3476 15.4833 10.192 15.4167 10.0587 15.2833L7.192 12.4167C7.05867 12.2833 6.99478 12.125 7.00033 11.9417C7.00589 11.7583 7.07533 11.6 7.20867 11.4667C7.342 11.3333 7.50033 11.2667 7.68367 11.2667C7.867 11.2667 8.02533 11.3333 8.15867 11.4667L10.5253 13.85Z' fill='white'/%3E%3C/svg%3E%0A"); } /* Utilities */ .p-0{ padding: 0 !important; } .p-12 { padding: 12px !important; } .pb-0 { padding-bottom: 0 !important; } .m-0{ margin: 0 !important; } .mb-0 { margin-bottom: 0 !important; } .mb-4 { margin-bottom: 4px !important; } .mb-6 { margin-bottom: 6px !important; } .mb-8 { margin-bottom: 8px !important; } .mb-12 { margin-bottom: 12px !important; } .mb-16 { margin-bottom: 16px !important; } .mb-24 { margin-bottom: 24px !important; } .mb-32 { margin-bottom: 32px !important; } .mb-40{ margin-bottom: 40px !important; } .mt-4 { margin-top: 4px !important; } .mt-8 { margin-top: 8px !important; } .mt-12 { margin-top: 12px !important; } .mt-16 { margin-top: 16px !important; } .mt-24 { margin-top: 24px !important; } .mt-30 { margin-top: 30px !important; } .mt-40 { margin-top: 40px !important; } .mr-10 { margin-right: 10px; } .mr-0{ margin-right: 0px; } .mr-5 { margin-right: 5px; } .ml-10 { margin-left: 10px; } .ml-0{ margin-left: 0px; } .border-radius-8 { border-radius: 8px !important; } .border-radius-12 { border-radius: 12px !important; } .ml-auto { margin-left: auto; } .max-width-unset, .max-width-unset svg{ max-width: unset; } .display-flex{ display: flex; } .align-self-center{ align-self: center; } .align-items-center { align-items: center; } .card { padding: 16px; border-radius: 8px; } .card .heading { margin-bottom: 16px; } .italic { font-style: italic; } .text-capitalize { text-transform: capitalize; } .justify-space-between { justify-content: space-between; } .gap-8{ gap: 8px; } .gap-17 { gap: 17px; } .border-none{ border: unset !important; } .line-height-0 { line-height: 0; } /* Container spacing remains unchanged */ .radio-long-button-group { margin: 20px 0px; margin-bottom: 50px; } .radio-long-button-item { margin-bottom: 10px; display: flex; } /* Hide the native radio button */ .radio-long-button-item input[type="radio"] { position: absolute; opacity: 0; } /* Label styling with adjusted left padding for the custom radio */ .radio-long-button-item > label { position: relative; width: 100%; margin: 0 !important; padding: 10px 10px 10px 30px; cursor: pointer; border: 1px solid #dcdcdc; border-radius: 8px; } /* Outer circle of the custom radio button */ .radio-long-button-item > label::before { content: ""; position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; border: 1px solid var(--primary); border-radius: 50%; background-color: #fff; } .radio-long-button-item.rounded > label::before { left: 15px; } .radio-long-button-item.rounded input[type="radio"]:checked + label::after { left: 18px; } /* Optional: change label background on checked state */ .radio-long-button-item input[type="radio"]:checked + label { background-color: var(--surface-light-2); border: 1px solid var(--primary); } /* Change the border color when checked */ .radio-long-button-item input[type="radio"]:checked + label::before { border-color: var(--primary); } /* Inner circle (the check indicator) with spacing between it and the outer circle */ .radio-long-button-item input[type="radio"]:checked + label::after { content: ""; position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 8px; height: 8px; border-radius: 50%; background-color: var(--primary); } /* Additional styling for inner elements */ .radio-long-button-item span { color: var(--black); display: block; font-size: 13px; } .radio-long-button-item input[type="radio"]:checked + label span { color: var(--primary); } .radio-long-button-item input[type="file"], .radio-long-button-item input[type="checkbox"], .radio-long-button-item input[type="radio"] { margin: 0; margin-right: 10px; } .radio-long-button-item.rounded > label { border-radius: 100px; padding: 16px 16px 16px 40px } .radio-buttons-with-overlay-btn { position: relative; } .over-lay-button { position: absolute; margin-bottom: unset !important; left: 50%; top: 0; transform: translate(-50%, -50%); z-index: 10; } .guardrisk { position: relative; overflow: hidden; height: 160px; } .guardrisk img { position: absolute; top: 50%; left: 50%; height: auto; min-width: 100%; min-height: 100%; transform: translate(-50%, -50%); } .radio-button input[type="radio"] { margin-bottom: 0; } /* Selection Cards */ .radio-button-group { display: flex; flex-wrap: wrap; width: auto; margin-left: -4px; margin-right: -4px; margin-bottom: 16px; } .radio-button-group .radio-button-item { max-width: 33.333%; margin: 0px; padding: 4px; } .radio-button-group.columns-2 .radio-button-item { max-width: 50%; } .radio-button-group.columns-4 .radio-button-item { max-width: 25%; } .radio-button-item { border: none; display: inline-block; margin: 0; border-radius: 0px; text-align: center; width: 100% !important; height: unset !important; } .radio-button-item img { height: 58px; width: 58px; align-self: center; margin-bottom: 5px; border-radius: 6px; } .radio-button-item input[type="radio"], .radio-button-item input[type="checkbox"] { position: absolute; opacity: 0; visibility: hidden; } .radio-button-item input[type="radio"]+label, .radio-button-item input[type="checkbox"]+label { display: flex; flex-direction: column; border: 1px solid #E3E6EB; border-radius: 8px; text-align: center; width: unset; height: unset; min-height: 96px; padding: 8px; margin: 0px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 120%; position: relative; user-select: none; color: var(--black); transition: all 0.3s; } .radio-button-item input[type="radio"]+label span:only-child, .radio-button-item input[type="checkbox"]+label span:only-child { display: flex; justify-content: center; align-items: center; min-height: 48px; } .radio-button-item input[type="radio"]:checked+label, .radio-button-item input[type="checkbox"]:checked+label { color: var(--primary); font-weight: 700; } .radio-button-item input[type="radio"]+label::before, .radio-button-item input[type="checkbox"]+label::before { content: ""; display: block; width: 16px; height: 16px; border: 1px solid var(--primary); border-radius: 50%; margin: 4px auto 8px; z-index: 1; } .radio-button-item input[type="radio"]+label::after, .radio-button-item input[type="checkbox"]+label::after { content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; background-color: transparent; position: absolute; top: 20px; left: 50%; transform: translate(-50%, -50%); } .radio-button-item input[type="radio"]:checked+label, .radio-button-item input[type="checkbox"]:checked+label { border: 1px solid var(--primary); color: var(--primary); background: var(--surface-light-2); } .radio-button-item input[type="radio"]:checked+label span, .radio-button-item input[type="radio"]:checked+label span { color: var(--primary); } .radio-button-item input[type="radio"]:checked+label::before, .radio-button-item input[type="checkbox"]:checked+label::before { border: 1px solid var(--primary); } .radio-button-item input[type="radio"]:checked+label::after, .radio-button-item input[type="checkbox"]:checked+label::after { background-color: var(--primary); } /*Customer Survey Styling*/ .radio-button-group.customer-survey{ justify-content: center; } .radio-button-group .radio-button-item.sad, .radio-button-group .radio-button-item.avg , .radio-button-group .radio-button-item.happy{ max-width: 104px; } .radio-button-item.sad input[type="radio"] + label, .radio-button-item.avg input[type="radio"] + label, .radio-button-item.happy input[type="radio"] + label { color: var(--error); padding: 12px; } .radio-button-item.avg input[type="radio"] + label { color: var(--warning); } .radio-button-item.happy input[type="radio"] + label { color: var(--success); } .radio-button-item.sad input[type="radio"] + label::before, .radio-button-item.avg input[type="radio"] + label::before, .radio-button-item.happy input[type="radio"] + label::before{ content: unset; display: unset; width: unset; height: unset; border: unset; border-radius: unset; margin: unset; z-index: unset; } .radio-button-item.sad input[type="radio"] + label::after, .radio-button-item.avg input[type="radio"] + label::after .radio-button-item.happy input[type="radio"] + label::after { content: unset; display: block; width: unset; height: unset; border-radius: unset; background-color: unset; position: unset; top: unset; left: unset; transform: unset; } .radio-button-item.sad .icon, .radio-button-item.avg .icon, .radio-button-item.happy .icon{ margin-bottom: 17px; } .radio-button-item.sad input[type="radio"]:checked + label::after, .radio-button-item.avg input[type="radio"]:checked + label::after, .radio-button-item.happy input[type="radio"]:checked + label::after { background-color: unset; content: unset; } .radio-button-item input[type="radio"]:checked + label::after { background-color: unset; } .radio-button-item.sad input[type="radio"]:checked + label { border: 1px solid var(--error); color: var(--error); background: var(--error-quiet); } .radio-button-item.sad input[type="radio"]:checked + label span{ color: var(--error); } .radio-button-item.avg input[type="radio"]:checked + label { border: 1px solid var(--warning); color: var(--warning); background: var(--warning-quiet); } .radio-button-item.avg input[type="radio"]:checked + label span{ color: var(--warning); } .radio-button-item.happy input[type="radio"]:checked + label { border: 1px solid var(--success); color: var(--success); background: var(--success-quiet); } .radio-button-item.happy input[type="radio"]:checked + label span{ color: var(--success); } .radio-button-group-no-input { display: flex; gap: 8px; width: 100%; } .radio-button-group-no-input .radio-button-item-no-input{ width: 100%; } .radio-button-group-no-input .radio-button-item-no-input label{ display: flex; flex-direction: column; border: 1px solid var(--surface-outline-light); border-radius: 8px; text-align: center; width: 100%; height: unset; min-height: 96px; padding: 8px; margin: 0px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 120%; position: relative; user-select: none; color: var(--black); transition: all 0.3s; justify-content: center; } .radio-button-group-no-input .radio-button-item-no-input.active label, .radio-button-group-no-input .radio-button-item-no-input input[type="radio"]:checked + label{ font-weight: 700; background: var(--surface-light-2); border: 1px solid var(--primary); } /* FDP-8780: the PTP amount cards (.AmountCard) present as radio options — a radio dot on the left with the amount and label stacked beside it (AC2), rather than the default centred card. Scoped to .AmountCard so the shared .radio-button-item-no-input stays unchanged. */ .radio-button-group-no-input .radio-button-item-no-input.AmountCard label{ flex-direction: column; align-items: flex-start; text-align: left; justify-content: center; min-height: 64px; padding-left: 40px; } .radio-button-group-no-input .radio-button-item-no-input.AmountCard label:before{ content: ""; position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; /* FDP-8859: the unselected radio carries the primary (blue) border from first load. */ border: 2px solid var(--primary); border-radius: 50%; box-sizing: border-box; } .radio-button-group-no-input .radio-button-item-no-input.AmountCard.active label:before{ border-color: var(--primary); background: radial-gradient(circle at center, var(--primary) 0 5px, #fff 6px 100%); } .radio-button-item input[type="radio"] { position: absolute; opacity: 0; visibility: hidden; } .radio-button-item input[type="radio"] + label { display: flex; flex-direction: column; border: 1px solid #E3E6EB; border-radius: 8px; text-align: center; width: unset; height: unset; min-height: 96px; padding: 8px; margin: 0px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 120%; position: relative; user-select: none; color: var(--black); transition: all 0.3s; } .radio-button-item input[type="radio"] + label span:only-child { display: flex; justify-content: center; align-items: center; min-height: 48px; } .radio-button-item input[type="radio"]:checked + label { color: var(--primary); font-weight: 700; } .radio-button-item input[type="radio"] + label::before { content: ""; display: block; width: 16px; height: 16px; border: 1px solid var(--primary); border-radius: 50%; margin: 4px auto 8px; z-index: 1; } .radio-button-item input[type="radio"] + label::after { content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; background-color: transparent; position: absolute; top: 20px; left: 50%; transform: translate(-50%, -50%); } .radio-button-item input[type="radio"]:checked + label { border: 1px solid var(--primary); color: var(--primary); background: var(--surface-light-2); } .radio-button-item input[type="radio"]:checked + label span { color: var(--primary); } .radio-button-item input[type="radio"]:checked + label::before { border: 1px solid var(--primary); } .radio-button-item input[type="radio"]:checked + label::after { background-color: var(--primary); } /* Radio Input */ .input-radio input[type="radio"] { position: absolute; opacity: 0; visibility: hidden; } .input-radio input[type="radio"] + label { display: flex; align-items: center; border: 1px solid var(--surface-outline-light); border-radius: 8px; width: 100%; height: unset; min-height: 48px; padding: 12px 8px; margin: 0px 0px 16px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 120%; position: relative; user-select: none; color: var(--black); transition: all 0.3s; } .input-radio input[type="radio"] + label::before { content: ""; display: block; width: 16px; height: 16px; border: 1px solid var(--primary); border-radius: 50%; margin: 0px 0px 0px auto; z-index: 1; order: 5; } .input-radio input[type="radio"] + label::after { content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; background-color: transparent; position: absolute; top: 50%; right: 6px; transform: translate(-50%, -50%); } .input-radio input[type="radio"]:checked + label { border: 1px solid var(--primary); color: var(--primary); font-weight: 600; } .input-radio input[type="radio"]:checked + label::before { border: 1px solid var(--primary); } .input-radio input[type="radio"]:checked + label::after { background-color: var(--primary); } .input-radio input[type="radio"]:checked + label .text-normal { font-weight: 400!important; } /* Number Select Radio */ .number-select-radio-group, .bigProductTermButtons { display: flex; flex-wrap: wrap; width: auto; margin-left: -4px; margin-right: -4px; margin-bottom: 16px; margin-top: 16px; gap: 12px; justify-content: center; } .number-select-radio-group .number-select-radio { max-width: 33.333%; margin: 0px; padding: 4px; } .number-select-radio-group.columns-4 .number-select-radio { max-width: 25%; } .number-select-radio { border: none; display: inline-block; margin: 0; border-radius: 0px; text-align: center; width: unset !important; height: unset !important; } .number-select-radio input[type="radio"] { position: absolute; opacity: 0; visibility: hidden; } .number-select-radio input[type="radio"] + label { display: flex; justify-content: center; align-items: center; background-color: var(--white); border: 1px solid var(--primary-dark-state-2); border-radius: 50%; text-align: center; width: 48px; height: 48px; padding: 12px; margin: 0px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 100%; position: relative; user-select: none; color: var(--primary-dark-state-2) !important; transition: all 0.3s; } .number-select-radio input[type="radio"]:checked + label { background-color: var(--primary-dark-state-1); border: 1px solid var(--primary-dark-state-1); color: var(--white) !important; } .number-select-radio input[type="radio"] + label:hover { background-color: var(--primary-dark-state-2); border: 1px solid var(--primary-dark-state-2); color: var(--white) !important; } .number-select-radio input[type="radio"] + label:focus { background-color: var(--primary-dark-state-3); border: 1px solid var(--primary-dark-state-3); color: var(--white) !important; } .number-select-radio input[type="radio"][disabled] + label { border: 1px solid var(--disabled) !important; background: var(--white) !important; color: var(--disabled) !important; } /* Radio Input */ .input-checkbox input[type="checkbox"] { position: absolute; opacity: 0; visibility: hidden; } .input-checkbox input[type="checkbox"] + label { display: block; width: 100%; height: unset; margin: 2px 0px 16px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 140%; position: relative; padding-left: 28px; user-select: none; color: var(--black); transition: all 0.3s; } .input-checkbox input[type="checkbox"] + label::before { content: ""; display: block; width: 17px; height: 16px; border: 1px solid var(--primary); border-radius: 2px; margin: 0px 12px 0px 0px; z-index: 1; position: absolute; top: 2px; left: 0; } .input-checkbox input[type="checkbox"]:checked + label::before { background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16 2.06494C16 0.960372 15.1046 0.0649414 14 0.0649414H2C0.895431 0.0649414 0 0.960372 0 2.06494V14.0649C0 15.1695 0.895431 16.0649 2 16.0649H14C15.1046 16.0649 16 15.1695 16 14.0649V2.06494ZM13.4703 4.58042L13.8819 4.11006L12.9412 3.28693L12.5296 3.75729L6.13301 11.0677L3.42275 8.57864L2.96242 8.15588L2.11692 9.07654L2.57725 9.4993L5.75904 12.4214L6.23057 12.8544L6.65215 12.3726L13.4703 4.58042Z' fill='%230D49ED'/%3E%3C/svg%3E"); background-size: cover; background-position: center; background-repeat: no-repeat; } /* Sector Types && Questions */ .sector-type-container { margin: 20px 0px 50px; } .sector-type { margin-bottom: 10px; display: flex; align-items: center; } .sector-type input.input-hidden, .questions-container .question input.input-hidden { visibility: hidden; opacity: 0; position: absolute; } .sector-type input[type="radio"] + label, .questions-container .question input[type="radio"] + label { display: flex; border: 1px solid #E3E6EB; border-radius: 8px; width: 100%; height: unset; min-height: 48px; padding: 12px 8px; margin: 0px; font-size: 13px; font-style: normal; font-weight: 400; line-height: 120%; position: relative; user-select: none; color: var(--black); transition: all 0.3s; align-items: center; } .sector-type input[type="radio"] + label::before, .questions-container .question input[type="radio"] + label::before { content: ""; display: block; width: 16px; height: 16px; border: 1px solid var(--primary); border-radius: 50%; margin: 0px 0px 0px auto; z-index: 1; order: 5; } .sector-type input[type="radio"] + label::after, .questions-container .question input[type="radio"] + label::after { content: ""; display: block; width: 10px; height: 10px; border-radius: 50%; background-color: transparent; position: absolute; top: 50%; right: 6px; transform: translate(-50%, -50%); } .sector-type input[type="radio"][type="radio"]:checked + label, .questions-container .question input[type="radio"][type="radio"]:checked + label { background-color: var(--surface-light-2); border: 1px solid var(--primary); color: var(--primary); } .sector-type input[type="radio"]:checked + label::before, .questions-container .question input[type="radio"]:checked + label::before { border: 1px solid var(--primary); } .sector-type input[type="radio"]:checked + label::after, .questions-container .question input[type="radio"]:checked + label::after { background-color: var(--primary); } .sector-type .sector-type-title, .questions-container .question .question-title { display: block; font-size: 13px; font-style: normal; font-weight: bold; line-height: 120%; color: var(--primary); margin-bottom: 4px; } .sector-type-image { margin-right: 10px; } .sector-type-image svg, .sector-type-image path { fill: var(--primary); } .sector-type input[type="radio"]+label span:not(.sector-type-image) { max-width: calc(100% - 76px); width: 100%; } .questions-container { margin-bottom: 24px; } .questions-container .question input[type="radio"] + label { font-style: normal; border: 1px solid #dcdcdc; color: #4a4a4a; } .questions-container .question input[type="radio"]:checked + label { background-color: var(--surface-light-2); border: 1px solid var(--primary); color: var(--black); } .questions-container .question { margin-bottom: 16px; } .questions-container .question > label { width: 100%; margin: 0 !important; padding: 5px; cursor: pointer; border-radius: 8px; display: flex; align-items: center; } .questions-container .question.question-title { color: var(--primary); display: block; font-size: 14px; font-weight: bold; display: inline-flex; align-items: center; } .questions-container .question .question-image { flex: 0 0 24px; justify-content: center; display: flex; flex-direction: column; margin-right: 10px; } .questions-container .question .question-image svg { max-width: 30px !important; } .questions-container .question-image path { fill: var(--black); } .questions-container .question.question-other { background-color: var(--surface-light-2); border-radius: 5px; padding-top: 5px; } .questions-container .question input[type="radio"] + label span:not(.question-image) { max-width: calc(100% - 76px); width: 100%; } .company-size { margin-bottom: 10px; flex-grow: 1; margin: 2px; } .company-size > label { width: 100%; margin: 0 !important; padding: 6px; cursor: pointer; border-radius: 8px; font-size: 13px !important; text-align: center; } .company-size-container { margin: 20px 0px; margin-bottom: 25px; display: flex; justify-items: center; } .company-size-title { color: var(--primary); display: block; font-weight: bold; font-size: 14px; } button.collapsible { display: block; width: 100%; background-color: unset; border: 1px solid var(--primary-light-state-4); border-radius: 8px; color: var(--black); padding-right: 40px; font-size: 13px; font-weight: 600; line-height: 18.2px; text-decoration: none; position: relative; padding: 1.25rem 1rem; cursor: pointer; } button.collapsible.active, button.collapsible:hover { background-color: unset; border: 1px solid var(--primary-light-state-4); color: var(--black); } button.collapsible:after { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23FBFCFF'/%3E%3Cpath d='M11.0438 12.5605H7.75833C7.54556 12.5605 7.36594 12.4873 7.2195 12.341C7.07317 12.1946 7 12.0149 7 11.8022C7 11.5894 7.07317 11.4098 7.2195 11.2633C7.36594 11.117 7.54556 11.0438 7.75833 11.0438H11.0438V7.75833C11.0438 7.54556 11.117 7.36594 11.2633 7.2195C11.4098 7.07317 11.5894 7 11.8022 7C12.0149 7 12.1946 7.07317 12.341 7.2195C12.4873 7.36594 12.5605 7.54556 12.5605 7.75833V11.0438H15.846C16.0588 11.0438 16.2384 11.117 16.3848 11.2633C16.5312 11.4098 16.6043 11.5894 16.6043 11.8022C16.6043 12.0149 16.5312 12.1946 16.3848 12.341C16.2384 12.4873 16.0588 12.5605 15.846 12.5605H12.5605V15.846C12.5605 16.0588 12.4873 16.2384 12.341 16.3848C12.1946 16.5312 12.0149 16.6043 11.8022 16.6043C11.5894 16.6043 11.4098 16.5312 11.2633 16.3848C11.117 16.2384 11.0438 16.0588 11.0438 15.846V12.5605Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); top: calc(50% - 12px); margin-top: 0; position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; } button.collapsible.active:after { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23FBFCFF'/%3E%3Cpath d='M7.50004 12.6667C7.31115 12.6667 7.15282 12.6028 7.02504 12.475C6.89726 12.3473 6.83337 12.1889 6.83337 12C6.83337 11.8112 6.89726 11.6528 7.02504 11.525C7.15282 11.3973 7.31115 11.3334 7.50004 11.3334H15.5C15.6889 11.3334 15.8473 11.3973 15.975 11.525C16.1028 11.6528 16.1667 11.8112 16.1667 12C16.1667 12.1889 16.1028 12.3473 15.975 12.475C15.8473 12.6028 15.6889 12.6667 15.5 12.6667H7.50004Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); } button.collapsible+.content { padding: 0; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; background-color: var(--neutral-0); } button.collapsible.active+.content { padding: 1rem; } .main-page-icon svg { height: 140px; width: auto; } button.collapsible { display: block; width: 100%; background-color: unset; border: 1px solid var(--primary-light-state-4); border-radius: 8px; color: var(--black); padding-right: 40px; font-size: 13px; font-weight: 600; line-height: 18.2px; text-decoration: none; position: relative; padding: 1.25rem 1rem; cursor: pointer; } button.collapsible.active, button.collapsible:hover { background-color: unset; border: 1px solid var(--primary-light-state-4); color: var(--black); } button.collapsible:after { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23FBFCFF'/%3E%3Cpath d='M11.0438 12.5605H7.75833C7.54556 12.5605 7.36594 12.4873 7.2195 12.341C7.07317 12.1946 7 12.0149 7 11.8022C7 11.5894 7.07317 11.4098 7.2195 11.2633C7.36594 11.117 7.54556 11.0438 7.75833 11.0438H11.0438V7.75833C11.0438 7.54556 11.117 7.36594 11.2633 7.2195C11.4098 7.07317 11.5894 7 11.8022 7C12.0149 7 12.1946 7.07317 12.341 7.2195C12.4873 7.36594 12.5605 7.54556 12.5605 7.75833V11.0438H15.846C16.0588 11.0438 16.2384 11.117 16.3848 11.2633C16.5312 11.4098 16.6043 11.5894 16.6043 11.8022C16.6043 12.0149 16.5312 12.1946 16.3848 12.341C16.2384 12.4873 16.0588 12.5605 15.846 12.5605H12.5605V15.846C12.5605 16.0588 12.4873 16.2384 12.341 16.3848C12.1946 16.5312 12.0149 16.6043 11.8022 16.6043C11.5894 16.6043 11.4098 16.5312 11.2633 16.3848C11.117 16.2384 11.0438 16.0588 11.0438 15.846V12.5605Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); top: calc(50% - 12px); margin-top: 0; position: absolute; top: 50%; right: 1rem; margin-top: -0.5rem; } button.collapsible.active:after { content: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='24' height='24' rx='12' fill='%23FBFCFF'/%3E%3Cpath d='M7.50004 12.6667C7.31115 12.6667 7.15282 12.6028 7.02504 12.475C6.89726 12.3473 6.83337 12.1889 6.83337 12C6.83337 11.8112 6.89726 11.6528 7.02504 11.525C7.15282 11.3973 7.31115 11.3334 7.50004 11.3334H15.5C15.6889 11.3334 15.8473 11.3973 15.975 11.525C16.1028 11.6528 16.1667 11.8112 16.1667 12C16.1667 12.1889 16.1028 12.3473 15.975 12.475C15.8473 12.6028 15.6889 12.6667 15.5 12.6667H7.50004Z' fill='%230D49ED'/%3E%3C/svg%3E%0A"); } button.collapsible+.content { padding: 0; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; background-color: var(--neutral-0); } button.collapsible.active+.content { padding: 1rem; } /* table with figures */ .table-outline { border: 1px solid var(--surface-outline-light); padding: 16px; border-radius: 8px; margin-bottom: 16px; } .table-outline label { color: var(--black) !important; margin-bottom: 8px; font-size: 13px; } .table-outline label.bold { font-weight: 600; } .table-outline label.total-bold { font-weight: 700; } .table-outline-split { border: 1px solid var(--surface-outline-light); border-radius: 8px; margin-bottom: 16px; } .table-outline-split label { color: var(--black) !important; margin-bottom: 8px; font-size: 13px; } .table-outline-split .header { padding: 16px 12px 12px 12px; } .table-outline-split .footer { border-top: 1px solid var(--surface-outline-light); padding: 12px; } .table-outline-split .header { padding: 16px 12px 12px 12px; overflow: auto; position: unset; top: 0; z-index: 0; height: unset; } .table-outline-split .footer { border-top: 1px solid var(--surface-outline-light); padding: 12px; } .table-outline-split label.switch { margin-bottom: 0px; } .table-outline-split label.bold { font-weight: 600; } .table-outline-split label.total-bold { font-weight: 700; } .table-filled { background-color: var(--insurance-quiet); border-radius: 8px; margin-bottom: 22px; overflow: hidden; } .table-filled .table-head { background-color: var(--insurance); padding: 12px; } .table-filled .table-head * { margin: 0; color: var(--white); font-weight: 600; } .table-filled .table-data { padding: 16px 12px; } .table-filled .table-data * { margin: 0; color: var(--black); } .table-filled .table-data .grid-x { margin: 0 0 12px; } .table-filled .table-data .grid-x:last-child { margin: 0px; } .table-filled.insurance { background-color: var(--insurance-quiet); } .table-filled.insurance .table-head { background-color: var(--insurance); } label.bold { font-weight: 600; } /* progress bar */ .wizard-progress { padding: 0; } .wizard-progress ol.progress-track { display: table; list-style-type: none; margin: 0; padding: 15px 0 10px 0; table-layout: fixed; width: 100%; margin-bottom: 10px; } .wizard-progress ol.progress-track li { display: table-cell; line-height: 3em; position: relative; text-align: center; border-width: 4px !important; } .wizard-progress ol.progress-track li .icon-wrap { display: none; } .wizard-progress ol.progress-track li:first-of-type { border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .wizard-progress ol.progress-track li:last-of-type { border-top-right-radius: 10px; border-bottom-right-radius: 10px; } /* Current Step */ .wizard-progress ol.progress-track li.progress-current { border-top: 4px solid var(--success-loud); } /* Complete Step */ .wizard-progress ol.progress-track li.progress-done { border-top: 4px solid var(--success-loud); } /* Incomplete Step */ .wizard-progress ol.progress-track li.progress-todo { border-top: 4px solid var(--surface-light-3); } .debi-check-logo { height: 24px; width: 112px; margin-top: 19px; margin-bottom: 18px } #say-goodbye, #mmFuneralBanner { background-color: var(--insurance) !important; color: var(--white); text-align: center; padding: 24px 10px; font-size: 22px; } #say-goodbye h5, #mmFuneralBanner h5 { margin-bottom: 8px; color: var(--white); } #say-goodbye .button, #mmFuneralBanner .button { background-color: var(--white) !important; color: var(--insurance) !important; font-size: 16px !important; font-weight: 600 !important; padding: 15px 16px !important; margin-bottom: 24px !important; text-transform: capitalize !important; box-shadow: 0px 4px 12px 0px rgba(22, 36, 109, 0.1); } .fc-dialog { left: 0px; top: 0px; position: fixed; width: 100vw; height: 100vh; background-color: rgba(255, 255, 255, 0.9); align-items: center; justify-content: center; z-index: 10000; } #dvFCDialogText { background-color: #ffffff; } .fc-dialog table { background-color: transparent; } .input-group { position: relative; } .input-group .input-group-label { display: flex; align-items: center; height: 33px; background-color: var(--white) !important; border: 1px solid var(--surface-primary) !important; color: var(--surface-primary) !important; border-radius: 8px; box-shadow: unset; font-size: 13px; font-style: normal; font-weight: 600; line-height: 120%; background: var(--white); position: absolute; top: 7px; right: 12px; } .input-group .input-group-label:hover { background-color: var(--neutral-0) !important; border: 1px solid var(--surface-primary) !important; color: var(--surface-primary) !important; } .input-group:has(.input-group-label) input { padding-right: 70px; } .callout { padding: 12px !important; border-radius: 8px; display: flex; margin-bottom: 16px; align-items: center; border: 1px solid transparent; font-size: 13px; } .callout > * { font-size: 13px !important; } .callout.primary { background: var(--primary); color: var(--white); } .callout.secondary { background: var(--surface-light-3); color: var(--primary); } .callout.alert { background: var(--error-quiet); color: var(--error); } .callout.success { background: var(--success-quiet); color: var(--success); } .callout.warning { background: var(--warning-quiet); color: var(--warning); } .otp-resend-container { margin-bottom: 1rem; } .otp-resend-container span { display: block; } .otp-input-container { margin: 1rem 0; } .otp-input-container input { padding: 10px; border: 1px solid #ddd; width: 50px; height: 50px; text-align: center; font-size: 30px; display: inline-block; margin: 0; } #btnResendOTP { font-size: 16px; } .button.secondary.clear { padding: 0; border-radius: 2px; border-bottom: 1px solid var(--primary); } .counter-counter-indicator { color: #666; font-size: smaller; margin-left: 125px; margin-top: -5px; } .insurance-icon{ line-height: 0; } .insurance-icon svg path { fill: var(--primary); } .full-height-flex { display: flex; flex-direction: column; height: 100vh; padding-top: 32vh; } .full-height-flex .bottom-nav.elevated { margin: auto -16px 0; } div.RadioBox div.switch { margin-bottom: 0px; } .switch { color: var(--success-loud); font-weight: normal; margin-bottom: 0px; } input:checked~.switch-paddle { background: var(--white); border: 1px solid var(--success-loud); } .switch-paddle { box-sizing: border-box; height: 26.42px; width: 60.85px; border: 0.85px solid var(--disabled); border-radius: 12.79px; background-color: var(--white); margin-right: 0 !important; } .threeMonthDocument { cursor: pointer; } .switch-inactive { right: 15%; color: var(--disabled); font-weight: normal; } .switch-active { font-weight: normal; margin-left: 2px; } .switch-paddle::after { position: absolute; top: 12%; left: 0.14rem; display: block; width: 1.2rem; height: 1.2rem; transform: translate3d(0, 0, 0); border-radius: 12px; background: var(--disabled); transition: all 0.25s ease-out; content: ""; } input:checked~.switch-paddle::after { background: var(--success-loud); } /*Avatar + CTA Selection Cards*/ .missing-info { color: var(--error-loud); } .covered-person-title { margin-top: 20px; font-weight: 600; margin-bottom: 8px; } .covered-person-details { background: var(--white); border: 1px solid var(--surface-outline-light); border-radius: 8px; padding: 12px; } .covered-person-details.grid-container.grid-padding-x { margin: 0; margin-top: 8px; } .covered-person-details i { font-size: 11px; color: #e03124; margin: 5px 0; } .covered-person-details .small-2 { padding-right: 0px !important; } .covered-person-details .small-2 img { padding-left: 5px; } .covered-person-details.missing-info,.view-details-button-url .covered-person-details.missing-info { background-color: var(--error-quiet); border: 1px solid var(--error-loud); } .covered-person-details .initials-icon, .covered-person-details .initials-icon.missing-info{ border-radius: 100%; background-color: var(--surface-primary); width: 40px; color: var(--white); height: 40px; text-align: center; padding: 8px; font-size: 13px; font-style: normal; font-weight: 600; line-height: 120%; display: flex; align-items: center; justify-content: center; } .covered-person-details .initials-icon.missing-info { background-color: var(--error-quiet); border: 2px solid var(--error-loud); color: var(--error-loud); margin: 0; } .covered-person-details .grid-x.grid-padding-x.tile-padding { margin: 0; padding: 0 !important; align-items: center; flex-wrap: nowrap; } .covered-person-details .grid-x.grid-padding-x.tile-padding > .cell.small-6.no-padding { margin: 0 0px 0 0 !important; } .covered-person-details .initial-avatar { width: 40px; margin: 0 16px 0 0 !important; } .covered-person-details .person-name-margin { margin: 0px !important; } .new-info { font-size: 11px; font-style: normal; font-weight: 600; line-height: 120%; color: white; background-color: var(--success-loud); padding: 1px 5px; border-radius: 8px; } .covered-person-details .person-name { font-size: 13px; font-style: normal; font-weight: 600; line-height: 120%; color: var(--primary); margin-bottom: 4px !important; } .covered-person-details .cover-amount { font-size: 11px; font-style: normal; font-weight: 600; line-height: 120%; color: var(--accent-2); } .covered-person-details .missing-info { font-size: 11px; font-style: normal; font-weight: 600; line-height: 120%; color: var(--error-loud); margin-bottom: 4px; } .covered-person-details .button-space { margin: 0 0 0 auto !important; } .covered-person-details .view-details-button.hollow { padding: 12px; font-size: 13px; font-style: normal; font-weight: 600; line-height: 120%; border-radius: 8px; } /* With Link */ .view-details-button-url .covered-person-details { background: var(--white); border: 1px solid var(--surface-outline-light); transition: all 0.3s; } .view-details-button-url:hover .covered-person-details { border: 1px solid var(--surface-outline-light); background: var(--surface-light-2); } .view-details-button { margin: 0 !important; font-size: 14px !important; font-weight: bold !important; background-color: transparent; padding: 11px 8px !important; } a.view-details-button-url { display: block; height: 100%; width: 100%; cursor: pointer; text-decoration: none; } .view-details-button.missing-info { background-color: inherit !important; } .no-right-padding { padding-right: 0 !important; } .no-left-padding { padding-left: 0 !important; } .tile-margin { margin: auto !important; } .tile-padding { padding: 13px 0 !important; } .tile-margin-person-info { margin-top: -7px !important; } .button-space { width: 28%; } .d-none { display: none; } .display-none { display: none; } .d-inline { display: inline; } .d-inline-block { display: inline-block; } .d-inline { display: inline; } .d-inline-block { display: inline-block; } .pill { max-width: fit-content; padding: 5.5px 8px; border-radius: 16px; line-height: 1; } .notify-padding { padding-left: 8px !important; padding-top: 8px } /*Scan to Pay*/ .ScanToPayLogo { position: center; width: 70%; height: 40%; } .ZapperLogo { width: 45%; height: 30%; margin-right: 10px; } .QRCode-Holder { height: 340px; min-height: 340px; width: 100%; display: flex; align-content: center; align-items: center; justify-content: center; margin-top: -20px; z-index: 10; } .QRCode-Holder .scanner-overlay { background-image: url(/Content/Images/QRScannerFrame.png); background-size: 90% 90%; background-position: center center; background-repeat: no-repeat; z-index: 15; position: absolute; width: 100%; height: 280px; } .zapper-logo { background-image: url(/Content/Images/zapper.png); background-size: 90% 90%; background-position: center center; background-repeat: no-repeat; width: 100px; height: 26px; } .overlay-box { width: 110px; height: 110px; border: dashed 2px #ffffff; z-index: 500; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #qr-reader video { overflow: auto; } .funeral-image{ width:100%; } .guardrisk-block { background: var(--surface-light-3); border: 1px solid var(--surface-light-3); border-radius: 8px; padding: 12px; margin-bottom: 16px; } .guardrisk-block img { display: block; width: 100%; max-width: 217px; height: auto; margin: 0 auto; } .guardrisk-block p { color: var(--hint); text-align: center; font-size: 12px; font-weight: 400; line-height: normal; margin: 0; } .best-value-rectangle { box-sizing: border-box; border: 1px solid var(--insurance); border-radius: 8px; background-color: var(--insurance); position: absolute; margin-left: 40px; margin-top: -13px; z-index: 10; } .best-value { color: var(--white); font-size: 13px; font-weight: 500; letter-spacing: 0; line-height: 19px; text-align: center; padding: 2px 8px; } .card-title-paidUpLetter { color: #fefefe; cursor: pointer; display: inline !important; margin-left: 5px; padding-left: 5px; padding-right: 5px; border-radius: 5px; background-color: #999; padding-top: 2px !important; padding-bottom: 2px !important; font-family: 10px poppins, arial !important; font-size: 10px; font-weight: 600 !important; } .tip-slider-accordion-panel { padding: 0 18px; display: none; background-color: white; overflow: hidden; } ul.contact-icons { list-style: none; padding: 0; margin: 0 0 16px; } ul.contact-icons li { display: flex; align-items: center; margin-bottom: 8px; } ul.contact-icons li::before { content: ''; display: inline-block; height: 20px; width: 20px; background-size: cover; background-repeat: no-repeat; background-position: center; margin-right: 8px; } ul.contact-icons .phone-icon::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20px' width='20px' viewBox='0 -960 960 960' fill='%23191A1C'%3E%3Cpath d='M798-120q-125 0-247-54.5T329-329Q229-429 174.5-551T120-798q0-18 12-30t30-12h162q14 0 25 9.5t13 22.5l26 140q2 16-1 27t-11 19l-97 98q20 37 47.5 71.5T387-386q31 31 65 57.5t72 48.5l94-94q9-9 23.5-13.5T670-390l138 28q14 4 23 14.5t9 23.5v162q0 18-12 30t-30 12ZM241-600l66-66-17-94h-89q5 41 14 81t26 79Zm358 358q39 17 79.5 27t81.5 13v-88l-94-19-67 67ZM241-600Zm358 358Z'/%3E%3C/svg%3E"); } ul.contact-icons .email-icon::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23191A1C'%3E%3Cpath d='M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm640-480L501-453q-5 3-10.5 4.5T480-447q-5 0-10.5-1.5T459-453L160-640v400h640v-400ZM480-520l320-200H160l320 200ZM160-640v10-59 1-32 32-.5 58.5-10 400-400Z'/%3E%3C/svg%3E"); } .pjn-small-icon { height: 32px; width: 32px; min-width: 32px; background: var(--pjn-green-80); display: flex; align-items: center; border-radius: 50%; margin-right: 16px; position: relative; } .pjn-small-icon.number-filled { background: var(--pjn-green-60); color: var(--white); } .pjn-small-icon.number-outline { background: var(--surface-light-3); border: 2px solid var(--pjn-green-80); } .pjn-small-icon svg, .pjn-small-icon p { margin: 0 auto; display: block; } .pjn-small-icon .line-1 { position: absolute; width: 2px; height: 300%; background: linear-gradient(var(--pjn-green-60), var(--pjn-green-80)); top: 100%; right: 46%; } .pjn-small-icon .line-2 { position: absolute; width: 2px; height: 250%; background: linear-gradient(var(--pjn-green-80), var(--pjn-green)); top: 100%; right: 46%; } @keyframes slide-right-to-left { from { transform: translateX(0); } to { transform: translateX(-100%); } } @keyframes slide-left-to-right { from { transform: translateX(-100%); } to { transform: translateX(0); } } .logos { overflow: hidden; padding: 4px 0; background: white; white-space: nowrap; position: relative; margin: 0 -15px; } .logos-slide-right-to-left, .logos-slide-left-to-right { display: inline-block; animation: 10s slide-right-to-left infinite linear; } .logos-slide-left-to-right { animation-name: slide-left-to-right; } .logos-slide-right-to-left img, .logos-slide-left-to-right img { height: 72px; margin: 0 4px; } ul.contact-icons .email-icon::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23191A1C'%3E%3Cpath d='M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm640-480L501-453q-5 3-10.5 4.5T480-447q-5 0-10.5-1.5T459-453L160-640v400h640v-400ZM480-520l320-200H160l320 200ZM160-640v10-59 1-32 32-.5 58.5-10 400-400Z'/%3E%3C/svg%3E"); } .pjn-small-icon { height: 32px; width: 32px; min-width: 32px; background: var(--pjn-green-80); display: flex; align-items: center; border-radius: 50%; margin-right: 16px; position: relative; } .pjn-small-icon.number-filled { background: var(--pjn-green-60); color: var(--white); } .pjn-small-icon.number-outline { background: var(--surface-light-3); border: 2px solid var(--pjn-green-80); } .pjn-small-icon svg, .pjn-small-icon p { margin: 0 auto; display: block; } .pjn-small-icon .line-1 { position: absolute; width: 2px; height: 300%; background: linear-gradient(var(--pjn-green-60), var(--pjn-green-80)); top: 100%; right: 46%; } .pjn-small-icon .line-2 { position: absolute; width: 2px; height: 250%; background: linear-gradient(var(--pjn-green-80), var(--pjn-green)); top: 100%; right: 46%; } @keyframes slide-right-to-left { from { transform: translateX(0); } to { transform: translateX(-100%); } } @keyframes slide-left-to-right { from { transform: translateX(-100%); } to { transform: translateX(0); } } .logos { overflow: hidden; padding: 4px 0; background: white; white-space: nowrap; position: relative; margin: 0 -15px; } .logos-slide-right-to-left, .logos-slide-left-to-right { display: inline-block; animation: 10s slide-right-to-left infinite linear; } .logos-slide-left-to-right { animation-name: slide-left-to-right; } .logos-slide-right-to-left img, .logos-slide-left-to-right img { height: 100%; margin: 0 4px; width: auto; max-width: 72px; max-height: 72px; } .reg-vid-container { max-width: 100%; margin: 0 auto; } .reg-vid-container video { width: 100%; height: auto; } .heading-illustration svg { max-width: 170px; max-height: 170px; } switch-toggle-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 1rem; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .switch-toggle-wrapper .switch { margin-bottom: 0; } .mobile-app-toggle { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; border: 1px solid #D70053; border-radius: 0.625rem; overflow: hidden; margin-bottom: 1rem; } .mobile-app-toggle .button { background: transparent; color: #D70053; margin-bottom: 0; -webkit-box-flex: 1; -ms-flex: 1 0 0px; flex: 1 0 0; } .mobile-app-toggle .button:nth-child(n+1) { border-left: 1px solid #D70053; } .mobile-app-toggle .button.is-active { background: #D70053; color: #fefefe; } .simple-subscription-form { background: #71002c; color: #fefefe; padding: 2rem; border-radius: 0; } .simple-subscription-form .button { margin-bottom: 0; border-radius: 0 0 0 0; } .button-badge { background-color: var(--primary-dark-state-2); text-decoration: none; padding: 1rem 1.5rem; position: relative; display: inline-block; border-radius: 0.2rem; -webkit-transition: all ease 0.4s; transition: all ease 0.4s; } .button-badge:hover { -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); } .badge { position: absolute; top: -10px; right: -10px; font-size: 0.8em; } .fa { color: white; } .medium-cell-block-y { -webkit-overflow-scrolling: touch; overscroll-behavior-y: contain; } /* Prevent scroll chaining bounce from propagating to the page (where supported) */ html, body { overscroll-behavior-y: none; } /* Reduce repaints for sticky footers. Scoped to .elevated only: promoting every .bottom-nav to its own compositor layer left Chromium's accessibility bounds stale after content above it expanded (e.g. the quote section on NewLoanQuote), so Appium/UiAutomator tapped the wrong place for #btnGetMoney. */ .bottom-nav.elevated { transform: translateZ(0); will-change: transform; } .flex-row-final { display: flex !important; align-items: center; justify-content: space-between; padding: 0 0.625rem; gap: 0.625rem; min-height: 3rem; } .flex-row-final label { margin-bottom: 0 !important; line-height: 1.2; } .switch-panel{border-style:solid;border-width:1px;border-color:#d8d8d8;margin-bottom:1.25rem;padding:1.25rem;background:#FFF}.switch-light span span,.switch-toggle a{display:none}@media only screen{.switch-light label,.switch-light>span,.switch-toggle label,.switch-toggle>span{line-height:30px;vertical-align:middle}.switch-light{display:block;height:30px;position:relative;overflow:visible;padding:0;margin-left:100px}.switch-light *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.switch-light input:focus+label,.switch-light input:focus~a{outline:#888 dotted 1px}.switch-light label{position:relative;z-index:3;display:block;width:100%}.switch-light input{position:absolute;opacity:0;z-index:5}.switch-light input:checked~a{right:0}.switch-light>span{position:absolute;left:-100px;width:100%;margin:0;padding-right:100px;text-align:left}.switch-light>span span{position:absolute;top:0;left:0;z-index:5;display:block;width:50%;margin-left:100px;text-align:center}.switch-light>span span:last-child{left:50%}.switch-light a{-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out;position:absolute;right:50%;top:0;z-index:4;display:block;width:50%;height:100%;padding:0}.switch-toggle{display:block;height:30px;position:relative;padding:0!important}.switch-toggle *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.switch-toggle input:focus+label,.switch-toggle input:focus~a{outline:0}.switch-toggle input{position:absolute;opacity:0}.switch-toggle input+label{position:relative;z-index:2;float:left;width:50%;height:100%;margin:0;text-align:center}.switch-toggle a{display:block;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out;position:absolute;background:#e5e5e5;top:0;left:0;padding:0;z-index:1;width:50%;height:100%}.switch-toggle input:last-of-type:checked~a{left:50%}.switch-toggle.switch-3 a,.switch-toggle.switch-3 label{width:33.33333%}.switch-toggle.switch-3 input:checked:nth-of-type(2)~a{left:33.33333%}.switch-toggle.switch-3 input:checked:last-of-type~a{left:66.66667%}.switch-toggle.switch-4 a,.switch-toggle.switch-4 label{width:25%}.switch-toggle.switch-4 input:checked:nth-of-type(2)~a{left:25%}.switch-toggle.switch-4 input:checked:nth-of-type(3)~a{left:50%}.switch-toggle.switch-4 input:checked:last-of-type~a{left:75%}.switch-toggle.switch-5 a,.switch-toggle.switch-5 label{width:20%}.switch-toggle.switch-5 input:checked:nth-of-type(2)~a{left:20%}.switch-toggle.switch-5 input:checked:nth-of-type(3)~a{left:40%}.switch-toggle.switch-5 input:checked:nth-of-type(4)~a{left:60%}.switch-toggle.switch-5 input:checked:last-of-type~a{left:80%}.switch-candy{background-color:#2d3035;border-radius:3px;color:#fff;font-weight:700;text-align:center;text-shadow:1px 1px 1px #191b1e;box-shadow:inset 0 2px 6px rgba(0,0,0,.3),0 1px 0 rgba(255,255,255,.2)}.switch-candy label{color:#fff;-webkit-transition:color .2s ease-out;-moz-transition:color .2s ease-out;transition:color .2s ease-out}.switch-candy input:checked+label{color:#333;text-shadow:0 1px 0 rgba(255,255,255,.5)}.switch-candy a{border:1px solid #333;background-color:#70c66b;border-radius:3px;background-image:-webkit-linear-gradient(top,rgba(255,255,255,.2),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(255,255,255,.2),rgba(0,0,0,0));box-shadow:0 1px 1px rgba(0,0,0,.2),inset 0 1px 1px rgba(255,255,255,.45)}.switch-candy>span{color:#333;text-shadow:none}.switch-android label,.switch-candy span{color:#fff}.switch-candy.switch-candy-blue a{background-color:#38a3d4}.switch-candy.switch-candy-yellow a{background-color:#f5e560}.switch-android{background-color:#464747;border-radius:1px;color:#fff;box-shadow:inset rgba(0,0,0,.1) 0 1px 0}.switch-android>span span{opacity:0;-webkit-transition:all .1s;-moz-transition:all .1s;transition:all .1s}.switch-android>span span:first-of-type{opacity:1}.switch-android a{background-color:#666;border-radius:1px;box-shadow:inset rgba(255,255,255,.2) 0 1px 0,inset rgba(0,0,0,.3) 0 -1px 0}.switch-android.switch-light input:checked~a{background-color:#0e88b1}.switch-android.switch-light input:checked~span span:first-of-type{opacity:0}.switch-android.switch-light input:checked~span span:last-of-type{opacity:1}.switch-android.switch-toggle,.switch-android>span span{font-size:85%;text-transform:uppercase}.switch-ios.switch-light{color:#868686}.switch-ios.switch-light a{left:0;width:30px;background-color:#fff;border:1px solid #d3d3d3;border-radius:100%;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out;box-shadow:inset 0 -3px 3px rgba(0,0,0,.025),0 1px 4px rgba(0,0,0,.15),0 4px 4px rgba(0,0,0,.1)}.switch-ios.switch-light>span span{width:100%;left:0;opacity:0}.switch-ios.switch-light>span span:first-of-type{opacity:1;padding-left:30px}.switch-ios.switch-light>span span:last-of-type{padding-right:30px}.switch-ios.switch-light>span:before{content:'';display:block;width:100%;height:100%;position:absolute;left:100px;top:0;background-color:#fafafa;border:1px solid #d3d3d3;border-radius:30px;-webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;transition:all .5s ease-out;box-shadow:inset rgba(0,0,0,.1) 0 1px 0}.switch-ios.switch-light input:checked~a{left:100%;margin-left:-30px}.switch-ios.switch-light input:checked~span:before{border-color:#53d76a;box-shadow:inset 0 0 0 30px #53d76a}.switch-ios.switch-light input:checked~span span:first-of-type{opacity:0}.switch-ios.switch-light input:checked~span span:last-of-type{opacity:1;color:#fff}.switch-ios.switch-toggle{background-color:#fafafa;border:1px solid #d3d3d3;border-radius:30px;box-shadow:inset rgba(0,0,0,.1) 0 1px 0}.switch-ios.switch-toggle a{background-color:#53d76a;border-radius:25px;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;transition:all .3s ease-out}.switch-ios.switch-toggle label{color:#868686}.switch-ios input:checked+label{color:#3a3a3a}}@media only screen and (-webkit-max-device-pixel-ratio:2) and (max-device-width:1280px){.switch-light,.switch-toggle{-webkit-animation:webkitSiblingBugfix infinite 1s}}@-webkit-keyframes webkitSiblingBugfix{from,to{-webkit-transform:translate3d(0,0,0)}} input[type="checkbox"].prettyInput, input[type="radio"].prettyInput { display: none; } label.prettyInput { padding-left: 32px; display: inline-block; line-height: 1.8; font-family: sans-serif; position: relative; margin: 10px 20px 10px 0; } input[type="checkbox"].prettyInput + input[type="hidden"] + label.prettyInput:before { content: ''; display: block; width: 22px; height: 22px; position: absolute; top: 0; left: 0; border: 1px solid #666; background: #fff; } input[type="checkbox"].prettyInput:checked + input[type="hidden"] + label.prettyInput:after { content: ''; display: block; width: 10px; height: 5px; border-bottom: 2px solid #01385f; border-left: 2px solid #01385f; transform: rotate(-45deg); position: absolute; top: 6px; left: 6px; } input[type="radio"].prettyInput + input[type="hidden"] + label.prettyInput:before { content: ''; display: block; width: 22px; height: 22px; position: absolute; top: 0; left: 0; border: 1px solid #666; background: #fff; border-radius: 50%; } input[type="radio"].prettyInput:checked + input[type="hidden"] + label.prettyInput:after { content: ''; display: block; width: 10px; height: 10px; background: #01385f; position: absolute; border-radius: 50%; top: 7px; left: 7px; } :root { /*Core Colors*/ --white: #ffffff; --neutral-0: #FBFCFF; --black: #232426; --primary: #0D49ED; --aqua: #37E994; --pink: #D90959; --light: #D8DCED; --dark: #BDC3E1; --surface-primary: #000000; --accent-2: #027949; --primary-10: #081767; --primary-70: #5184FF; --primary-90: #B7CCFF; /*Surface Colors*/ --surface-light-1: #FFFFFF; --surface-light-2: #FBFCFF; --surface-light-3: #F5F7FF; --surface-dark-3: #3C3D49; --surface-disabled: #F2F3F6; --surface-outline-light: #E3E6EB; /*Brand Colors*/ --hint: #7B7E83; --disabled: #8F9297; --brand-outline-light-2: #D6D9DE; /*Functional Colors*/ --success: #002800; --success-loud: #08842B; --success-quiet: #B0F3B7; --error: #560000; --error-loud: #B50E0E; --error-quiet: #FFE7E5; --decline-state-1: #FFF2F1; --warning: #4C2400; --warning-loud: #F6BC2F; --warning-quiet: #FFE29D; --informative-loud: #2D71E7; --informative-quiet: #DAE7FF; /*Interactive colors*/ --aqua-2: #1DCD86; --aqua-3: #19BB7A; --primary-dark-state-1: #2A62F5; --primary-dark-state-2: #0D49ED; --primary-dark-state-3: #002FC6; --primary-light-state-4: #E3E6EB; /*Product Colors*/ --mobimoney: #F2BE00; --loans: #098299; --insurance: #7F0038; --mobimoney-copy: #5C4A14; --loans-copy: #06252D; --insurance-copy: #340220; --mobimoney-loud: #FFC903; --mobimoney-quiet: #FEFAEA; --loans-quiet: #F7FDFF; --insurance-quiet: #FFF5F8; --pjn-green: #BDF500; --pjn-green-80: #A5D700; --pjn-green-60: #789D00; } @font-face { font-family: 'PPmori'; src: url('Fonts/PP/PPMori-Regular.eot'); src: local('PPmori'), local('PPMori-Regular'), url('Fonts/PP/PPMori-Regular.eot#iefix') format('embedded-opentype'), url('Fonts/PP/PPMori-Regular.woff2') format('woff2'), url('Fonts/PP/PPMori-Regular.woff') format('woff'), url('Fonts/PP/PPMori-Regular.ttf') format('truetype'), url('Fonts/PP/PPMori-Regular.svg#AcidGrotesk-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'PPmori-medium'; src: url('Fonts/PPMori-Medium.eot'); src: local('PPMori Medium'), local('PPMori-Medium'), url('Fonts/PP/PPMori-Medium.eot?#iefix') format('embedded-opentype'), url('Fonts/PP/PPMori-Medium.woff2') format('woff2'), url('Fonts/PP/PPMori-Medium.woff') format('woff'), url('Fonts/PP/PPMori-Medium.ttf') format('truetype'), url('Fonts/PP/PPMori-Medium.svg#AcidGrotesk-Medium') format('svg'); font-style: normal; font-display: swap; } @font-face { font-family: 'PPmori-bold'; src: url('Fonts/PPMori-Medium.eot'); src: local('PPMori Bold'), local('PPMori-Bold'), url('Fonts/PP/PPMori-Bold.eot?#iefix') format('embedded-opentype'), url('Fonts/PP/PPMori-Bold.woff2') format('woff2'), url('Fonts/PP/PPMori-Bold.woff') format('woff'), url('Fonts/PP/PPMori-Bold.ttf') format('truetype'), url('Fonts/PP/PPMori-Bold.svg#AcidGrotesk-Bold') format('svg'); font-style: normal; font-display: swap; } @font-face { font-family: 'P22MackinacPro'; src: url('Fonts/P22MackinacPro-Book.eot'); src: local('Acid Grotesk Bold'), local('P22MackinacPro-Book'), url('Fonts/P22MackinacPro-Book.eot?#iefix') format('embedded-opentype'), url('Fonts/P22MackinacPro-Book.woff2') format('woff2'), url('Fonts/P22MackinacPro-Book.woff') format('woff'), url('Fonts/P22MackinacPro-Book.ttf') format('truetype'), url('Fonts/P22MackinacPro-Book.svg#P22MackinacPro-Book') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'P22MackinacPro-Bold'; src: url('Fonts/P22MackinacPro-Bold.eot'); src: local('Acid Grotesk Bold'), local('P22MackinacPro-Bold'), url('Fonts/P22MackinacPro-Bold.eot?#iefix') format('embedded-opentype'), url('Fonts/P22MackinacPro-Bold.woff2') format('woff2'), url('Fonts/P22MackinacPro-Bold.woff') format('woff'), url('Fonts/P22MackinacPro-Bold.ttf') format('truetype'), url('Fonts/P22MackinacPro-Bold.svg#P22MackinacPro-Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } html, body { } body { background: white; color: var(--black); font-family: 'PPmori', sans-serif; font-size: 0.9375rem; /* font-weight: 500; */ line-height: 1.4; /* letter-spacing: 0.3px; */ } .P22 { font-family: 'P22MackinacPro', sans-serif; line-height: 1; } .P22.bold { font-family: 'P22MackinacPro-Bold', sans-serif; } /* Typography resets */ div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td { margin: 0; padding: 0; } /* Default Link Styles */ a { color: var(--primary); text-decoration: none; line-height: inherit; } a:hover, a:focus { color: var(--primary-dark-state-2); } a img { border: none; } /* Default paragraph styles */ p { font-family: inherit; font-size: 15px; line-height: 1.4; margin-bottom: 8px; text-rendering: optimizeLegibility; } p.lead { font-size: 1.21875rem; line-height: 1.4; } p aside { font-size: 0.9rem; line-height: 1.4; font-style: italic; } /* Default header styles */ h1, h2, h3, h4, h5, h6 { font-family: 'PPmori-bold', sans-serif; font-weight: 700; font-style: normal; color: var(--black); text-rendering: optimizeLegibility; margin-bottom: 16px; margin-top: 0; letter-spacing: 0.3px; line-height: 1.2; } h1.header-spacing, h2.header-spacing, h3.header-spacing, h4.header-spacing, h5.header-spacing, h6.header-spacing { margin-bottom: 8px; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small { font-size: 80%; color: #6f6f6f; line-height: 0; } h1 { font-size: 45px; } h2 { font-size: 38px; } h3 { font-size: 32px; } h4 { font-size: 27px; line-height: 32.4px; } h5 { font-size: 23px; line-height: 27.6px; } h6 { font-size: 19px; line-height: 22.8px; } h1.P22{ font-size: 46px; line-height: 1; letter-spacing: 0; } h2.P22 { font-size: 39px; letter-spacing: 0; } h3.P22 { font-size: 33px; letter-spacing: 0; } h4.P22 { font-size: 28px; letter-spacing: 0; } h5.P22 { font-size: 24px; letter-spacing: 0; } h6.P22 { font-size: 20px; letter-spacing: 0; } .subheader { line-height: 1.4; color: #6f6f6f; font-weight: normal; margin-top: 0.2rem; margin-bottom: 0.5rem; } hr { border: solid #dddddd; border-width: 1px 0 0; clear: both; margin: 1.25rem 0 1.1875rem; height: 0; } /* Helpful Typography Defaults */ em, i { font-style: italic; line-height: inherit; } strong, b { font-family: 'PPmori-bold', sans-serif; font-weight: 700; line-height: inherit; letter-spacing: 0.3px; } small { font-size: 80%; line-height: inherit; } code { font-family: Consolas, "Liberation Mono", Courier, monospace; font-weight: bold; color: #bd260d; } .body2 { font-size: 13px; line-height: 1.2; font-family: 'PPmori-medium', sans-serif; } .body3 { font-size: 11px; line-height: 1.2; font-family: 'PPmori-medium', sans-serif; } .caption { font-size: 13px; font-weight: 500; line-height: 15.6px; font-family: 'PPmori-medium', sans-serif; } /* Lists */ ul, ol, dl { font-size: 15px; line-height: 1.4; margin-bottom: 1.25rem; list-style-position: outside; font-family: inherit; } ul { margin-left: 1.1rem; } ul.no-bullet { margin-left: 0; } ul.no-bullet li ul, ul.no-bullet li ol { margin-left: 1.25rem; margin-bottom: 0; list-style: none; } /* Unordered Lists */ ul li ul, ul li ol { margin-left: 1.25rem; margin-bottom: 0; } ul.square li ul, ul.circle li ul, ul.disc li ul { list-style: inherit; } ul.square { list-style-type: square; margin-left: 1.1rem; } ul.circle { list-style-type: circle; margin-left: 1.1rem; } ul.disc { list-style-type: disc; margin-left: 1.1rem; } ul.no-bullet { list-style: none; } /* Ordered Lists */ ol { margin-left: 1.4rem; } ol li ul, ol li ol { margin-left: 1.25rem; margin-bottom: 0; } /* Definition Lists */ dl dt { margin-bottom: 0.3rem; font-weight: bold; } dl dd { margin-bottom: 0.75rem; } /* Abbreviations */ abbr, acronym { text-transform: uppercase; font-size: 90%; color: #222222; border-bottom: 1px dotted #dddddd; cursor: help; } abbr { text-transform: none; } /* Blockquotes */ blockquote { margin: 0 0 1.25rem; padding: 0.5625rem 1.25rem 0 1.1875rem; border-left: 1px solid #dddddd; } blockquote cite { display: block; font-size: 0.9rem; color: #555555; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited { color: #555555; } blockquote, blockquote p { line-height: 1.6; color: #6f6f6f; } .font-medium { font-weight: 500; } .text-right{ text-align: right; } .subtitle { font-size: 17px; line-height: 1.2; font-style: normal; } .top-bar { overflow: hidden; height: 45px; line-height: 45px; position: relative; background: #333333; margin-bottom: 0; } .top-bar ul { margin-bottom: 0; list-style: none; } .top-bar .row { max-width: none; } .top-bar form, .top-bar input { margin-bottom: 0; } .top-bar input { height: auto; padding-top: .35rem; padding-bottom: .35rem; font-size: 0.75rem; } .top-bar .button, .top-bar button { padding-top: .45rem; padding-bottom: .35rem; margin-bottom: 0; font-size: 0.75rem; } .top-bar .title-area { position: relative; margin: 0; } .top-bar .name { height: 45px; margin: 0; font-size: 16px; } .top-bar .name h1 { line-height: 45px; font-size: 1.0625rem; margin: 0; } .top-bar .name h1 a { font-weight: normal; color: white; width: 75%; display: block; padding: 0 15px; } .top-bar .toggle-topbar { position: absolute; right: 0; top: 0; } .top-bar .toggle-topbar a { color: white; text-transform: uppercase; font-size: 0.9rem; font-weight: bold; position: relative; display: block; padding: 0 15px; height: 45px; line-height: 45px; } .top-bar .toggle-topbar.menu-icon { right: 15px; top: 50%; margin-top: -16px; padding-left: 40px; } .top-bar .toggle-topbar.menu-icon a { height: 34px; line-height: 33px; padding: 0; padding-right: 25px; color: white; position: relative; } .top-bar .toggle-topbar.menu-icon a::after { content: ""; position: absolute; right: 0; display: block; width: 16px; top: 0; height: 0; box-shadow: 0 10px 0 1px white, 0 16px 0 1px white, 0 22px 0 1px white; } .top-bar.expanded { height: auto; background: transparent; } .top-bar.expanded .title-area { background: #333333; } .top-bar.expanded .toggle-topbar a { color: #888888; } .top-bar.expanded .toggle-topbar a::after { box-shadow: 0 10px 0 1px #888888, 0 16px 0 1px #888888, 0 22px 0 1px #888888; } .top-bar-section { left: 0; position: relative; width: auto; transition: left 300ms ease-out; } .top-bar-section ul { width: 100%; height: auto; display: block; background: #333333; font-size: 16px; margin: 0; } .top-bar-section .divider, .top-bar-section [role="separator"] { border-top: solid 1px #1a1a1a; clear: both; height: 1px; width: 100%; } .top-bar-section ul li > a { display: block; width: 100%; color: white; padding: 12px 0 12px 0; padding-left: 15px; font-size: 0.9rem; font-weight: normal; text-transform: none; background: #333333; } .top-bar-section ul li > a.button { font-size: 0.9rem; padding-right: 15px; padding-left: 15px; background-color: var(--primary); border-color: #007095; color: white; } .top-bar-section ul li > a.button:hover, .top-bar-section ul li > a.button:focus { background-color: #007095; } .top-bar-section ul li > a.button:hover, .top-bar-section ul li > a.button:focus { color: white; } .top-bar-section ul li > a.button.secondary { background-color: #e7e7e7; border-color: #b9b9b9; color: #333333; } .top-bar-section ul li > a.button.secondary:hover, .top-bar-section ul li > a.button.secondary:focus { background-color: #b9b9b9; } .top-bar-section ul li > a.button.secondary:hover, .top-bar-section ul li > a.button.secondary:focus { color: #333333; } .top-bar-section ul li > a.button.success { background-color: #43ac6a; border-color: #368a55; color: white; } .top-bar-section ul li > a.button.success:hover, .top-bar-section ul li > a.button.success:focus { background-color: #368a55; } .top-bar-section ul li > a.button.success:hover, .top-bar-section ul li > a.button.success:focus { color: white; } .top-bar-section ul li > a.button.alert { background-color: #f04124; border-color: #cf2a0e; color: white; } .top-bar-section ul li > a.button.alert:hover, .top-bar-section ul li > a.button.alert:focus { background-color: #cf2a0e; } .top-bar-section ul li > a.button.alert:hover, .top-bar-section ul li > a.button.alert:focus { color: white; } .top-bar-section ul li > button { font-size: 0.9rem; padding-right: 15px; padding-left: 15px; background-color: var(--primary); border-color: #007095; color: white; } .top-bar-section ul li > button:hover, .top-bar-section ul li > button:focus { background-color: #007095; } .top-bar-section ul li > button:hover, .top-bar-section ul li > button:focus { color: white; } .top-bar-section ul li > button.secondary { background-color: #e7e7e7; border-color: #b9b9b9; color: #333333; } .top-bar-section ul li > button.secondary:hover, .top-bar-section ul li > button.secondary:focus { background-color: #b9b9b9; } .top-bar-section ul li > button.secondary:hover, .top-bar-section ul li > button.secondary:focus { color: #333333; } .top-bar-section ul li > button.success { background-color: #43ac6a; border-color: #368a55; color: white; } .top-bar-section ul li > button.success:hover, .top-bar-section ul li > button.success:focus { background-color: #368a55; } .top-bar-section ul li > button.success:hover, .top-bar-section ul li > button.success:focus { color: white; } .top-bar-section ul li > button.alert { background-color: #f04124; border-color: #cf2a0e; color: white; } .top-bar-section ul li > button.alert:hover, .top-bar-section ul li > button.alert:focus { background-color: #cf2a0e; } .top-bar-section ul li > button.alert:hover, .top-bar-section ul li > button.alert:focus { color: white; } .top-bar-section ul li:hover:not(.has-form) > a { background: #272727; color: white; } .top-bar-section ul li.active > a { background: var(--primary); color: white; } .top-bar-section ul li.active > a:hover { background: red; color: white; } .top-bar-section .has-form { padding: 15px; } .top-bar-section .has-dropdown { position: relative; } .top-bar-section .has-dropdown > a:after { content: ""; display: block; width: 0; height: 0; border: inset 5px; border-color: transparent transparent transparent rgba(255, 255, 255, 0.4); border-left-style: solid; margin-right: 15px; margin-top: -4.5px; position: absolute; top: 50%; right: 0; } .top-bar-section .has-dropdown.moved { position: static; } .top-bar-section .has-dropdown.moved > .dropdown { display: block; position: static !important; height: auto; width: auto; overflow: visible; clip: auto; position: absolute !important; width: 100%; } .top-bar-section .has-dropdown.moved > a:after { display: none; } .top-bar-section .dropdown { position: absolute; left: 100%; top: 0; z-index: 99; display: block; position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); } .top-bar-section .dropdown li { width: 100%; height: auto; } .top-bar-section .dropdown li a { font-weight: normal; padding: 8px 15px; } .top-bar-section .dropdown li a.parent-link { font-weight: normal; } .top-bar-section .dropdown li.title h5 { margin-bottom: 0; } .top-bar-section .dropdown li.title h5 a { color: white; line-height: 22.5px; display: block; } .top-bar-section .dropdown li.has-form { padding: 8px 15px; } .top-bar-section .dropdown li .button, .top-bar-section .dropdown li button { top: auto; } .top-bar-section .dropdown label { padding: 8px 15px 2px; margin-bottom: 0; text-transform: uppercase; color: #777777; font-weight: bold; font-size: 0.625rem; } .js-generated { display: block; } @media only screen and (min-width: 9999px) { .top-bar { background: #333333; *zoom: 1; overflow: visible; } .top-bar:before, .top-bar:after { content: " "; display: table; } .top-bar:after { clear: both; } .top-bar .toggle-topbar { /*display: none;*/ } .top-bar .title-area { /*float: left; */ } .top-bar .name h1 a { width: auto; } .top-bar input, .top-bar .button, .top-bar button { font-size: 0.9rem; position: relative; top: 7px; } .top-bar.expanded { background: #333333; } .contain-to-grid .top-bar { max-width: 62.5rem; margin: 0 auto; margin-bottom: 0; } .top-bar-section { transition: none 0 0; left: 0 !important; } .top-bar-section ul { width: auto; height: auto !important; display: inline; } .top-bar-section ul li { float: left; } .top-bar-section ul li .js-generated { display: none; } .top-bar-section li.hover > a:not(.button) { background: #272727; color: white; } .top-bar-section li:not(.has-form) a:not(.button) { padding: 0 15px; line-height: 45px; background: #333333; } .top-bar-section li:not(.has-form) a:not(.button):hover { background: #272727; } .top-bar-section li.active:not(.has-form) a:not(.button) { padding: 0 15px; line-height: 45px; color: white; background: var(--primary); } .top-bar-section li.active:not(.has-form) a:not(.button):hover { background: #0078a0; } .top-bar-section .has-dropdown > a { padding-right: 35px !important; } .top-bar-section .has-dropdown > a:after { content: ""; display: block; width: 0; height: 0; border: inset 5px; border-color: rgba(255, 255, 255, 0.4) transparent transparent transparent; border-top-style: solid; margin-top: -2.5px; top: 22.5px; } .top-bar-section .has-dropdown.moved { position: relative; } .top-bar-section .has-dropdown.moved > .dropdown { display: block; position: absolute !important; height: 1px; width: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); } .top-bar-section .has-dropdown.hover > .dropdown, .top-bar-section .has-dropdown.not-click:hover > .dropdown { display: block; position: static !important; height: auto; width: auto; overflow: visible; clip: auto; position: absolute !important; } .top-bar-section .has-dropdown .dropdown li.has-dropdown > a:after { border: none; content: "\00bb"; top: 1rem; margin-top: -1px; right: 5px; line-height: 1.2; } .top-bar-section .dropdown { left: 0; top: auto; background: transparent; min-width: 100%; } .top-bar-section .dropdown li a { color: white; line-height: 1; white-space: nowrap; padding: 12px 15px; background: #333333; } .top-bar-section .dropdown li:not(.has-form) a:not(.button) { color: white; background: #333333; } .top-bar-section .dropdown li:not(.has-form):hover > a:not(.button) { color: white; background: #272727; } .top-bar-section .dropdown li label { white-space: nowrap; background: #333333; } .top-bar-section .dropdown li .dropdown { left: 100%; top: 0; } .top-bar-section > ul > .divider, .top-bar-section > ul > [role="separator"] { border-bottom: none; border-top: none; border-right: solid 1px #4e4e4e; clear: none; height: 45px; width: 0; } .top-bar-section .has-form { background: #333333; padding: 0 15px; height: 45px; } .top-bar-section .right li .dropdown { left: auto; right: 0; } .top-bar-section .right li .dropdown li .dropdown { right: 100%; } .top-bar-section .left li .dropdown { right: auto; left: 0; } .top-bar-section .left li .dropdown li .dropdown { left: 100%; } .no-js .top-bar-section ul li:hover > a { background: #272727; color: white; } .no-js .top-bar-section ul li:active > a { background: var(--primary); color: white; } .no-js .top-bar-section .has-dropdown:hover > .dropdown { display: block; position: static !important; height: auto; width: auto; overflow: visible; clip: auto; position: absolute !important; } }