7.bb52c21dfe2d358b1117.css 673 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964196519661967196819691970197119721973197419751976197719781979198019811982198319841985198619871988198919901991199219931994199519961997199819992000200120022003200420052006200720082009201020112012201320142015201620172018201920202021202220232024202520262027202820292030203120322033203420352036203720382039204020412042204320442045204620472048204920502051205220532054205520562057205820592060206120622063206420652066206720682069207020712072207320742075207620772078207920802081208220832084208520862087208820892090209120922093209420952096209720982099210021012102210321042105210621072108210921102111211221132114211521162117211821192120212121222123212421252126212721282129213021312132213321342135213621372138213921402141214221432144214521462147214821492150215121522153215421552156215721582159216021612162216321642165216621672168216921702171217221732174217521762177217821792180218121822183218421852186218721882189219021912192219321942195219621972198219922002201220222032204220522062207220822092210221122122213221422152216221722182219222022212222222322242225222622272228222922302231223222332234223522362237223822392240224122422243224422452246224722482249225022512252225322542255225622572258225922602261226222632264226522662267226822692270227122722273227422752276227722782279228022812282228322842285228622872288228922902291229222932294229522962297229822992300230123022303230423052306230723082309231023112312231323142315231623172318231923202321232223232324232523262327232823292330233123322333233423352336233723382339234023412342234323442345234623472348234923502351235223532354235523562357235823592360236123622363236423652366236723682369237023712372237323742375237623772378237923802381238223832384238523862387238823892390239123922393239423952396239723982399240024012402240324042405240624072408240924102411241224132414241524162417241824192420242124222423242424252426242724282429243024312432243324342435243624372438243924402441244224432444244524462447244824492450245124522453245424552456245724582459246024612462246324642465246624672468246924702471247224732474247524762477247824792480248124822483248424852486248724882489249024912492249324942495249624972498249925002501250225032504250525062507250825092510251125122513251425152516251725182519252025212522252325242525252625272528252925302531253225332534253525362537253825392540254125422543254425452546254725482549255025512552255325542555255625572558255925602561256225632564256525662567256825692570257125722573257425752576257725782579258025812582258325842585258625872588258925902591259225932594259525962597259825992600260126022603260426052606260726082609261026112612261326142615261626172618261926202621262226232624262526262627262826292630263126322633263426352636263726382639264026412642264326442645264626472648264926502651265226532654265526562657265826592660266126622663266426652666266726682669267026712672267326742675267626772678267926802681268226832684268526862687268826892690269126922693269426952696269726982699270027012702270327042705270627072708270927102711271227132714271527162717271827192720272127222723272427252726272727282729273027312732273327342735273627372738273927402741274227432744274527462747274827492750275127522753275427552756275727582759276027612762276327642765276627672768276927702771277227732774277527762777277827792780278127822783278427852786278727882789279027912792279327942795279627972798279928002801280228032804280528062807280828092810281128122813281428152816281728182819282028212822282328242825282628272828282928302831283228332834283528362837283828392840284128422843284428452846284728482849285028512852285328542855285628572858285928602861286228632864286528662867286828692870287128722873287428752876287728782879288028812882288328842885288628872888288928902891289228932894289528962897289828992900290129022903290429052906290729082909291029112912291329142915291629172918291929202921292229232924292529262927292829292930293129322933293429352936293729382939294029412942294329442945294629472948294929502951295229532954295529562957295829592960296129622963296429652966296729682969297029712972297329742975297629772978297929802981298229832984298529862987298829892990299129922993299429952996299729982999300030013002300330043005300630073008300930103011301230133014301530163017301830193020302130223023302430253026302730283029303030313032303330343035303630373038303930403041304230433044304530463047304830493050305130523053305430553056305730583059306030613062306330643065306630673068306930703071307230733074307530763077307830793080308130823083308430853086308730883089309030913092309330943095309630973098309931003101310231033104310531063107310831093110311131123113311431153116311731183119312031213122312331243125312631273128312931303131313231333134313531363137313831393140314131423143314431453146314731483149315031513152315331543155315631573158315931603161316231633164316531663167316831693170317131723173317431753176317731783179318031813182318331843185318631873188318931903191319231933194319531963197319831993200320132023203320432053206320732083209321032113212321332143215321632173218321932203221322232233224322532263227322832293230323132323233323432353236323732383239324032413242324332443245324632473248324932503251325232533254325532563257325832593260326132623263326432653266326732683269327032713272327332743275327632773278327932803281328232833284328532863287328832893290329132923293329432953296329732983299330033013302330333043305330633073308330933103311331233133314331533163317331833193320332133223323332433253326332733283329333033313332333333343335333633373338333933403341334233433344334533463347334833493350335133523353335433553356335733583359336033613362336333643365336633673368336933703371337233733374337533763377337833793380338133823383338433853386338733883389339033913392339333943395339633973398339934003401340234033404340534063407340834093410341134123413341434153416341734183419342034213422342334243425342634273428342934303431343234333434343534363437343834393440344134423443344434453446344734483449345034513452345334543455345634573458345934603461346234633464346534663467346834693470347134723473347434753476347734783479348034813482348334843485348634873488348934903491349234933494349534963497349834993500350135023503350435053506350735083509351035113512351335143515351635173518351935203521352235233524352535263527352835293530353135323533353435353536353735383539354035413542354335443545354635473548354935503551355235533554355535563557355835593560356135623563356435653566356735683569357035713572357335743575357635773578357935803581358235833584358535863587358835893590359135923593359435953596359735983599360036013602360336043605360636073608360936103611361236133614361536163617361836193620362136223623362436253626362736283629363036313632363336343635363636373638363936403641364236433644364536463647364836493650365136523653365436553656365736583659366036613662366336643665366636673668366936703671367236733674367536763677367836793680368136823683368436853686368736883689369036913692369336943695369636973698369937003701370237033704370537063707370837093710371137123713371437153716371737183719372037213722372337243725372637273728372937303731373237333734373537363737373837393740374137423743374437453746374737483749375037513752375337543755375637573758375937603761376237633764376537663767376837693770377137723773377437753776377737783779378037813782378337843785378637873788378937903791379237933794379537963797379837993800380138023803380438053806380738083809381038113812381338143815381638173818381938203821382238233824382538263827382838293830383138323833383438353836383738383839384038413842384338443845384638473848384938503851385238533854385538563857385838593860386138623863386438653866386738683869387038713872387338743875387638773878387938803881388238833884388538863887388838893890389138923893389438953896389738983899390039013902390339043905390639073908390939103911391239133914391539163917391839193920392139223923392439253926392739283929393039313932393339343935393639373938393939403941394239433944394539463947394839493950395139523953395439553956395739583959396039613962396339643965396639673968396939703971397239733974397539763977397839793980398139823983398439853986398739883989399039913992399339943995399639973998399940004001400240034004400540064007400840094010401140124013401440154016401740184019402040214022402340244025402640274028402940304031403240334034403540364037403840394040404140424043404440454046404740484049405040514052405340544055405640574058405940604061406240634064406540664067406840694070407140724073407440754076407740784079408040814082408340844085408640874088408940904091409240934094409540964097409840994100410141024103410441054106410741084109411041114112411341144115411641174118411941204121412241234124412541264127412841294130413141324133413441354136413741384139414041414142414341444145414641474148414941504151415241534154415541564157415841594160416141624163416441654166416741684169417041714172417341744175417641774178417941804181418241834184418541864187418841894190419141924193419441954196419741984199420042014202420342044205420642074208420942104211421242134214421542164217421842194220422142224223422442254226422742284229423042314232423342344235423642374238423942404241424242434244424542464247424842494250425142524253425442554256425742584259426042614262426342644265426642674268426942704271427242734274427542764277427842794280428142824283428442854286428742884289429042914292429342944295429642974298429943004301430243034304430543064307430843094310431143124313431443154316431743184319432043214322432343244325432643274328432943304331433243334334433543364337433843394340434143424343434443454346434743484349435043514352435343544355435643574358435943604361436243634364436543664367436843694370437143724373437443754376437743784379438043814382438343844385438643874388438943904391439243934394439543964397439843994400440144024403440444054406440744084409441044114412441344144415441644174418441944204421442244234424442544264427442844294430443144324433443444354436443744384439444044414442444344444445444644474448444944504451445244534454445544564457445844594460446144624463446444654466446744684469447044714472447344744475447644774478447944804481448244834484448544864487448844894490449144924493449444954496449744984499450045014502450345044505450645074508450945104511451245134514451545164517451845194520452145224523452445254526452745284529453045314532453345344535453645374538453945404541454245434544454545464547454845494550455145524553455445554556455745584559456045614562456345644565456645674568456945704571457245734574457545764577457845794580458145824583458445854586458745884589459045914592459345944595459645974598459946004601460246034604460546064607460846094610461146124613461446154616461746184619462046214622462346244625462646274628462946304631463246334634463546364637463846394640464146424643464446454646464746484649465046514652465346544655465646574658465946604661466246634664466546664667466846694670467146724673467446754676467746784679468046814682468346844685468646874688468946904691469246934694469546964697469846994700470147024703470447054706470747084709471047114712471347144715471647174718471947204721472247234724472547264727472847294730473147324733473447354736473747384739474047414742474347444745474647474748474947504751475247534754475547564757475847594760476147624763476447654766476747684769477047714772477347744775477647774778477947804781478247834784478547864787478847894790479147924793479447954796479747984799480048014802480348044805480648074808480948104811481248134814481548164817481848194820482148224823482448254826482748284829483048314832483348344835483648374838483948404841484248434844484548464847484848494850485148524853485448554856485748584859486048614862486348644865486648674868486948704871487248734874487548764877487848794880488148824883488448854886488748884889489048914892489348944895489648974898489949004901490249034904490549064907490849094910491149124913491449154916491749184919492049214922492349244925492649274928492949304931493249334934493549364937493849394940494149424943494449454946494749484949495049514952495349544955495649574958495949604961496249634964496549664967496849694970497149724973497449754976497749784979498049814982498349844985498649874988498949904991499249934994499549964997499849995000500150025003500450055006500750085009501050115012501350145015501650175018501950205021502250235024502550265027502850295030503150325033503450355036503750385039504050415042504350445045504650475048504950505051505250535054505550565057505850595060506150625063506450655066506750685069507050715072507350745075507650775078507950805081508250835084508550865087508850895090509150925093509450955096509750985099510051015102510351045105510651075108510951105111511251135114511551165117511851195120512151225123512451255126512751285129513051315132513351345135513651375138513951405141514251435144514551465147514851495150515151525153515451555156515751585159516051615162516351645165516651675168516951705171517251735174517551765177517851795180518151825183518451855186518751885189519051915192519351945195519651975198519952005201520252035204520552065207520852095210521152125213521452155216521752185219522052215222522352245225522652275228522952305231523252335234523552365237523852395240524152425243524452455246524752485249525052515252525352545255525652575258525952605261526252635264526552665267526852695270527152725273527452755276527752785279528052815282528352845285528652875288528952905291529252935294529552965297529852995300530153025303530453055306530753085309531053115312531353145315531653175318531953205321532253235324532553265327532853295330533153325333533453355336533753385339534053415342534353445345534653475348534953505351535253535354535553565357535853595360536153625363536453655366536753685369537053715372537353745375537653775378537953805381538253835384538553865387538853895390539153925393539453955396539753985399540054015402540354045405540654075408540954105411541254135414541554165417541854195420542154225423542454255426542754285429543054315432543354345435543654375438543954405441544254435444544554465447544854495450545154525453545454555456545754585459546054615462546354645465546654675468546954705471547254735474547554765477547854795480548154825483548454855486548754885489549054915492549354945495549654975498549955005501550255035504550555065507550855095510551155125513551455155516551755185519552055215522552355245525552655275528552955305531553255335534553555365537553855395540554155425543554455455546554755485549555055515552555355545555555655575558555955605561556255635564556555665567556855695570557155725573557455755576557755785579558055815582558355845585558655875588558955905591559255935594559555965597559855995600560156025603560456055606560756085609561056115612561356145615561656175618561956205621562256235624562556265627562856295630563156325633563456355636563756385639564056415642564356445645564656475648564956505651565256535654565556565657565856595660566156625663566456655666566756685669567056715672567356745675567656775678567956805681568256835684568556865687568856895690569156925693569456955696569756985699570057015702570357045705570657075708570957105711571257135714571557165717571857195720572157225723572457255726572757285729573057315732573357345735573657375738573957405741574257435744574557465747574857495750575157525753575457555756575757585759576057615762576357645765576657675768576957705771577257735774577557765777577857795780578157825783578457855786578757885789579057915792579357945795579657975798579958005801580258035804580558065807580858095810581158125813581458155816581758185819582058215822582358245825582658275828582958305831583258335834583558365837583858395840584158425843584458455846584758485849585058515852585358545855585658575858585958605861586258635864586558665867586858695870587158725873587458755876587758785879588058815882588358845885588658875888588958905891589258935894589558965897589858995900590159025903590459055906590759085909591059115912591359145915591659175918591959205921592259235924592559265927592859295930593159325933593459355936593759385939594059415942594359445945594659475948594959505951595259535954595559565957595859595960596159625963596459655966596759685969597059715972597359745975597659775978597959805981598259835984598559865987598859895990599159925993599459955996599759985999600060016002600360046005600660076008600960106011601260136014601560166017601860196020602160226023602460256026602760286029603060316032603360346035603660376038603960406041604260436044604560466047604860496050605160526053605460556056605760586059606060616062606360646065606660676068606960706071607260736074607560766077607860796080608160826083608460856086608760886089609060916092609360946095609660976098609961006101610261036104610561066107610861096110611161126113611461156116611761186119612061216122612361246125612661276128612961306131613261336134613561366137613861396140614161426143614461456146614761486149615061516152615361546155615661576158615961606161616261636164616561666167616861696170617161726173617461756176617761786179618061816182618361846185618661876188618961906191619261936194619561966197619861996200620162026203620462056206620762086209621062116212621362146215621662176218621962206221622262236224622562266227622862296230623162326233623462356236623762386239624062416242624362446245624662476248624962506251625262536254625562566257625862596260626162626263626462656266626762686269627062716272627362746275627662776278627962806281628262836284628562866287628862896290629162926293629462956296629762986299630063016302630363046305630663076308630963106311631263136314631563166317631863196320632163226323632463256326632763286329633063316332633363346335633663376338633963406341634263436344634563466347634863496350635163526353635463556356635763586359636063616362636363646365636663676368636963706371637263736374637563766377637863796380638163826383638463856386638763886389639063916392639363946395639663976398639964006401640264036404640564066407640864096410641164126413641464156416641764186419642064216422642364246425642664276428642964306431643264336434643564366437643864396440644164426443644464456446644764486449645064516452645364546455645664576458645964606461646264636464646564666467646864696470647164726473647464756476647764786479648064816482648364846485648664876488648964906491649264936494649564966497649864996500650165026503650465056506650765086509651065116512651365146515651665176518651965206521652265236524652565266527652865296530653165326533653465356536653765386539654065416542654365446545654665476548654965506551655265536554655565566557655865596560656165626563656465656566656765686569657065716572657365746575657665776578657965806581658265836584658565866587658865896590659165926593659465956596659765986599660066016602660366046605660666076608660966106611661266136614661566166617661866196620662166226623662466256626662766286629663066316632663366346635663666376638663966406641664266436644664566466647664866496650665166526653665466556656665766586659666066616662666366646665666666676668666966706671667266736674667566766677667866796680668166826683668466856686668766886689669066916692669366946695669666976698669967006701670267036704670567066707670867096710671167126713671467156716671767186719672067216722672367246725672667276728672967306731673267336734673567366737673867396740674167426743674467456746674767486749675067516752675367546755675667576758675967606761676267636764676567666767676867696770677167726773677467756776677767786779678067816782678367846785678667876788678967906791679267936794679567966797679867996800680168026803680468056806680768086809681068116812681368146815681668176818681968206821682268236824682568266827682868296830683168326833683468356836683768386839684068416842684368446845684668476848684968506851685268536854685568566857685868596860686168626863686468656866686768686869687068716872687368746875687668776878687968806881688268836884688568866887688868896890689168926893689468956896689768986899690069016902690369046905690669076908690969106911691269136914691569166917691869196920692169226923692469256926692769286929693069316932693369346935693669376938693969406941694269436944694569466947694869496950695169526953695469556956695769586959696069616962696369646965696669676968696969706971697269736974697569766977697869796980698169826983698469856986698769886989699069916992699369946995699669976998699970007001700270037004700570067007700870097010701170127013701470157016701770187019702070217022702370247025702670277028702970307031703270337034703570367037703870397040704170427043704470457046704770487049705070517052705370547055705670577058705970607061706270637064706570667067706870697070707170727073707470757076707770787079708070817082708370847085708670877088708970907091709270937094709570967097709870997100710171027103710471057106710771087109711071117112711371147115711671177118711971207121712271237124712571267127712871297130713171327133713471357136713771387139714071417142714371447145714671477148714971507151715271537154715571567157715871597160716171627163716471657166716771687169717071717172717371747175717671777178717971807181718271837184718571867187718871897190719171927193719471957196719771987199720072017202720372047205720672077208720972107211721272137214721572167217721872197220722172227223722472257226722772287229723072317232723372347235723672377238723972407241724272437244724572467247724872497250725172527253725472557256725772587259726072617262726372647265726672677268726972707271727272737274727572767277727872797280728172827283728472857286728772887289729072917292729372947295729672977298729973007301730273037304730573067307730873097310731173127313731473157316731773187319732073217322732373247325732673277328732973307331733273337334733573367337733873397340734173427343734473457346734773487349735073517352735373547355735673577358735973607361736273637364736573667367736873697370737173727373737473757376737773787379738073817382738373847385738673877388738973907391739273937394739573967397739873997400740174027403740474057406740774087409741074117412741374147415741674177418741974207421742274237424742574267427742874297430743174327433743474357436743774387439744074417442744374447445744674477448744974507451745274537454745574567457745874597460746174627463746474657466746774687469747074717472747374747475747674777478747974807481748274837484748574867487748874897490749174927493749474957496749774987499750075017502750375047505750675077508750975107511751275137514751575167517751875197520752175227523752475257526752775287529753075317532753375347535753675377538753975407541754275437544754575467547754875497550755175527553755475557556755775587559756075617562756375647565756675677568756975707571757275737574757575767577757875797580758175827583758475857586758775887589759075917592759375947595759675977598759976007601760276037604760576067607760876097610761176127613761476157616761776187619762076217622762376247625762676277628762976307631763276337634763576367637763876397640764176427643764476457646764776487649765076517652765376547655765676577658765976607661766276637664766576667667766876697670767176727673767476757676767776787679768076817682768376847685768676877688768976907691769276937694769576967697769876997700770177027703770477057706770777087709771077117712771377147715771677177718771977207721772277237724772577267727772877297730773177327733773477357736773777387739774077417742774377447745774677477748774977507751775277537754775577567757775877597760776177627763776477657766776777687769777077717772777377747775777677777778777977807781778277837784778577867787778877897790779177927793779477957796779777987799780078017802780378047805780678077808780978107811781278137814781578167817781878197820782178227823782478257826782778287829783078317832783378347835783678377838783978407841784278437844784578467847784878497850785178527853785478557856785778587859786078617862786378647865786678677868786978707871787278737874787578767877787878797880788178827883788478857886788778887889789078917892789378947895789678977898789979007901790279037904790579067907790879097910791179127913791479157916791779187919792079217922792379247925792679277928792979307931793279337934793579367937793879397940794179427943794479457946794779487949795079517952795379547955795679577958795979607961796279637964796579667967796879697970797179727973797479757976797779787979798079817982798379847985798679877988798979907991799279937994799579967997799879998000800180028003800480058006800780088009801080118012801380148015801680178018801980208021802280238024802580268027802880298030803180328033803480358036803780388039804080418042804380448045804680478048804980508051805280538054805580568057805880598060806180628063806480658066806780688069807080718072807380748075807680778078807980808081808280838084808580868087808880898090809180928093809480958096809780988099810081018102810381048105810681078108810981108111811281138114811581168117811881198120812181228123812481258126812781288129813081318132813381348135813681378138813981408141814281438144814581468147814881498150815181528153815481558156815781588159816081618162816381648165816681678168816981708171817281738174817581768177817881798180818181828183818481858186818781888189819081918192819381948195819681978198819982008201820282038204820582068207820882098210821182128213821482158216821782188219822082218222822382248225822682278228822982308231823282338234823582368237823882398240824182428243824482458246824782488249825082518252825382548255825682578258825982608261826282638264826582668267826882698270827182728273827482758276827782788279828082818282828382848285828682878288828982908291829282938294829582968297829882998300830183028303830483058306830783088309831083118312831383148315831683178318831983208321832283238324832583268327832883298330833183328333833483358336833783388339834083418342834383448345834683478348834983508351835283538354835583568357835883598360836183628363836483658366836783688369837083718372837383748375837683778378837983808381838283838384838583868387838883898390839183928393839483958396839783988399840084018402840384048405840684078408840984108411841284138414841584168417841884198420842184228423842484258426842784288429843084318432843384348435843684378438843984408441844284438444844584468447844884498450845184528453845484558456845784588459846084618462846384648465846684678468846984708471847284738474847584768477847884798480848184828483848484858486848784888489849084918492849384948495849684978498849985008501850285038504850585068507850885098510851185128513851485158516851785188519852085218522852385248525852685278528852985308531853285338534853585368537853885398540854185428543854485458546854785488549855085518552855385548555855685578558855985608561856285638564856585668567856885698570857185728573857485758576857785788579858085818582858385848585858685878588858985908591859285938594859585968597859885998600860186028603860486058606860786088609861086118612861386148615861686178618861986208621862286238624862586268627862886298630863186328633863486358636863786388639864086418642864386448645864686478648864986508651865286538654865586568657865886598660866186628663866486658666866786688669867086718672867386748675867686778678867986808681868286838684868586868687868886898690869186928693869486958696869786988699870087018702870387048705870687078708870987108711871287138714871587168717871887198720872187228723872487258726872787288729873087318732873387348735873687378738873987408741874287438744874587468747874887498750875187528753875487558756875787588759876087618762876387648765876687678768876987708771877287738774877587768777877887798780878187828783878487858786878787888789879087918792879387948795879687978798879988008801880288038804880588068807880888098810881188128813881488158816881788188819882088218822882388248825882688278828882988308831883288338834883588368837883888398840884188428843884488458846884788488849885088518852885388548855885688578858885988608861886288638864886588668867886888698870887188728873887488758876887788788879888088818882888388848885888688878888888988908891889288938894889588968897889888998900890189028903890489058906890789088909891089118912891389148915891689178918891989208921892289238924892589268927892889298930893189328933893489358936893789388939894089418942894389448945894689478948894989508951895289538954895589568957895889598960896189628963896489658966896789688969897089718972897389748975897689778978897989808981898289838984898589868987898889898990899189928993899489958996899789988999900090019002900390049005900690079008900990109011901290139014901590169017901890199020902190229023902490259026902790289029903090319032903390349035903690379038903990409041904290439044904590469047904890499050905190529053905490559056905790589059906090619062906390649065906690679068906990709071907290739074907590769077907890799080908190829083908490859086908790889089909090919092909390949095909690979098909991009101910291039104910591069107910891099110911191129113911491159116911791189119912091219122912391249125912691279128912991309131913291339134913591369137913891399140914191429143914491459146914791489149915091519152915391549155915691579158915991609161916291639164916591669167916891699170917191729173917491759176917791789179918091819182918391849185918691879188918991909191919291939194919591969197919891999200920192029203920492059206920792089209921092119212921392149215921692179218921992209221922292239224922592269227922892299230923192329233923492359236923792389239924092419242924392449245924692479248924992509251925292539254925592569257925892599260926192629263926492659266926792689269927092719272927392749275927692779278927992809281928292839284928592869287928892899290929192929293929492959296929792989299930093019302930393049305930693079308930993109311931293139314931593169317931893199320932193229323932493259326932793289329933093319332933393349335933693379338933993409341934293439344934593469347934893499350935193529353935493559356935793589359936093619362936393649365936693679368936993709371937293739374937593769377937893799380938193829383938493859386938793889389939093919392939393949395939693979398939994009401940294039404940594069407940894099410941194129413941494159416941794189419942094219422942394249425942694279428942994309431943294339434943594369437943894399440944194429443944494459446944794489449945094519452945394549455945694579458945994609461946294639464946594669467946894699470947194729473947494759476947794789479948094819482948394849485948694879488948994909491949294939494949594969497949894999500950195029503950495059506950795089509951095119512951395149515951695179518951995209521952295239524952595269527952895299530953195329533953495359536953795389539954095419542954395449545954695479548954995509551955295539554955595569557955895599560956195629563956495659566956795689569957095719572957395749575957695779578957995809581958295839584958595869587958895899590959195929593959495959596959795989599960096019602960396049605960696079608960996109611961296139614961596169617961896199620962196229623962496259626962796289629963096319632963396349635963696379638963996409641964296439644964596469647964896499650965196529653965496559656965796589659966096619662966396649665966696679668966996709671967296739674967596769677967896799680968196829683968496859686968796889689969096919692969396949695969696979698969997009701970297039704970597069707970897099710971197129713971497159716971797189719972097219722972397249725972697279728972997309731973297339734973597369737973897399740974197429743974497459746974797489749975097519752975397549755975697579758975997609761976297639764976597669767976897699770977197729773977497759776977797789779978097819782978397849785978697879788978997909791979297939794979597969797979897999800980198029803980498059806980798089809981098119812981398149815981698179818981998209821982298239824982598269827982898299830983198329833983498359836983798389839984098419842984398449845984698479848984998509851985298539854985598569857985898599860986198629863986498659866986798689869987098719872987398749875987698779878987998809881988298839884988598869887988898899890989198929893989498959896989798989899990099019902990399049905990699079908990999109911991299139914991599169917991899199920992199229923992499259926992799289929993099319932993399349935993699379938993999409941994299439944994599469947994899499950995199529953995499559956995799589959996099619962996399649965996699679968996999709971997299739974997599769977997899799980998199829983998499859986998799889989999099919992999399949995999699979998999910000100011000210003100041000510006100071000810009100101001110012100131001410015100161001710018100191002010021100221002310024100251002610027100281002910030100311003210033100341003510036100371003810039100401004110042100431004410045100461004710048100491005010051100521005310054100551005610057100581005910060100611006210063100641006510066100671006810069100701007110072100731007410075100761007710078100791008010081100821008310084100851008610087100881008910090100911009210093100941009510096100971009810099101001010110102101031010410105101061010710108101091011010111101121011310114101151011610117101181011910120101211012210123101241012510126101271012810129101301013110132101331013410135101361013710138101391014010141101421014310144101451014610147101481014910150101511015210153101541015510156101571015810159101601016110162101631016410165101661016710168101691017010171101721017310174101751017610177101781017910180101811018210183101841018510186101871018810189101901019110192101931019410195101961019710198101991020010201102021020310204102051020610207102081020910210102111021210213102141021510216102171021810219102201022110222102231022410225102261022710228102291023010231102321023310234102351023610237102381023910240102411024210243102441024510246102471024810249102501025110252102531025410255102561025710258102591026010261102621026310264102651026610267102681026910270102711027210273102741027510276102771027810279102801028110282102831028410285102861028710288102891029010291102921029310294102951029610297102981029910300103011030210303103041030510306103071030810309103101031110312103131031410315103161031710318103191032010321103221032310324103251032610327103281032910330103311033210333103341033510336103371033810339103401034110342103431034410345103461034710348103491035010351103521035310354103551035610357103581035910360103611036210363103641036510366103671036810369103701037110372103731037410375103761037710378103791038010381103821038310384103851038610387103881038910390103911039210393103941039510396103971039810399104001040110402104031040410405104061040710408104091041010411104121041310414104151041610417104181041910420104211042210423104241042510426104271042810429104301043110432104331043410435104361043710438104391044010441104421044310444104451044610447104481044910450104511045210453104541045510456104571045810459104601046110462104631046410465104661046710468104691047010471104721047310474104751047610477104781047910480104811048210483104841048510486104871048810489104901049110492104931049410495104961049710498104991050010501105021050310504105051050610507105081050910510105111051210513105141051510516105171051810519105201052110522105231052410525105261052710528105291053010531105321053310534105351053610537105381053910540105411054210543105441054510546105471054810549105501055110552105531055410555105561055710558105591056010561105621056310564105651056610567105681056910570105711057210573105741057510576105771057810579105801058110582105831058410585105861058710588105891059010591105921059310594105951059610597105981059910600106011060210603106041060510606106071060810609106101061110612106131061410615106161061710618106191062010621106221062310624106251062610627106281062910630106311063210633106341063510636106371063810639106401064110642106431064410645106461064710648106491065010651106521065310654106551065610657106581065910660106611066210663106641066510666106671066810669106701067110672106731067410675106761067710678106791068010681106821068310684106851068610687106881068910690106911069210693106941069510696106971069810699107001070110702107031070410705107061070710708107091071010711107121071310714107151071610717107181071910720107211072210723107241072510726107271072810729107301073110732107331073410735107361073710738107391074010741107421074310744107451074610747107481074910750107511075210753107541075510756107571075810759107601076110762107631076410765107661076710768107691077010771107721077310774107751077610777107781077910780107811078210783107841078510786107871078810789107901079110792107931079410795107961079710798107991080010801108021080310804108051080610807108081080910810108111081210813108141081510816108171081810819108201082110822108231082410825108261082710828108291083010831108321083310834108351083610837108381083910840108411084210843108441084510846108471084810849108501085110852108531085410855108561085710858108591086010861108621086310864108651086610867108681086910870108711087210873108741087510876108771087810879108801088110882108831088410885108861088710888108891089010891108921089310894108951089610897108981089910900109011090210903109041090510906109071090810909109101091110912109131091410915109161091710918109191092010921109221092310924109251092610927109281092910930109311093210933109341093510936109371093810939109401094110942109431094410945109461094710948109491095010951109521095310954109551095610957109581095910960109611096210963109641096510966109671096810969109701097110972109731097410975109761097710978109791098010981109821098310984109851098610987109881098910990109911099210993109941099510996109971099810999110001100111002110031100411005110061100711008110091101011011110121101311014110151101611017110181101911020110211102211023110241102511026110271102811029110301103111032110331103411035110361103711038110391104011041110421104311044110451104611047110481104911050110511105211053110541105511056110571105811059110601106111062110631106411065110661106711068110691107011071110721107311074110751107611077110781107911080110811108211083110841108511086110871108811089110901109111092110931109411095110961109711098110991110011101111021110311104111051110611107111081110911110111111111211113111141111511116111171111811119111201112111122111231112411125111261112711128111291113011131111321113311134111351113611137111381113911140111411114211143111441114511146111471114811149111501115111152111531115411155111561115711158111591116011161111621116311164111651116611167111681116911170111711117211173111741117511176111771117811179111801118111182111831118411185111861118711188111891119011191111921119311194111951119611197111981119911200112011120211203112041120511206112071120811209112101121111212112131121411215112161121711218112191122011221112221122311224112251122611227112281122911230112311123211233112341123511236112371123811239112401124111242112431124411245112461124711248112491125011251112521125311254112551125611257112581125911260112611126211263112641126511266112671126811269112701127111272112731127411275112761127711278112791128011281112821128311284112851128611287112881128911290112911129211293112941129511296112971129811299113001130111302113031130411305113061130711308113091131011311113121131311314113151131611317113181131911320113211132211323113241132511326113271132811329113301133111332113331133411335113361133711338113391134011341113421134311344113451134611347113481134911350113511135211353113541135511356113571135811359113601136111362113631136411365113661136711368113691137011371113721137311374113751137611377113781137911380113811138211383113841138511386113871138811389113901139111392113931139411395113961139711398113991140011401114021140311404114051140611407114081140911410114111141211413114141141511416114171141811419114201142111422114231142411425114261142711428114291143011431114321143311434114351143611437114381143911440114411144211443114441144511446114471144811449114501145111452114531145411455114561145711458114591146011461114621146311464114651146611467114681146911470114711147211473114741147511476114771147811479114801148111482114831148411485114861148711488114891149011491114921149311494114951149611497114981149911500115011150211503115041150511506115071150811509115101151111512115131151411515115161151711518115191152011521115221152311524115251152611527115281152911530115311153211533115341153511536115371153811539115401154111542115431154411545115461154711548115491155011551115521155311554115551155611557115581155911560115611156211563115641156511566115671156811569115701157111572115731157411575115761157711578115791158011581115821158311584115851158611587115881158911590115911159211593115941159511596115971159811599116001160111602116031160411605116061160711608116091161011611116121161311614116151161611617116181161911620116211162211623116241162511626116271162811629116301163111632116331163411635116361163711638116391164011641116421164311644116451164611647116481164911650116511165211653116541165511656116571165811659116601166111662116631166411665116661166711668116691167011671116721167311674116751167611677116781167911680116811168211683116841168511686116871168811689116901169111692116931169411695116961169711698116991170011701117021170311704117051170611707117081170911710117111171211713117141171511716117171171811719117201172111722117231172411725117261172711728117291173011731117321173311734117351173611737117381173911740117411174211743117441174511746117471174811749117501175111752117531175411755117561175711758117591176011761117621176311764117651176611767117681176911770117711177211773117741177511776117771177811779117801178111782117831178411785117861178711788117891179011791117921179311794117951179611797117981179911800118011180211803118041180511806118071180811809118101181111812118131181411815118161181711818118191182011821118221182311824118251182611827118281182911830118311183211833118341183511836118371183811839118401184111842118431184411845118461184711848118491185011851118521185311854118551185611857118581185911860118611186211863118641186511866118671186811869118701187111872118731187411875118761187711878118791188011881118821188311884118851188611887118881188911890118911189211893118941189511896118971189811899119001190111902119031190411905119061190711908119091191011911119121191311914119151191611917119181191911920119211192211923119241192511926119271192811929119301193111932119331193411935119361193711938119391194011941119421194311944119451194611947119481194911950119511195211953119541195511956119571195811959119601196111962119631196411965119661196711968119691197011971119721197311974119751197611977119781197911980119811198211983119841198511986119871198811989119901199111992119931199411995119961199711998119991200012001120021200312004120051200612007120081200912010120111201212013120141201512016120171201812019120201202112022120231202412025120261202712028120291203012031120321203312034120351203612037120381203912040120411204212043120441204512046120471204812049120501205112052120531205412055120561205712058120591206012061120621206312064120651206612067120681206912070120711207212073120741207512076120771207812079120801208112082120831208412085120861208712088120891209012091120921209312094120951209612097120981209912100121011210212103121041210512106121071210812109121101211112112121131211412115121161211712118121191212012121121221212312124121251212612127121281212912130121311213212133121341213512136121371213812139121401214112142121431214412145121461214712148121491215012151121521215312154121551215612157121581215912160121611216212163121641216512166121671216812169121701217112172121731217412175121761217712178121791218012181121821218312184121851218612187121881218912190121911219212193121941219512196121971219812199122001220112202122031220412205122061220712208122091221012211122121221312214122151221612217122181221912220122211222212223122241222512226122271222812229122301223112232122331223412235122361223712238122391224012241122421224312244122451224612247122481224912250122511225212253122541225512256122571225812259122601226112262122631226412265122661226712268122691227012271122721227312274122751227612277122781227912280122811228212283122841228512286122871228812289122901229112292122931229412295122961229712298122991230012301123021230312304123051230612307123081230912310123111231212313123141231512316123171231812319123201232112322123231232412325123261232712328123291233012331123321233312334123351233612337123381233912340123411234212343123441234512346123471234812349123501235112352123531235412355123561235712358123591236012361123621236312364123651236612367123681236912370123711237212373123741237512376123771237812379123801238112382123831238412385123861238712388123891239012391123921239312394123951239612397123981239912400124011240212403124041240512406124071240812409124101241112412124131241412415124161241712418124191242012421124221242312424124251242612427124281242912430124311243212433124341243512436124371243812439124401244112442124431244412445124461244712448124491245012451124521245312454124551245612457124581245912460124611246212463124641246512466124671246812469124701247112472124731247412475124761247712478124791248012481124821248312484124851248612487124881248912490124911249212493124941249512496124971249812499125001250112502125031250412505125061250712508125091251012511125121251312514125151251612517125181251912520125211252212523125241252512526125271252812529125301253112532125331253412535125361253712538125391254012541125421254312544125451254612547125481254912550125511255212553125541255512556125571255812559125601256112562125631256412565125661256712568125691257012571125721257312574125751257612577125781257912580125811258212583125841258512586125871258812589125901259112592125931259412595125961259712598125991260012601126021260312604126051260612607126081260912610126111261212613126141261512616126171261812619126201262112622126231262412625126261262712628126291263012631126321263312634126351263612637126381263912640126411264212643126441264512646126471264812649126501265112652126531265412655126561265712658126591266012661126621266312664126651266612667126681266912670126711267212673126741267512676126771267812679126801268112682126831268412685126861268712688126891269012691126921269312694126951269612697126981269912700127011270212703127041270512706127071270812709127101271112712127131271412715127161271712718127191272012721127221272312724127251272612727127281272912730127311273212733127341273512736127371273812739127401274112742127431274412745127461274712748127491275012751127521275312754127551275612757127581275912760127611276212763127641276512766127671276812769127701277112772127731277412775127761277712778127791278012781127821278312784127851278612787127881278912790127911279212793127941279512796127971279812799128001280112802128031280412805128061280712808128091281012811128121281312814128151281612817128181281912820128211282212823128241282512826128271282812829128301283112832128331283412835128361283712838128391284012841128421284312844128451284612847128481284912850128511285212853128541285512856128571285812859128601286112862128631286412865128661286712868128691287012871128721287312874128751287612877128781287912880128811288212883128841288512886128871288812889128901289112892128931289412895128961289712898128991290012901129021290312904129051290612907129081290912910129111291212913129141291512916129171291812919129201292112922129231292412925129261292712928129291293012931129321293312934129351293612937129381293912940129411294212943129441294512946129471294812949129501295112952129531295412955129561295712958129591296012961129621296312964129651296612967129681296912970129711297212973129741297512976129771297812979129801298112982129831298412985129861298712988129891299012991129921299312994129951299612997129981299913000130011300213003130041300513006130071300813009130101301113012130131301413015130161301713018130191302013021130221302313024130251302613027130281302913030130311303213033130341303513036130371303813039130401304113042130431304413045130461304713048130491305013051130521305313054130551305613057130581305913060130611306213063130641306513066130671306813069130701307113072130731307413075130761307713078130791308013081130821308313084130851308613087130881308913090130911309213093130941309513096130971309813099131001310113102131031310413105131061310713108131091311013111131121311313114131151311613117131181311913120131211312213123131241312513126131271312813129131301313113132131331313413135131361313713138131391314013141131421314313144131451314613147131481314913150131511315213153131541315513156131571315813159131601316113162131631316413165131661316713168131691317013171131721317313174131751317613177131781317913180131811318213183131841318513186131871318813189131901319113192131931319413195131961319713198131991320013201132021320313204132051320613207132081320913210132111321213213132141321513216132171321813219132201322113222132231322413225132261322713228132291323013231132321323313234132351323613237132381323913240132411324213243132441324513246132471324813249132501325113252132531325413255132561325713258132591326013261132621326313264132651326613267132681326913270132711327213273132741327513276132771327813279132801328113282132831328413285132861328713288132891329013291132921329313294132951329613297132981329913300133011330213303133041330513306133071330813309133101331113312133131331413315133161331713318133191332013321133221332313324133251332613327133281332913330133311333213333133341333513336133371333813339133401334113342133431334413345133461334713348133491335013351133521335313354133551335613357133581335913360133611336213363133641336513366133671336813369133701337113372133731337413375133761337713378133791338013381133821338313384133851338613387133881338913390133911339213393133941339513396133971339813399134001340113402134031340413405134061340713408134091341013411134121341313414134151341613417134181341913420134211342213423134241342513426134271342813429134301343113432134331343413435134361343713438134391344013441134421344313444134451344613447134481344913450134511345213453134541345513456134571345813459134601346113462134631346413465134661346713468134691347013471134721347313474134751347613477134781347913480134811348213483134841348513486134871348813489134901349113492134931349413495134961349713498134991350013501135021350313504135051350613507135081350913510135111351213513135141351513516135171351813519135201352113522135231352413525135261352713528135291353013531135321353313534135351353613537135381353913540135411354213543135441354513546135471354813549135501355113552135531355413555135561355713558135591356013561135621356313564135651356613567135681356913570135711357213573135741357513576135771357813579135801358113582135831358413585135861358713588135891359013591135921359313594135951359613597135981359913600136011360213603136041360513606136071360813609136101361113612136131361413615136161361713618136191362013621136221362313624136251362613627136281362913630136311363213633136341363513636136371363813639136401364113642136431364413645136461364713648136491365013651136521365313654136551365613657136581365913660136611366213663136641366513666136671366813669136701367113672136731367413675136761367713678136791368013681136821368313684136851368613687136881368913690136911369213693136941369513696136971369813699137001370113702137031370413705137061370713708137091371013711137121371313714137151371613717137181371913720137211372213723137241372513726137271372813729137301373113732137331373413735137361373713738137391374013741137421374313744137451374613747137481374913750137511375213753137541375513756137571375813759137601376113762137631376413765137661376713768137691377013771137721377313774137751377613777137781377913780137811378213783137841378513786137871378813789137901379113792137931379413795137961379713798137991380013801138021380313804138051380613807138081380913810138111381213813138141381513816138171381813819138201382113822138231382413825138261382713828138291383013831138321383313834138351383613837138381383913840138411384213843138441384513846138471384813849138501385113852138531385413855138561385713858138591386013861138621386313864138651386613867138681386913870138711387213873138741387513876138771387813879138801388113882138831388413885138861388713888138891389013891138921389313894138951389613897138981389913900139011390213903139041390513906139071390813909139101391113912139131391413915139161391713918139191392013921139221392313924139251392613927139281392913930139311393213933139341393513936139371393813939139401394113942139431394413945139461394713948139491395013951139521395313954139551395613957139581395913960139611396213963139641396513966139671396813969139701397113972139731397413975139761397713978139791398013981139821398313984139851398613987139881398913990139911399213993139941399513996139971399813999140001400114002140031400414005140061400714008140091401014011140121401314014140151401614017140181401914020140211402214023140241402514026140271402814029140301403114032140331403414035140361403714038140391404014041140421404314044140451404614047140481404914050140511405214053140541405514056140571405814059140601406114062140631406414065140661406714068140691407014071140721407314074140751407614077140781407914080140811408214083140841408514086140871408814089140901409114092140931409414095140961409714098140991410014101141021410314104141051410614107141081410914110141111411214113141141411514116141171411814119141201412114122141231412414125141261412714128141291413014131141321413314134141351413614137141381413914140141411414214143141441414514146141471414814149141501415114152141531415414155141561415714158141591416014161141621416314164141651416614167141681416914170141711417214173141741417514176141771417814179141801418114182141831418414185141861418714188141891419014191141921419314194141951419614197141981419914200142011420214203142041420514206142071420814209142101421114212142131421414215142161421714218142191422014221142221422314224142251422614227142281422914230142311423214233142341423514236142371423814239142401424114242142431424414245142461424714248142491425014251142521425314254142551425614257142581425914260142611426214263142641426514266142671426814269142701427114272142731427414275142761427714278142791428014281142821428314284142851428614287142881428914290142911429214293142941429514296142971429814299143001430114302143031430414305143061430714308143091431014311143121431314314143151431614317143181431914320143211432214323143241432514326143271432814329143301433114332143331433414335143361433714338143391434014341143421434314344143451434614347143481434914350143511435214353143541435514356143571435814359143601436114362143631436414365143661436714368143691437014371143721437314374143751437614377143781437914380143811438214383143841438514386143871438814389143901439114392143931439414395143961439714398143991440014401144021440314404144051440614407144081440914410144111441214413144141441514416144171441814419144201442114422144231442414425144261442714428144291443014431144321443314434144351443614437144381443914440144411444214443144441444514446144471444814449144501445114452144531445414455144561445714458144591446014461144621446314464144651446614467144681446914470144711447214473144741447514476144771447814479144801448114482144831448414485144861448714488144891449014491144921449314494144951449614497144981449914500145011450214503145041450514506145071450814509145101451114512145131451414515145161451714518145191452014521145221452314524145251452614527145281452914530145311453214533145341453514536145371453814539145401454114542145431454414545145461454714548145491455014551145521455314554145551455614557145581455914560145611456214563145641456514566145671456814569145701457114572145731457414575145761457714578145791458014581145821458314584145851458614587145881458914590145911459214593145941459514596145971459814599146001460114602146031460414605146061460714608146091461014611146121461314614146151461614617146181461914620146211462214623146241462514626146271462814629146301463114632146331463414635146361463714638146391464014641146421464314644146451464614647146481464914650146511465214653146541465514656146571465814659146601466114662146631466414665146661466714668146691467014671146721467314674146751467614677146781467914680146811468214683146841468514686146871468814689146901469114692146931469414695146961469714698146991470014701147021470314704147051470614707147081470914710147111471214713147141471514716147171471814719147201472114722147231472414725147261472714728147291473014731147321473314734147351473614737147381473914740147411474214743147441474514746147471474814749147501475114752147531475414755147561475714758147591476014761147621476314764147651476614767147681476914770147711477214773147741477514776147771477814779147801478114782147831478414785147861478714788147891479014791147921479314794147951479614797147981479914800148011480214803148041480514806148071480814809148101481114812148131481414815148161481714818148191482014821148221482314824148251482614827148281482914830148311483214833148341483514836148371483814839148401484114842148431484414845148461484714848148491485014851148521485314854148551485614857148581485914860148611486214863148641486514866148671486814869148701487114872148731487414875148761487714878148791488014881148821488314884148851488614887148881488914890148911489214893148941489514896148971489814899149001490114902149031490414905149061490714908149091491014911149121491314914149151491614917149181491914920149211492214923149241492514926149271492814929149301493114932149331493414935149361493714938149391494014941149421494314944149451494614947149481494914950149511495214953149541495514956149571495814959149601496114962149631496414965149661496714968149691497014971149721497314974149751497614977149781497914980149811498214983149841498514986149871498814989149901499114992149931499414995149961499714998149991500015001150021500315004150051500615007150081500915010150111501215013150141501515016150171501815019150201502115022150231502415025150261502715028150291503015031150321503315034150351503615037150381503915040150411504215043150441504515046150471504815049150501505115052150531505415055150561505715058150591506015061150621506315064150651506615067150681506915070150711507215073150741507515076150771507815079150801508115082150831508415085150861508715088150891509015091150921509315094150951509615097150981509915100151011510215103151041510515106151071510815109151101511115112151131511415115151161511715118151191512015121151221512315124151251512615127151281512915130151311513215133151341513515136151371513815139151401514115142151431514415145151461514715148151491515015151151521515315154151551515615157151581515915160151611516215163151641516515166151671516815169151701517115172151731517415175151761517715178151791518015181151821518315184151851518615187151881518915190151911519215193151941519515196151971519815199152001520115202152031520415205152061520715208152091521015211152121521315214152151521615217152181521915220152211522215223152241522515226152271522815229152301523115232152331523415235152361523715238152391524015241152421524315244152451524615247152481524915250152511525215253152541525515256152571525815259152601526115262152631526415265152661526715268152691527015271152721527315274152751527615277152781527915280152811528215283152841528515286152871528815289152901529115292152931529415295152961529715298152991530015301153021530315304153051530615307153081530915310153111531215313153141531515316153171531815319153201532115322153231532415325153261532715328153291533015331153321533315334153351533615337153381533915340153411534215343153441534515346153471534815349153501535115352153531535415355153561535715358153591536015361153621536315364153651536615367153681536915370153711537215373153741537515376153771537815379153801538115382153831538415385153861538715388153891539015391153921539315394153951539615397153981539915400154011540215403154041540515406154071540815409154101541115412154131541415415154161541715418154191542015421154221542315424154251542615427154281542915430154311543215433154341543515436154371543815439154401544115442154431544415445154461544715448154491545015451154521545315454154551545615457154581545915460154611546215463154641546515466154671546815469154701547115472154731547415475154761547715478154791548015481154821548315484154851548615487154881548915490154911549215493154941549515496154971549815499155001550115502155031550415505155061550715508155091551015511155121551315514155151551615517155181551915520155211552215523155241552515526155271552815529155301553115532155331553415535155361553715538155391554015541155421554315544155451554615547155481554915550155511555215553155541555515556155571555815559155601556115562155631556415565155661556715568155691557015571155721557315574155751557615577155781557915580155811558215583155841558515586155871558815589155901559115592155931559415595155961559715598155991560015601156021560315604156051560615607156081560915610156111561215613156141561515616156171561815619156201562115622156231562415625156261562715628156291563015631156321563315634156351563615637156381563915640156411564215643156441564515646156471564815649156501565115652156531565415655156561565715658156591566015661156621566315664156651566615667156681566915670156711567215673156741567515676156771567815679156801568115682156831568415685156861568715688156891569015691156921569315694156951569615697156981569915700157011570215703157041570515706157071570815709157101571115712157131571415715157161571715718157191572015721157221572315724157251572615727157281572915730157311573215733157341573515736157371573815739157401574115742157431574415745157461574715748157491575015751157521575315754157551575615757157581575915760157611576215763157641576515766157671576815769157701577115772157731577415775157761577715778157791578015781157821578315784157851578615787157881578915790157911579215793157941579515796157971579815799158001580115802158031580415805158061580715808158091581015811158121581315814158151581615817158181581915820158211582215823158241582515826158271582815829158301583115832158331583415835158361583715838158391584015841158421584315844158451584615847158481584915850158511585215853158541585515856158571585815859158601586115862158631586415865158661586715868158691587015871158721587315874158751587615877158781587915880158811588215883158841588515886158871588815889158901589115892158931589415895158961589715898158991590015901159021590315904159051590615907159081590915910159111591215913159141591515916159171591815919159201592115922159231592415925159261592715928159291593015931159321593315934159351593615937159381593915940159411594215943159441594515946159471594815949159501595115952159531595415955159561595715958159591596015961159621596315964159651596615967159681596915970159711597215973159741597515976159771597815979159801598115982159831598415985159861598715988159891599015991159921599315994159951599615997159981599916000160011600216003160041600516006160071600816009160101601116012160131601416015160161601716018160191602016021160221602316024160251602616027160281602916030160311603216033160341603516036160371603816039160401604116042160431604416045160461604716048160491605016051160521605316054160551605616057160581605916060160611606216063160641606516066160671606816069160701607116072160731607416075160761607716078160791608016081160821608316084160851608616087160881608916090160911609216093160941609516096160971609816099161001610116102161031610416105161061610716108161091611016111161121611316114161151611616117161181611916120161211612216123161241612516126161271612816129161301613116132161331613416135161361613716138161391614016141161421614316144161451614616147161481614916150161511615216153161541615516156161571615816159161601616116162161631616416165161661616716168161691617016171161721617316174161751617616177161781617916180161811618216183161841618516186161871618816189161901619116192161931619416195161961619716198161991620016201162021620316204162051620616207162081620916210162111621216213162141621516216162171621816219162201622116222162231622416225162261622716228162291623016231162321623316234162351623616237162381623916240162411624216243162441624516246162471624816249162501625116252162531625416255162561625716258162591626016261162621626316264162651626616267162681626916270162711627216273162741627516276162771627816279162801628116282162831628416285162861628716288162891629016291162921629316294162951629616297162981629916300163011630216303163041630516306163071630816309163101631116312163131631416315163161631716318163191632016321163221632316324163251632616327163281632916330163311633216333163341633516336163371633816339163401634116342163431634416345163461634716348163491635016351163521635316354163551635616357163581635916360163611636216363163641636516366163671636816369163701637116372163731637416375163761637716378163791638016381163821638316384163851638616387163881638916390163911639216393163941639516396163971639816399164001640116402164031640416405164061640716408164091641016411164121641316414164151641616417164181641916420164211642216423164241642516426164271642816429164301643116432164331643416435164361643716438164391644016441164421644316444164451644616447164481644916450164511645216453164541645516456164571645816459164601646116462164631646416465164661646716468164691647016471164721647316474164751647616477164781647916480164811648216483164841648516486164871648816489164901649116492164931649416495164961649716498164991650016501165021650316504165051650616507165081650916510165111651216513165141651516516165171651816519165201652116522165231652416525165261652716528165291653016531165321653316534165351653616537165381653916540165411654216543165441654516546165471654816549165501655116552165531655416555165561655716558165591656016561165621656316564165651656616567165681656916570165711657216573165741657516576165771657816579165801658116582165831658416585165861658716588165891659016591165921659316594165951659616597165981659916600166011660216603166041660516606166071660816609166101661116612166131661416615166161661716618166191662016621166221662316624166251662616627166281662916630166311663216633166341663516636166371663816639166401664116642166431664416645166461664716648166491665016651166521665316654166551665616657166581665916660166611666216663166641666516666166671666816669166701667116672166731667416675166761667716678166791668016681166821668316684166851668616687166881668916690166911669216693166941669516696166971669816699167001670116702167031670416705167061670716708167091671016711167121671316714167151671616717167181671916720167211672216723167241672516726167271672816729167301673116732167331673416735167361673716738167391674016741167421674316744167451674616747167481674916750167511675216753167541675516756167571675816759167601676116762167631676416765167661676716768167691677016771167721677316774167751677616777167781677916780167811678216783167841678516786167871678816789167901679116792167931679416795167961679716798167991680016801168021680316804168051680616807168081680916810168111681216813168141681516816168171681816819168201682116822168231682416825168261682716828168291683016831168321683316834168351683616837168381683916840168411684216843168441684516846168471684816849168501685116852168531685416855168561685716858168591686016861168621686316864168651686616867168681686916870168711687216873168741687516876168771687816879168801688116882168831688416885168861688716888168891689016891168921689316894168951689616897168981689916900169011690216903169041690516906169071690816909169101691116912169131691416915169161691716918169191692016921169221692316924169251692616927169281692916930169311693216933169341693516936169371693816939169401694116942169431694416945169461694716948169491695016951169521695316954169551695616957169581695916960169611696216963169641696516966169671696816969169701697116972169731697416975169761697716978169791698016981169821698316984169851698616987169881698916990169911699216993169941699516996169971699816999170001700117002170031700417005170061700717008170091701017011170121701317014170151701617017170181701917020170211702217023170241702517026170271702817029170301703117032170331703417035170361703717038170391704017041170421704317044170451704617047170481704917050170511705217053170541705517056170571705817059170601706117062170631706417065170661706717068170691707017071170721707317074170751707617077170781707917080170811708217083170841708517086170871708817089170901709117092170931709417095170961709717098170991710017101171021710317104171051710617107171081710917110171111711217113171141711517116171171711817119171201712117122171231712417125171261712717128171291713017131171321713317134171351713617137171381713917140171411714217143171441714517146171471714817149171501715117152171531715417155171561715717158171591716017161171621716317164171651716617167171681716917170171711717217173171741717517176171771717817179171801718117182171831718417185171861718717188171891719017191171921719317194171951719617197171981719917200172011720217203172041720517206172071720817209172101721117212172131721417215172161721717218172191722017221172221722317224172251722617227172281722917230172311723217233172341723517236172371723817239172401724117242172431724417245172461724717248172491725017251172521725317254172551725617257172581725917260172611726217263172641726517266172671726817269172701727117272172731727417275172761727717278172791728017281172821728317284172851728617287172881728917290172911729217293172941729517296172971729817299173001730117302173031730417305173061730717308173091731017311173121731317314173151731617317173181731917320173211732217323173241732517326173271732817329173301733117332173331733417335173361733717338173391734017341173421734317344173451734617347173481734917350173511735217353173541735517356173571735817359173601736117362173631736417365173661736717368173691737017371173721737317374173751737617377173781737917380173811738217383173841738517386173871738817389173901739117392173931739417395173961739717398173991740017401174021740317404174051740617407174081740917410174111741217413174141741517416174171741817419174201742117422174231742417425174261742717428174291743017431174321743317434174351743617437174381743917440174411744217443174441744517446174471744817449174501745117452174531745417455174561745717458174591746017461174621746317464174651746617467174681746917470174711747217473174741747517476174771747817479174801748117482174831748417485174861748717488174891749017491174921749317494174951749617497174981749917500175011750217503175041750517506175071750817509175101751117512175131751417515175161751717518175191752017521175221752317524175251752617527175281752917530175311753217533175341753517536175371753817539175401754117542175431754417545175461754717548175491755017551175521755317554175551755617557175581755917560175611756217563175641756517566175671756817569175701757117572175731757417575175761757717578175791758017581175821758317584175851758617587175881758917590175911759217593175941759517596175971759817599176001760117602176031760417605176061760717608176091761017611176121761317614176151761617617176181761917620176211762217623176241762517626176271762817629176301763117632176331763417635176361763717638176391764017641176421764317644176451764617647176481764917650176511765217653176541765517656176571765817659176601766117662176631766417665176661766717668176691767017671176721767317674176751767617677176781767917680176811768217683176841768517686176871768817689176901769117692176931769417695176961769717698176991770017701177021770317704177051770617707177081770917710177111771217713177141771517716177171771817719177201772117722177231772417725177261772717728177291773017731177321773317734177351773617737177381773917740177411774217743177441774517746177471774817749177501775117752177531775417755177561775717758177591776017761177621776317764177651776617767177681776917770177711777217773177741777517776177771777817779177801778117782177831778417785177861778717788177891779017791177921779317794177951779617797177981779917800178011780217803178041780517806178071780817809178101781117812178131781417815178161781717818178191782017821178221782317824178251782617827178281782917830178311783217833178341783517836178371783817839178401784117842178431784417845178461784717848178491785017851178521785317854178551785617857178581785917860178611786217863178641786517866178671786817869178701787117872178731787417875178761787717878178791788017881178821788317884178851788617887178881788917890178911789217893178941789517896178971789817899179001790117902179031790417905179061790717908179091791017911179121791317914179151791617917179181791917920179211792217923179241792517926179271792817929179301793117932179331793417935179361793717938179391794017941179421794317944179451794617947179481794917950179511795217953179541795517956179571795817959179601796117962179631796417965179661796717968179691797017971179721797317974179751797617977179781797917980179811798217983179841798517986179871798817989179901799117992179931799417995179961799717998179991800018001180021800318004180051800618007180081800918010180111801218013180141801518016180171801818019180201802118022180231802418025180261802718028180291803018031180321803318034180351803618037180381803918040180411804218043180441804518046180471804818049180501805118052180531805418055180561805718058180591806018061180621806318064180651806618067180681806918070180711807218073180741807518076180771807818079180801808118082180831808418085180861808718088180891809018091180921809318094180951809618097180981809918100181011810218103181041810518106181071810818109181101811118112181131811418115181161811718118181191812018121181221812318124181251812618127181281812918130181311813218133181341813518136181371813818139181401814118142181431814418145181461814718148181491815018151181521815318154181551815618157181581815918160181611816218163181641816518166181671816818169181701817118172181731817418175181761817718178181791818018181181821818318184181851818618187181881818918190181911819218193181941819518196181971819818199182001820118202182031820418205182061820718208182091821018211182121821318214182151821618217182181821918220182211822218223182241822518226182271822818229182301823118232182331823418235182361823718238182391824018241182421824318244182451824618247182481824918250182511825218253182541825518256182571825818259182601826118262182631826418265182661826718268182691827018271182721827318274182751827618277182781827918280182811828218283182841828518286182871828818289182901829118292182931829418295182961829718298182991830018301183021830318304183051830618307183081830918310183111831218313183141831518316183171831818319183201832118322183231832418325183261832718328183291833018331183321833318334183351833618337183381833918340183411834218343183441834518346183471834818349183501835118352183531835418355183561835718358183591836018361183621836318364183651836618367183681836918370183711837218373183741837518376183771837818379183801838118382183831838418385183861838718388183891839018391183921839318394183951839618397183981839918400184011840218403184041840518406184071840818409184101841118412184131841418415184161841718418184191842018421184221842318424184251842618427184281842918430184311843218433184341843518436184371843818439184401844118442184431844418445184461844718448184491845018451184521845318454184551845618457184581845918460184611846218463184641846518466184671846818469184701847118472184731847418475184761847718478184791848018481184821848318484184851848618487184881848918490184911849218493184941849518496184971849818499185001850118502185031850418505185061850718508185091851018511185121851318514185151851618517185181851918520185211852218523185241852518526185271852818529185301853118532185331853418535185361853718538185391854018541185421854318544185451854618547185481854918550185511855218553185541855518556185571855818559185601856118562185631856418565185661856718568185691857018571185721857318574185751857618577185781857918580185811858218583185841858518586185871858818589185901859118592185931859418595185961859718598185991860018601186021860318604186051860618607186081860918610186111861218613186141861518616186171861818619186201862118622186231862418625186261862718628186291863018631186321863318634186351863618637186381863918640186411864218643186441864518646186471864818649186501865118652186531865418655186561865718658186591866018661186621866318664186651866618667186681866918670186711867218673186741867518676186771867818679186801868118682186831868418685186861868718688186891869018691186921869318694186951869618697186981869918700187011870218703187041870518706187071870818709187101871118712187131871418715187161871718718187191872018721187221872318724187251872618727187281872918730187311873218733187341873518736187371873818739187401874118742187431874418745187461874718748187491875018751187521875318754187551875618757187581875918760187611876218763187641876518766187671876818769187701877118772187731877418775187761877718778187791878018781187821878318784187851878618787187881878918790187911879218793187941879518796187971879818799188001880118802188031880418805188061880718808188091881018811188121881318814188151881618817188181881918820188211882218823188241882518826188271882818829188301883118832188331883418835188361883718838188391884018841188421884318844188451884618847188481884918850188511885218853188541885518856188571885818859188601886118862188631886418865188661886718868188691887018871188721887318874188751887618877188781887918880188811888218883188841888518886188871888818889188901889118892188931889418895188961889718898188991890018901189021890318904189051890618907189081890918910189111891218913189141891518916189171891818919189201892118922189231892418925189261892718928189291893018931189321893318934189351893618937189381893918940189411894218943189441894518946189471894818949189501895118952189531895418955189561895718958189591896018961189621896318964189651896618967189681896918970189711897218973189741897518976189771897818979189801898118982189831898418985189861898718988189891899018991189921899318994189951899618997189981899919000190011900219003190041900519006190071900819009190101901119012190131901419015190161901719018190191902019021190221902319024190251902619027190281902919030190311903219033190341903519036190371903819039190401904119042190431904419045190461904719048190491905019051190521905319054190551905619057190581905919060190611906219063190641906519066190671906819069190701907119072190731907419075190761907719078190791908019081190821908319084190851908619087190881908919090190911909219093190941909519096190971909819099191001910119102191031910419105191061910719108191091911019111191121911319114191151911619117191181911919120191211912219123191241912519126191271912819129191301913119132191331913419135191361913719138191391914019141191421914319144191451914619147191481914919150191511915219153191541915519156191571915819159191601916119162191631916419165191661916719168191691917019171191721917319174191751917619177191781917919180191811918219183191841918519186191871918819189191901919119192191931919419195191961919719198191991920019201192021920319204192051920619207192081920919210192111921219213192141921519216192171921819219192201922119222192231922419225192261922719228192291923019231192321923319234192351923619237192381923919240192411924219243192441924519246192471924819249192501925119252192531925419255192561925719258192591926019261192621926319264192651926619267192681926919270192711927219273192741927519276192771927819279192801928119282192831928419285192861928719288192891929019291192921929319294192951929619297192981929919300193011930219303193041930519306193071930819309193101931119312193131931419315193161931719318193191932019321193221932319324193251932619327193281932919330193311933219333193341933519336193371933819339193401934119342193431934419345193461934719348193491935019351193521935319354193551935619357193581935919360193611936219363193641936519366193671936819369193701937119372193731937419375193761937719378193791938019381193821938319384193851938619387193881938919390193911939219393193941939519396193971939819399194001940119402194031940419405194061940719408194091941019411194121941319414194151941619417194181941919420194211942219423194241942519426194271942819429194301943119432194331943419435194361943719438194391944019441194421944319444194451944619447194481944919450194511945219453194541945519456194571945819459194601946119462194631946419465194661946719468194691947019471194721947319474194751947619477194781947919480194811948219483194841948519486194871948819489194901949119492194931949419495194961949719498194991950019501195021950319504195051950619507195081950919510195111951219513195141951519516195171951819519195201952119522195231952419525195261952719528195291953019531195321953319534195351953619537195381953919540195411954219543195441954519546195471954819549195501955119552195531955419555195561955719558195591956019561195621956319564195651956619567195681956919570195711957219573195741957519576195771957819579195801958119582195831958419585195861958719588195891959019591195921959319594195951959619597195981959919600196011960219603196041960519606196071960819609196101961119612196131961419615196161961719618196191962019621196221962319624196251962619627196281962919630196311963219633196341963519636196371963819639196401964119642196431964419645196461964719648196491965019651196521965319654196551965619657196581965919660196611966219663196641966519666196671966819669196701967119672196731967419675196761967719678196791968019681196821968319684196851968619687196881968919690196911969219693196941969519696196971969819699197001970119702197031970419705197061970719708197091971019711197121971319714197151971619717197181971919720197211972219723197241972519726197271972819729197301973119732197331973419735197361973719738197391974019741197421974319744197451974619747197481974919750197511975219753197541975519756197571975819759197601976119762197631976419765197661976719768197691977019771197721977319774197751977619777197781977919780197811978219783197841978519786197871978819789197901979119792197931979419795197961979719798197991980019801198021980319804198051980619807198081980919810198111981219813198141981519816198171981819819198201982119822198231982419825198261982719828198291983019831198321983319834198351983619837198381983919840198411984219843198441984519846198471984819849198501985119852198531985419855198561985719858198591986019861198621986319864198651986619867198681986919870198711987219873198741987519876198771987819879198801988119882198831988419885198861988719888198891989019891198921989319894198951989619897198981989919900199011990219903199041990519906199071990819909199101991119912199131991419915199161991719918199191992019921199221992319924199251992619927199281992919930199311993219933199341993519936199371993819939199401994119942199431994419945199461994719948199491995019951199521995319954199551995619957199581995919960199611996219963199641996519966199671996819969199701997119972199731997419975199761997719978199791998019981199821998319984199851998619987199881998919990199911999219993199941999519996199971999819999200002000120002200032000420005200062000720008200092001020011200122001320014200152001620017200182001920020200212002220023200242002520026200272002820029200302003120032200332003420035200362003720038200392004020041200422004320044200452004620047200482004920050200512005220053200542005520056200572005820059200602006120062200632006420065200662006720068200692007020071200722007320074200752007620077200782007920080200812008220083200842008520086200872008820089200902009120092200932009420095200962009720098200992010020101201022010320104201052010620107201082010920110201112011220113201142011520116201172011820119201202012120122201232012420125201262012720128201292013020131201322013320134201352013620137201382013920140201412014220143201442014520146201472014820149201502015120152201532015420155201562015720158201592016020161201622016320164201652016620167201682016920170201712017220173201742017520176201772017820179201802018120182201832018420185201862018720188201892019020191201922019320194201952019620197201982019920200202012020220203202042020520206202072020820209202102021120212202132021420215202162021720218202192022020221202222022320224202252022620227202282022920230202312023220233202342023520236202372023820239202402024120242202432024420245202462024720248202492025020251202522025320254202552025620257202582025920260202612026220263202642026520266202672026820269202702027120272202732027420275202762027720278202792028020281202822028320284202852028620287202882028920290202912029220293202942029520296202972029820299203002030120302203032030420305203062030720308203092031020311203122031320314203152031620317203182031920320203212032220323203242032520326203272032820329203302033120332203332033420335203362033720338203392034020341203422034320344203452034620347203482034920350203512035220353203542035520356203572035820359203602036120362203632036420365203662036720368203692037020371203722037320374203752037620377203782037920380203812038220383203842038520386203872038820389203902039120392203932039420395203962039720398203992040020401204022040320404204052040620407204082040920410204112041220413204142041520416204172041820419204202042120422204232042420425204262042720428204292043020431204322043320434204352043620437204382043920440204412044220443204442044520446204472044820449204502045120452204532045420455204562045720458204592046020461204622046320464204652046620467204682046920470204712047220473204742047520476204772047820479204802048120482204832048420485204862048720488204892049020491204922049320494204952049620497204982049920500205012050220503205042050520506205072050820509205102051120512205132051420515205162051720518205192052020521205222052320524205252052620527205282052920530205312053220533205342053520536205372053820539205402054120542205432054420545205462054720548205492055020551205522055320554205552055620557205582055920560205612056220563205642056520566205672056820569205702057120572205732057420575205762057720578205792058020581205822058320584205852058620587205882058920590205912059220593205942059520596205972059820599206002060120602206032060420605206062060720608206092061020611206122061320614206152061620617206182061920620206212062220623206242062520626206272062820629206302063120632206332063420635206362063720638206392064020641206422064320644206452064620647206482064920650206512065220653206542065520656206572065820659206602066120662206632066420665206662066720668206692067020671206722067320674206752067620677206782067920680206812068220683206842068520686206872068820689206902069120692206932069420695206962069720698206992070020701207022070320704207052070620707207082070920710207112071220713207142071520716207172071820719207202072120722207232072420725207262072720728207292073020731207322073320734207352073620737207382073920740207412074220743207442074520746207472074820749207502075120752207532075420755207562075720758207592076020761207622076320764207652076620767207682076920770207712077220773207742077520776207772077820779207802078120782207832078420785207862078720788207892079020791207922079320794207952079620797207982079920800208012080220803208042080520806208072080820809208102081120812208132081420815208162081720818208192082020821208222082320824208252082620827208282082920830208312083220833208342083520836208372083820839208402084120842208432084420845208462084720848208492085020851208522085320854208552085620857208582085920860208612086220863208642086520866208672086820869208702087120872208732087420875208762087720878208792088020881208822088320884208852088620887208882088920890208912089220893208942089520896208972089820899209002090120902209032090420905209062090720908209092091020911209122091320914209152091620917209182091920920209212092220923209242092520926209272092820929209302093120932209332093420935209362093720938209392094020941209422094320944209452094620947209482094920950209512095220953209542095520956209572095820959209602096120962209632096420965209662096720968209692097020971209722097320974209752097620977209782097920980209812098220983209842098520986209872098820989209902099120992209932099420995209962099720998209992100021001210022100321004210052100621007210082100921010210112101221013210142101521016210172101821019210202102121022210232102421025210262102721028210292103021031210322103321034210352103621037210382103921040210412104221043210442104521046210472104821049210502105121052210532105421055210562105721058210592106021061210622106321064210652106621067210682106921070210712107221073210742107521076210772107821079210802108121082210832108421085210862108721088210892109021091210922109321094210952109621097210982109921100211012110221103211042110521106211072110821109211102111121112211132111421115211162111721118211192112021121211222112321124211252112621127211282112921130211312113221133211342113521136211372113821139211402114121142211432114421145211462114721148211492115021151211522115321154211552115621157211582115921160211612116221163211642116521166211672116821169211702117121172211732117421175211762117721178211792118021181211822118321184211852118621187211882118921190211912119221193211942119521196211972119821199212002120121202212032120421205212062120721208212092121021211212122121321214212152121621217212182121921220212212122221223212242122521226212272122821229212302123121232212332123421235212362123721238212392124021241212422124321244212452124621247212482124921250212512125221253212542125521256212572125821259212602126121262212632126421265212662126721268212692127021271212722127321274212752127621277212782127921280212812128221283212842128521286212872128821289212902129121292212932129421295212962129721298212992130021301213022130321304213052130621307213082130921310213112131221313213142131521316213172131821319213202132121322213232132421325213262132721328213292133021331213322133321334213352133621337213382133921340213412134221343213442134521346213472134821349213502135121352213532135421355213562135721358213592136021361213622136321364213652136621367213682136921370213712137221373213742137521376213772137821379213802138121382213832138421385213862138721388213892139021391213922139321394213952139621397213982139921400214012140221403214042140521406214072140821409214102141121412214132141421415214162141721418214192142021421214222142321424214252142621427214282142921430214312143221433214342143521436214372143821439214402144121442214432144421445214462144721448214492145021451214522145321454214552145621457214582145921460214612146221463214642146521466214672146821469214702147121472214732147421475214762147721478214792148021481214822148321484214852148621487214882148921490214912149221493214942149521496214972149821499215002150121502215032150421505215062150721508215092151021511215122151321514215152151621517215182151921520215212152221523215242152521526215272152821529215302153121532215332153421535215362153721538215392154021541215422154321544215452154621547215482154921550215512155221553215542155521556215572155821559215602156121562215632156421565215662156721568215692157021571215722157321574215752157621577215782157921580215812158221583215842158521586215872158821589215902159121592215932159421595215962159721598215992160021601216022160321604216052160621607216082160921610216112161221613216142161521616216172161821619216202162121622216232162421625216262162721628216292163021631216322163321634216352163621637216382163921640216412164221643216442164521646216472164821649216502165121652216532165421655216562165721658216592166021661216622166321664216652166621667216682166921670216712167221673216742167521676216772167821679216802168121682216832168421685216862168721688216892169021691216922169321694216952169621697216982169921700217012170221703217042170521706217072170821709217102171121712217132171421715217162171721718217192172021721217222172321724217252172621727217282172921730217312173221733217342173521736217372173821739217402174121742217432174421745217462174721748217492175021751217522175321754217552175621757217582175921760217612176221763217642176521766217672176821769217702177121772217732177421775217762177721778217792178021781217822178321784217852178621787217882178921790217912179221793217942179521796217972179821799218002180121802218032180421805218062180721808218092181021811218122181321814218152181621817218182181921820218212182221823218242182521826218272182821829218302183121832218332183421835218362183721838218392184021841218422184321844218452184621847218482184921850218512185221853218542185521856218572185821859218602186121862218632186421865218662186721868218692187021871218722187321874218752187621877218782187921880218812188221883218842188521886218872188821889218902189121892218932189421895218962189721898218992190021901219022190321904219052190621907219082190921910219112191221913219142191521916219172191821919219202192121922219232192421925219262192721928219292193021931219322193321934219352193621937219382193921940219412194221943219442194521946219472194821949219502195121952219532195421955219562195721958219592196021961219622196321964219652196621967219682196921970219712197221973219742197521976219772197821979219802198121982219832198421985219862198721988219892199021991219922199321994219952199621997219982199922000220012200222003220042200522006220072200822009220102201122012220132201422015220162201722018220192202022021220222202322024220252202622027220282202922030220312203222033220342203522036220372203822039220402204122042220432204422045220462204722048220492205022051220522205322054220552205622057220582205922060220612206222063220642206522066220672206822069220702207122072220732207422075220762207722078220792208022081220822208322084220852208622087220882208922090220912209222093220942209522096220972209822099221002210122102221032210422105221062210722108221092211022111221122211322114221152211622117221182211922120221212212222123221242212522126221272212822129221302213122132221332213422135221362213722138221392214022141221422214322144221452214622147221482214922150221512215222153221542215522156221572215822159221602216122162221632216422165221662216722168221692217022171221722217322174221752217622177221782217922180221812218222183221842218522186221872218822189221902219122192221932219422195221962219722198221992220022201222022220322204222052220622207222082220922210222112221222213222142221522216222172221822219222202222122222222232222422225222262222722228222292223022231222322223322234222352223622237222382223922240222412224222243222442224522246222472224822249222502225122252222532225422255222562225722258222592226022261222622226322264222652226622267222682226922270222712227222273222742227522276222772227822279222802228122282222832228422285222862228722288222892229022291222922229322294222952229622297222982229922300223012230222303223042230522306223072230822309223102231122312223132231422315223162231722318223192232022321223222232322324223252232622327223282232922330223312233222333223342233522336223372233822339223402234122342223432234422345223462234722348223492235022351223522235322354223552235622357223582235922360223612236222363223642236522366223672236822369223702237122372223732237422375223762237722378223792238022381223822238322384223852238622387223882238922390223912239222393223942239522396223972239822399224002240122402224032240422405224062240722408224092241022411224122241322414224152241622417224182241922420224212242222423224242242522426224272242822429224302243122432224332243422435224362243722438224392244022441224422244322444224452244622447224482244922450224512245222453224542245522456224572245822459224602246122462224632246422465224662246722468224692247022471224722247322474224752247622477224782247922480224812248222483224842248522486224872248822489224902249122492224932249422495224962249722498224992250022501225022250322504225052250622507225082250922510225112251222513225142251522516225172251822519225202252122522225232252422525225262252722528225292253022531225322253322534225352253622537225382253922540225412254222543225442254522546225472254822549225502255122552225532255422555225562255722558225592256022561225622256322564225652256622567225682256922570225712257222573225742257522576225772257822579225802258122582225832258422585225862258722588225892259022591225922259322594225952259622597225982259922600226012260222603226042260522606226072260822609226102261122612226132261422615226162261722618226192262022621226222262322624226252262622627226282262922630226312263222633226342263522636226372263822639226402264122642226432264422645226462264722648226492265022651226522265322654226552265622657226582265922660226612266222663226642266522666226672266822669226702267122672226732267422675226762267722678226792268022681226822268322684226852268622687226882268922690226912269222693226942269522696226972269822699227002270122702227032270422705227062270722708227092271022711227122271322714227152271622717227182271922720227212272222723227242272522726227272272822729227302273122732227332273422735227362273722738227392274022741227422274322744227452274622747227482274922750227512275222753227542275522756227572275822759227602276122762227632276422765227662276722768227692277022771227722277322774227752277622777227782277922780227812278222783227842278522786227872278822789227902279122792227932279422795227962279722798227992280022801228022280322804228052280622807228082280922810228112281222813228142281522816228172281822819228202282122822228232282422825228262282722828228292283022831228322283322834228352283622837228382283922840228412284222843228442284522846228472284822849228502285122852228532285422855228562285722858228592286022861228622286322864228652286622867228682286922870228712287222873228742287522876228772287822879228802288122882228832288422885228862288722888228892289022891228922289322894228952289622897228982289922900229012290222903229042290522906229072290822909229102291122912229132291422915229162291722918229192292022921229222292322924229252292622927229282292922930229312293222933229342293522936229372293822939229402294122942229432294422945229462294722948229492295022951229522295322954229552295622957229582295922960229612296222963229642296522966229672296822969229702297122972229732297422975229762297722978229792298022981229822298322984229852298622987229882298922990229912299222993229942299522996229972299822999230002300123002230032300423005230062300723008230092301023011230122301323014230152301623017230182301923020230212302223023230242302523026230272302823029230302303123032230332303423035230362303723038230392304023041230422304323044230452304623047230482304923050230512305223053230542305523056230572305823059230602306123062230632306423065230662306723068230692307023071230722307323074230752307623077230782307923080230812308223083230842308523086230872308823089230902309123092230932309423095230962309723098230992310023101231022310323104231052310623107231082310923110231112311223113231142311523116231172311823119231202312123122231232312423125231262312723128231292313023131231322313323134231352313623137231382313923140231412314223143231442314523146231472314823149231502315123152231532315423155231562315723158231592316023161231622316323164231652316623167231682316923170231712317223173231742317523176231772317823179231802318123182231832318423185231862318723188231892319023191231922319323194231952319623197231982319923200232012320223203232042320523206232072320823209232102321123212232132321423215232162321723218232192322023221232222322323224232252322623227232282322923230232312323223233232342323523236232372323823239232402324123242232432324423245232462324723248232492325023251232522325323254232552325623257232582325923260232612326223263232642326523266232672326823269232702327123272232732327423275232762327723278232792328023281232822328323284232852328623287232882328923290232912329223293232942329523296232972329823299233002330123302233032330423305233062330723308233092331023311233122331323314233152331623317233182331923320233212332223323233242332523326233272332823329233302333123332233332333423335233362333723338233392334023341233422334323344233452334623347233482334923350233512335223353233542335523356233572335823359233602336123362233632336423365233662336723368233692337023371233722337323374233752337623377233782337923380233812338223383233842338523386233872338823389233902339123392233932339423395233962339723398233992340023401234022340323404234052340623407234082340923410234112341223413234142341523416234172341823419234202342123422234232342423425234262342723428234292343023431234322343323434234352343623437234382343923440234412344223443234442344523446234472344823449234502345123452234532345423455234562345723458234592346023461234622346323464234652346623467234682346923470234712347223473234742347523476234772347823479234802348123482234832348423485234862348723488234892349023491234922349323494234952349623497234982349923500235012350223503235042350523506235072350823509235102351123512235132351423515235162351723518235192352023521235222352323524235252352623527235282352923530235312353223533235342353523536235372353823539235402354123542235432354423545235462354723548235492355023551235522355323554235552355623557235582355923560235612356223563235642356523566235672356823569235702357123572235732357423575235762357723578235792358023581235822358323584235852358623587235882358923590235912359223593235942359523596235972359823599236002360123602236032360423605236062360723608236092361023611236122361323614236152361623617236182361923620236212362223623236242362523626236272362823629236302363123632236332363423635236362363723638236392364023641236422364323644236452364623647236482364923650236512365223653236542365523656236572365823659236602366123662236632366423665236662366723668236692367023671236722367323674236752367623677236782367923680236812368223683236842368523686236872368823689236902369123692236932369423695236962369723698236992370023701237022370323704237052370623707237082370923710237112371223713237142371523716237172371823719237202372123722237232372423725237262372723728237292373023731237322373323734237352373623737237382373923740237412374223743237442374523746237472374823749237502375123752237532375423755237562375723758237592376023761237622376323764237652376623767237682376923770237712377223773237742377523776237772377823779237802378123782237832378423785237862378723788237892379023791237922379323794237952379623797237982379923800238012380223803238042380523806238072380823809238102381123812238132381423815238162381723818238192382023821238222382323824238252382623827238282382923830238312383223833238342383523836238372383823839238402384123842238432384423845238462384723848238492385023851238522385323854238552385623857238582385923860238612386223863238642386523866238672386823869238702387123872238732387423875238762387723878238792388023881238822388323884238852388623887238882388923890238912389223893238942389523896238972389823899239002390123902239032390423905239062390723908239092391023911239122391323914239152391623917239182391923920239212392223923239242392523926239272392823929239302393123932239332393423935239362393723938239392394023941239422394323944239452394623947239482394923950239512395223953239542395523956239572395823959239602396123962239632396423965239662396723968239692397023971239722397323974239752397623977239782397923980239812398223983239842398523986239872398823989239902399123992239932399423995239962399723998239992400024001240022400324004240052400624007240082400924010240112401224013240142401524016240172401824019240202402124022240232402424025240262402724028240292403024031240322403324034240352403624037240382403924040240412404224043240442404524046240472404824049240502405124052240532405424055240562405724058240592406024061240622406324064240652406624067240682406924070240712407224073240742407524076240772407824079240802408124082240832408424085240862408724088240892409024091240922409324094240952409624097240982409924100241012410224103241042410524106241072410824109241102411124112241132411424115241162411724118241192412024121241222412324124241252412624127241282412924130241312413224133241342413524136241372413824139241402414124142241432414424145241462414724148241492415024151241522415324154241552415624157241582415924160241612416224163241642416524166241672416824169241702417124172241732417424175241762417724178241792418024181241822418324184241852418624187241882418924190241912419224193241942419524196241972419824199242002420124202242032420424205242062420724208242092421024211242122421324214242152421624217242182421924220242212422224223242242422524226242272422824229242302423124232242332423424235242362423724238242392424024241242422424324244242452424624247242482424924250242512425224253242542425524256242572425824259242602426124262242632426424265242662426724268242692427024271242722427324274242752427624277242782427924280242812428224283242842428524286242872428824289242902429124292242932429424295242962429724298242992430024301243022430324304243052430624307243082430924310243112431224313243142431524316243172431824319243202432124322243232432424325243262432724328243292433024331243322433324334243352433624337243382433924340243412434224343243442434524346243472434824349243502435124352243532435424355243562435724358243592436024361243622436324364243652436624367243682436924370243712437224373243742437524376243772437824379243802438124382243832438424385243862438724388243892439024391243922439324394243952439624397243982439924400244012440224403244042440524406244072440824409244102441124412244132441424415244162441724418244192442024421244222442324424244252442624427244282442924430244312443224433244342443524436244372443824439244402444124442244432444424445244462444724448244492445024451244522445324454244552445624457244582445924460244612446224463244642446524466244672446824469244702447124472244732447424475244762447724478244792448024481244822448324484244852448624487244882448924490244912449224493244942449524496244972449824499245002450124502245032450424505245062450724508245092451024511245122451324514245152451624517245182451924520245212452224523245242452524526245272452824529245302453124532245332453424535245362453724538245392454024541245422454324544245452454624547245482454924550245512455224553245542455524556245572455824559245602456124562245632456424565245662456724568245692457024571245722457324574245752457624577245782457924580245812458224583245842458524586245872458824589245902459124592245932459424595245962459724598245992460024601246022460324604246052460624607246082460924610246112461224613246142461524616246172461824619246202462124622246232462424625246262462724628246292463024631246322463324634246352463624637246382463924640246412464224643246442464524646246472464824649246502465124652246532465424655246562465724658246592466024661246622466324664246652466624667246682466924670246712467224673246742467524676246772467824679246802468124682246832468424685246862468724688246892469024691246922469324694246952469624697246982469924700247012470224703247042470524706247072470824709247102471124712247132471424715247162471724718247192472024721247222472324724247252472624727247282472924730247312473224733247342473524736247372473824739247402474124742247432474424745247462474724748247492475024751247522475324754247552475624757247582475924760247612476224763247642476524766247672476824769247702477124772247732477424775247762477724778247792478024781247822478324784247852478624787247882478924790247912479224793247942479524796247972479824799248002480124802248032480424805248062480724808248092481024811248122481324814248152481624817248182481924820248212482224823248242482524826248272482824829248302483124832248332483424835248362483724838248392484024841248422484324844248452484624847248482484924850248512485224853248542485524856248572485824859248602486124862248632486424865248662486724868248692487024871248722487324874248752487624877248782487924880248812488224883248842488524886248872488824889248902489124892248932489424895248962489724898248992490024901249022490324904249052490624907249082490924910249112491224913249142491524916249172491824919249202492124922249232492424925249262492724928249292493024931249322493324934249352493624937249382493924940249412494224943249442494524946249472494824949249502495124952249532495424955249562495724958249592496024961249622496324964249652496624967249682496924970249712497224973249742497524976249772497824979249802498124982249832498424985249862498724988249892499024991249922499324994249952499624997249982499925000250012500225003250042500525006250072500825009250102501125012250132501425015250162501725018250192502025021250222502325024250252502625027250282502925030250312503225033250342503525036250372503825039250402504125042250432504425045250462504725048250492505025051250522505325054250552505625057250582505925060250612506225063250642506525066250672506825069250702507125072250732507425075250762507725078250792508025081250822508325084250852508625087250882508925090250912509225093250942509525096250972509825099251002510125102251032510425105251062510725108251092511025111251122511325114251152511625117251182511925120251212512225123251242512525126251272512825129251302513125132251332513425135251362513725138251392514025141251422514325144251452514625147251482514925150251512515225153251542515525156251572515825159251602516125162251632516425165251662516725168251692517025171251722517325174251752517625177251782517925180251812518225183251842518525186251872518825189251902519125192251932519425195251962519725198251992520025201252022520325204252052520625207252082520925210252112521225213252142521525216252172521825219252202522125222252232522425225252262522725228252292523025231252322523325234252352523625237252382523925240252412524225243252442524525246252472524825249252502525125252252532525425255252562525725258252592526025261252622526325264252652526625267252682526925270252712527225273252742527525276252772527825279252802528125282252832528425285252862528725288252892529025291252922529325294252952529625297252982529925300253012530225303253042530525306253072530825309253102531125312253132531425315253162531725318253192532025321253222532325324253252532625327253282532925330253312533225333253342533525336253372533825339253402534125342253432534425345253462534725348253492535025351253522535325354253552535625357253582535925360253612536225363253642536525366253672536825369253702537125372253732537425375253762537725378253792538025381253822538325384253852538625387253882538925390253912539225393253942539525396253972539825399254002540125402254032540425405254062540725408254092541025411254122541325414254152541625417254182541925420254212542225423254242542525426254272542825429254302543125432254332543425435254362543725438254392544025441254422544325444254452544625447254482544925450254512545225453254542545525456254572545825459254602546125462254632546425465254662546725468254692547025471254722547325474254752547625477254782547925480254812548225483254842548525486254872548825489254902549125492254932549425495254962549725498254992550025501255022550325504255052550625507255082550925510255112551225513255142551525516255172551825519255202552125522255232552425525255262552725528255292553025531255322553325534255352553625537255382553925540255412554225543255442554525546255472554825549255502555125552255532555425555255562555725558255592556025561255622556325564255652556625567255682556925570255712557225573255742557525576255772557825579255802558125582255832558425585255862558725588255892559025591255922559325594255952559625597255982559925600256012560225603256042560525606256072560825609256102561125612256132561425615256162561725618256192562025621256222562325624256252562625627256282562925630256312563225633256342563525636256372563825639256402564125642256432564425645256462564725648256492565025651256522565325654256552565625657256582565925660256612566225663256642566525666256672566825669256702567125672256732567425675256762567725678256792568025681256822568325684256852568625687256882568925690256912569225693256942569525696256972569825699257002570125702257032570425705257062570725708257092571025711257122571325714257152571625717257182571925720257212572225723257242572525726257272572825729257302573125732257332573425735257362573725738257392574025741257422574325744257452574625747257482574925750257512575225753257542575525756257572575825759257602576125762257632576425765257662576725768257692577025771257722577325774257752577625777257782577925780257812578225783257842578525786257872578825789257902579125792257932579425795257962579725798257992580025801258022580325804258052580625807258082580925810258112581225813258142581525816258172581825819258202582125822258232582425825258262582725828258292583025831258322583325834258352583625837258382583925840258412584225843258442584525846258472584825849258502585125852258532585425855258562585725858258592586025861258622586325864258652586625867258682586925870258712587225873258742587525876258772587825879258802588125882258832588425885258862588725888258892589025891258922589325894258952589625897258982589925900259012590225903259042590525906259072590825909259102591125912259132591425915259162591725918259192592025921259222592325924259252592625927259282592925930259312593225933259342593525936259372593825939259402594125942259432594425945259462594725948259492595025951259522595325954259552595625957259582595925960259612596225963259642596525966259672596825969259702597125972259732597425975259762597725978259792598025981259822598325984259852598625987259882598925990259912599225993259942599525996259972599825999260002600126002260032600426005260062600726008260092601026011260122601326014260152601626017260182601926020260212602226023260242602526026260272602826029260302603126032260332603426035260362603726038260392604026041260422604326044260452604626047260482604926050260512605226053260542605526056260572605826059260602606126062260632606426065260662606726068260692607026071260722607326074260752607626077260782607926080260812608226083260842608526086260872608826089260902609126092260932609426095260962609726098260992610026101261022610326104261052610626107261082610926110261112611226113261142611526116261172611826119261202612126122261232612426125261262612726128261292613026131261322613326134261352613626137261382613926140261412614226143261442614526146261472614826149261502615126152261532615426155261562615726158261592616026161261622616326164261652616626167261682616926170261712617226173261742617526176261772617826179261802618126182261832618426185261862618726188261892619026191261922619326194261952619626197261982619926200262012620226203262042620526206262072620826209262102621126212262132621426215262162621726218262192622026221262222622326224262252622626227262282622926230262312623226233262342623526236262372623826239262402624126242262432624426245262462624726248262492625026251262522625326254262552625626257262582625926260262612626226263262642626526266262672626826269262702627126272262732627426275262762627726278262792628026281262822628326284262852628626287262882628926290262912629226293262942629526296262972629826299263002630126302263032630426305263062630726308263092631026311263122631326314263152631626317263182631926320263212632226323263242632526326263272632826329263302633126332263332633426335263362633726338263392634026341263422634326344263452634626347263482634926350263512635226353263542635526356263572635826359263602636126362263632636426365263662636726368263692637026371263722637326374263752637626377263782637926380263812638226383263842638526386263872638826389263902639126392263932639426395263962639726398263992640026401264022640326404264052640626407264082640926410264112641226413264142641526416264172641826419264202642126422264232642426425264262642726428264292643026431264322643326434264352643626437264382643926440264412644226443264442644526446264472644826449264502645126452264532645426455264562645726458264592646026461264622646326464264652646626467264682646926470264712647226473264742647526476264772647826479264802648126482264832648426485264862648726488264892649026491264922649326494264952649626497264982649926500265012650226503265042650526506265072650826509265102651126512265132651426515265162651726518265192652026521265222652326524265252652626527265282652926530265312653226533265342653526536265372653826539265402654126542265432654426545265462654726548265492655026551265522655326554265552655626557265582655926560265612656226563265642656526566265672656826569265702657126572265732657426575265762657726578265792658026581265822658326584265852658626587265882658926590265912659226593265942659526596265972659826599266002660126602266032660426605266062660726608266092661026611266122661326614266152661626617266182661926620266212662226623266242662526626266272662826629266302663126632266332663426635266362663726638266392664026641266422664326644266452664626647266482664926650266512665226653266542665526656266572665826659266602666126662266632666426665266662666726668266692667026671266722667326674266752667626677266782667926680266812668226683266842668526686266872668826689266902669126692266932669426695266962669726698266992670026701267022670326704267052670626707267082670926710267112671226713267142671526716267172671826719267202672126722267232672426725267262672726728267292673026731267322673326734267352673626737267382673926740267412674226743267442674526746267472674826749267502675126752267532675426755267562675726758267592676026761267622676326764267652676626767267682676926770267712677226773267742677526776267772677826779267802678126782267832678426785267862678726788267892679026791267922679326794267952679626797267982679926800268012680226803268042680526806268072680826809268102681126812268132681426815268162681726818268192682026821268222682326824268252682626827268282682926830268312683226833268342683526836268372683826839268402684126842268432684426845268462684726848268492685026851268522685326854268552685626857268582685926860268612686226863268642686526866268672686826869268702687126872268732687426875268762687726878268792688026881268822688326884268852688626887268882688926890268912689226893268942689526896268972689826899269002690126902269032690426905269062690726908269092691026911269122691326914269152691626917269182691926920269212692226923269242692526926269272692826929269302693126932269332693426935269362693726938269392694026941269422694326944269452694626947269482694926950269512695226953269542695526956269572695826959269602696126962269632696426965269662696726968269692697026971269722697326974269752697626977269782697926980269812698226983269842698526986269872698826989269902699126992269932699426995269962699726998269992700027001270022700327004270052700627007270082700927010270112701227013270142701527016270172701827019270202702127022270232702427025270262702727028270292703027031270322703327034270352703627037270382703927040270412704227043270442704527046270472704827049270502705127052270532705427055270562705727058270592706027061270622706327064270652706627067270682706927070270712707227073270742707527076270772707827079270802708127082270832708427085270862708727088270892709027091270922709327094270952709627097270982709927100271012710227103271042710527106271072710827109271102711127112271132711427115271162711727118271192712027121271222712327124271252712627127271282712927130271312713227133271342713527136271372713827139271402714127142271432714427145271462714727148271492715027151271522715327154271552715627157271582715927160271612716227163271642716527166271672716827169271702717127172271732717427175271762717727178271792718027181271822718327184271852718627187271882718927190271912719227193271942719527196271972719827199272002720127202272032720427205272062720727208272092721027211272122721327214272152721627217272182721927220272212722227223272242722527226272272722827229272302723127232272332723427235272362723727238272392724027241272422724327244272452724627247272482724927250272512725227253272542725527256272572725827259272602726127262272632726427265272662726727268272692727027271272722727327274272752727627277272782727927280272812728227283272842728527286272872728827289272902729127292272932729427295272962729727298272992730027301273022730327304273052730627307273082730927310273112731227313273142731527316273172731827319273202732127322273232732427325273262732727328273292733027331273322733327334273352733627337273382733927340273412734227343273442734527346273472734827349273502735127352273532735427355273562735727358273592736027361273622736327364273652736627367273682736927370273712737227373273742737527376273772737827379273802738127382273832738427385273862738727388273892739027391273922739327394273952739627397273982739927400274012740227403274042740527406274072740827409274102741127412274132741427415274162741727418274192742027421274222742327424274252742627427274282742927430274312743227433274342743527436274372743827439274402744127442274432744427445274462744727448274492745027451274522745327454274552745627457274582745927460274612746227463274642746527466274672746827469274702747127472274732747427475274762747727478274792748027481274822748327484274852748627487274882748927490274912749227493274942749527496274972749827499275002750127502275032750427505275062750727508275092751027511275122751327514275152751627517275182751927520275212752227523275242752527526275272752827529275302753127532275332753427535275362753727538275392754027541275422754327544275452754627547275482754927550275512755227553275542755527556275572755827559275602756127562275632756427565275662756727568275692757027571275722757327574275752757627577275782757927580275812758227583275842758527586275872758827589275902759127592275932759427595275962759727598275992760027601276022760327604276052760627607276082760927610276112761227613276142761527616276172761827619276202762127622276232762427625276262762727628276292763027631276322763327634276352763627637276382763927640276412764227643276442764527646276472764827649276502765127652276532765427655276562765727658276592766027661276622766327664276652766627667276682766927670276712767227673276742767527676276772767827679276802768127682276832768427685276862768727688276892769027691276922769327694276952769627697276982769927700277012770227703277042770527706277072770827709277102771127712277132771427715277162771727718277192772027721277222772327724277252772627727277282772927730277312773227733277342773527736277372773827739277402774127742277432774427745277462774727748277492775027751277522775327754277552775627757277582775927760277612776227763277642776527766277672776827769277702777127772277732777427775277762777727778277792778027781277822778327784277852778627787277882778927790277912779227793277942779527796277972779827799278002780127802278032780427805278062780727808278092781027811278122781327814278152781627817278182781927820278212782227823278242782527826278272782827829278302783127832278332783427835278362783727838278392784027841278422784327844278452784627847278482784927850278512785227853278542785527856278572785827859278602786127862278632786427865278662786727868278692787027871278722787327874278752787627877278782787927880278812788227883278842788527886278872788827889278902789127892278932789427895278962789727898278992790027901279022790327904279052790627907279082790927910279112791227913279142791527916279172791827919279202792127922279232792427925279262792727928279292793027931279322793327934279352793627937279382793927940279412794227943279442794527946279472794827949279502795127952279532795427955279562795727958279592796027961279622796327964279652796627967279682796927970279712797227973279742797527976279772797827979279802798127982279832798427985279862798727988279892799027991279922799327994279952799627997279982799928000280012800228003280042800528006280072800828009280102801128012280132801428015280162801728018280192802028021280222802328024280252802628027280282802928030280312803228033280342803528036280372803828039280402804128042280432804428045280462804728048280492805028051280522805328054280552805628057280582805928060280612806228063280642806528066280672806828069280702807128072280732807428075280762807728078280792808028081280822808328084280852808628087280882808928090280912809228093280942809528096280972809828099281002810128102281032810428105281062810728108281092811028111281122811328114281152811628117281182811928120281212812228123281242812528126281272812828129281302813128132281332813428135281362813728138281392814028141281422814328144281452814628147281482814928150281512815228153281542815528156281572815828159281602816128162281632816428165281662816728168281692817028171281722817328174281752817628177281782817928180281812818228183281842818528186281872818828189281902819128192281932819428195281962819728198281992820028201282022820328204282052820628207282082820928210282112821228213282142821528216282172821828219282202822128222282232822428225282262822728228282292823028231282322823328234282352823628237282382823928240282412824228243282442824528246282472824828249282502825128252282532825428255282562825728258282592826028261282622826328264282652826628267282682826928270282712827228273282742827528276282772827828279282802828128282282832828428285282862828728288282892829028291282922829328294282952829628297282982829928300283012830228303283042830528306283072830828309283102831128312283132831428315283162831728318283192832028321283222832328324283252832628327283282832928330283312833228333283342833528336283372833828339283402834128342283432834428345283462834728348283492835028351283522835328354283552835628357283582835928360283612836228363283642836528366283672836828369283702837128372283732837428375283762837728378283792838028381283822838328384283852838628387283882838928390283912839228393283942839528396283972839828399284002840128402284032840428405284062840728408284092841028411284122841328414284152841628417284182841928420284212842228423284242842528426284272842828429284302843128432284332843428435284362843728438284392844028441284422844328444284452844628447284482844928450284512845228453284542845528456284572845828459284602846128462284632846428465284662846728468284692847028471284722847328474284752847628477284782847928480284812848228483284842848528486284872848828489284902849128492284932849428495284962849728498284992850028501285022850328504285052850628507285082850928510285112851228513285142851528516285172851828519285202852128522285232852428525285262852728528285292853028531285322853328534285352853628537285382853928540285412854228543285442854528546285472854828549285502855128552285532855428555285562855728558285592856028561285622856328564285652856628567285682856928570285712857228573285742857528576285772857828579285802858128582285832858428585285862858728588285892859028591285922859328594285952859628597285982859928600286012860228603286042860528606286072860828609286102861128612286132861428615286162861728618286192862028621286222862328624286252862628627286282862928630286312863228633286342863528636286372863828639286402864128642286432864428645286462864728648286492865028651286522865328654286552865628657286582865928660286612866228663286642866528666286672866828669286702867128672286732867428675286762867728678286792868028681286822868328684286852868628687286882868928690286912869228693286942869528696286972869828699287002870128702287032870428705287062870728708287092871028711287122871328714287152871628717287182871928720287212872228723287242872528726287272872828729287302873128732287332873428735287362873728738287392874028741287422874328744287452874628747287482874928750287512875228753287542875528756287572875828759287602876128762287632876428765287662876728768287692877028771287722877328774287752877628777287782877928780287812878228783287842878528786287872878828789287902879128792287932879428795287962879728798287992880028801288022880328804288052880628807288082880928810288112881228813288142881528816288172881828819288202882128822288232882428825288262882728828288292883028831288322883328834288352883628837288382883928840288412884228843288442884528846288472884828849288502885128852288532885428855288562885728858288592886028861288622886328864288652886628867288682886928870288712887228873288742887528876288772887828879288802888128882288832888428885288862888728888288892889028891288922889328894288952889628897288982889928900289012890228903289042890528906289072890828909289102891128912289132891428915289162891728918289192892028921289222892328924289252892628927289282892928930289312893228933289342893528936289372893828939289402894128942289432894428945289462894728948289492895028951289522895328954289552895628957289582895928960289612896228963289642896528966289672896828969289702897128972289732897428975289762897728978289792898028981289822898328984289852898628987289882898928990289912899228993289942899528996289972899828999290002900129002290032900429005290062900729008290092901029011290122901329014290152901629017290182901929020290212902229023290242902529026290272902829029290302903129032290332903429035290362903729038290392904029041290422904329044290452904629047290482904929050290512905229053290542905529056290572905829059290602906129062290632906429065290662906729068290692907029071290722907329074290752907629077290782907929080290812908229083290842908529086290872908829089290902909129092290932909429095290962909729098290992910029101291022910329104291052910629107291082910929110291112911229113291142911529116291172911829119291202912129122291232912429125291262912729128291292913029131291322913329134291352913629137291382913929140291412914229143291442914529146291472914829149291502915129152291532915429155291562915729158291592916029161291622916329164291652916629167291682916929170291712917229173291742917529176291772917829179291802918129182291832918429185291862918729188291892919029191291922919329194291952919629197291982919929200292012920229203292042920529206292072920829209292102921129212292132921429215292162921729218292192922029221292222922329224292252922629227292282922929230292312923229233292342923529236292372923829239292402924129242292432924429245292462924729248292492925029251292522925329254292552925629257292582925929260292612926229263292642926529266292672926829269292702927129272292732927429275292762927729278292792928029281292822928329284292852928629287292882928929290292912929229293292942929529296292972929829299293002930129302293032930429305293062930729308293092931029311293122931329314293152931629317293182931929320293212932229323293242932529326293272932829329293302933129332293332933429335293362933729338293392934029341293422934329344293452934629347293482934929350293512935229353293542935529356293572935829359293602936129362293632936429365293662936729368293692937029371293722937329374293752937629377293782937929380293812938229383293842938529386293872938829389293902939129392293932939429395293962939729398293992940029401294022940329404294052940629407294082940929410294112941229413294142941529416294172941829419294202942129422294232942429425294262942729428294292943029431294322943329434294352943629437294382943929440294412944229443294442944529446294472944829449294502945129452294532945429455294562945729458294592946029461294622946329464294652946629467294682946929470294712947229473294742947529476294772947829479294802948129482294832948429485294862948729488294892949029491294922949329494294952949629497294982949929500295012950229503295042950529506295072950829509295102951129512295132951429515295162951729518295192952029521295222952329524295252952629527295282952929530295312953229533295342953529536295372953829539295402954129542295432954429545295462954729548295492955029551295522955329554295552955629557295582955929560295612956229563295642956529566295672956829569295702957129572295732957429575295762957729578295792958029581295822958329584295852958629587295882958929590295912959229593295942959529596295972959829599296002960129602296032960429605296062960729608296092961029611296122961329614296152961629617296182961929620296212962229623296242962529626296272962829629296302963129632296332963429635296362963729638296392964029641296422964329644296452964629647296482964929650296512965229653296542965529656296572965829659296602966129662296632966429665296662966729668296692967029671296722967329674296752967629677296782967929680296812968229683296842968529686296872968829689296902969129692296932969429695296962969729698296992970029701297022970329704297052970629707297082970929710297112971229713297142971529716297172971829719297202972129722297232972429725297262972729728297292973029731297322973329734297352973629737297382973929740297412974229743297442974529746297472974829749297502975129752297532975429755297562975729758297592976029761297622976329764297652976629767297682976929770297712977229773297742977529776297772977829779297802978129782297832978429785297862978729788297892979029791297922979329794297952979629797297982979929800298012980229803298042980529806298072980829809298102981129812298132981429815298162981729818298192982029821298222982329824298252982629827298282982929830298312983229833298342983529836298372983829839298402984129842298432984429845298462984729848298492985029851298522985329854298552985629857298582985929860298612986229863298642986529866298672986829869298702987129872298732987429875298762987729878298792988029881298822988329884298852988629887298882988929890298912989229893298942989529896298972989829899299002990129902299032990429905299062990729908299092991029911299122991329914299152991629917299182991929920299212992229923299242992529926299272992829929299302993129932299332993429935299362993729938299392994029941299422994329944299452994629947299482994929950299512995229953299542995529956299572995829959299602996129962299632996429965299662996729968299692997029971299722997329974299752997629977299782997929980299812998229983299842998529986299872998829989299902999129992299932999429995299962999729998299993000030001300023000330004300053000630007300083000930010300113001230013300143001530016300173001830019300203002130022300233002430025300263002730028300293003030031300323003330034300353003630037300383003930040300413004230043300443004530046300473004830049300503005130052300533005430055300563005730058300593006030061300623006330064300653006630067300683006930070300713007230073300743007530076300773007830079300803008130082300833008430085300863008730088300893009030091300923009330094300953009630097300983009930100301013010230103301043010530106301073010830109301103011130112301133011430115301163011730118301193012030121301223012330124301253012630127301283012930130301313013230133301343013530136301373013830139301403014130142301433014430145301463014730148301493015030151301523015330154301553015630157301583015930160301613016230163301643016530166301673016830169301703017130172301733017430175301763017730178301793018030181301823018330184301853018630187301883018930190301913019230193301943019530196301973019830199302003020130202302033020430205302063020730208302093021030211302123021330214302153021630217302183021930220302213022230223302243022530226302273022830229302303023130232302333023430235302363023730238302393024030241302423024330244302453024630247302483024930250302513025230253302543025530256302573025830259302603026130262302633026430265302663026730268302693027030271302723027330274302753027630277302783027930280302813028230283302843028530286302873028830289302903029130292302933029430295302963029730298302993030030301303023030330304303053030630307303083030930310303113031230313303143031530316303173031830319303203032130322303233032430325303263032730328303293033030331303323033330334303353033630337303383033930340303413034230343303443034530346303473034830349303503035130352303533035430355303563035730358303593036030361303623036330364303653036630367303683036930370303713037230373303743037530376303773037830379303803038130382303833038430385303863038730388303893039030391303923039330394303953039630397303983039930400304013040230403304043040530406304073040830409304103041130412304133041430415304163041730418304193042030421304223042330424304253042630427304283042930430304313043230433304343043530436304373043830439304403044130442304433044430445304463044730448304493045030451304523045330454304553045630457304583045930460304613046230463304643046530466304673046830469304703047130472304733047430475304763047730478304793048030481304823048330484304853048630487304883048930490304913049230493304943049530496304973049830499305003050130502305033050430505305063050730508305093051030511305123051330514305153051630517305183051930520305213052230523305243052530526305273052830529305303053130532305333053430535305363053730538305393054030541305423054330544305453054630547305483054930550305513055230553305543055530556305573055830559305603056130562305633056430565305663056730568305693057030571305723057330574305753057630577305783057930580305813058230583305843058530586305873058830589305903059130592305933059430595305963059730598305993060030601306023060330604306053060630607306083060930610306113061230613306143061530616306173061830619306203062130622306233062430625306263062730628306293063030631306323063330634306353063630637306383063930640306413064230643306443064530646306473064830649306503065130652306533065430655306563065730658306593066030661306623066330664306653066630667306683066930670306713067230673306743067530676306773067830679306803068130682306833068430685306863068730688306893069030691306923069330694306953069630697306983069930700307013070230703307043070530706307073070830709307103071130712307133071430715307163071730718307193072030721307223072330724307253072630727307283072930730307313073230733307343073530736307373073830739307403074130742307433074430745307463074730748307493075030751307523075330754307553075630757307583075930760307613076230763307643076530766307673076830769307703077130772307733077430775307763077730778307793078030781307823078330784307853078630787307883078930790307913079230793307943079530796307973079830799308003080130802308033080430805308063080730808308093081030811308123081330814308153081630817308183081930820308213082230823308243082530826308273082830829308303083130832308333083430835308363083730838308393084030841308423084330844308453084630847308483084930850308513085230853308543085530856308573085830859308603086130862308633086430865308663086730868308693087030871308723087330874308753087630877308783087930880308813088230883308843088530886308873088830889308903089130892308933089430895308963089730898308993090030901309023090330904309053090630907309083090930910309113091230913309143091530916309173091830919309203092130922309233092430925309263092730928309293093030931309323093330934309353093630937309383093930940309413094230943309443094530946309473094830949309503095130952309533095430955309563095730958309593096030961309623096330964309653096630967309683096930970309713097230973309743097530976309773097830979309803098130982309833098430985309863098730988309893099030991309923099330994309953099630997309983099931000310013100231003310043100531006310073100831009310103101131012310133101431015310163101731018310193102031021310223102331024310253102631027310283102931030310313103231033310343103531036310373103831039310403104131042310433104431045310463104731048310493105031051310523105331054310553105631057310583105931060310613106231063310643106531066310673106831069310703107131072310733107431075310763107731078310793108031081310823108331084310853108631087310883108931090310913109231093310943109531096310973109831099311003110131102311033110431105311063110731108311093111031111311123111331114311153111631117311183111931120311213112231123311243112531126311273112831129311303113131132311333113431135311363113731138311393114031141311423114331144311453114631147311483114931150311513115231153311543115531156311573115831159311603116131162311633116431165311663116731168311693117031171311723117331174311753117631177311783117931180311813118231183311843118531186311873118831189311903119131192311933119431195311963119731198311993120031201312023120331204312053120631207312083120931210312113121231213312143121531216312173121831219312203122131222312233122431225312263122731228312293123031231312323123331234312353123631237312383123931240312413124231243312443124531246312473124831249312503125131252312533125431255312563125731258312593126031261312623126331264312653126631267312683126931270312713127231273312743127531276312773127831279312803128131282312833128431285312863128731288312893129031291312923129331294312953129631297312983129931300313013130231303313043130531306313073130831309313103131131312313133131431315313163131731318313193132031321313223132331324313253132631327313283132931330313313133231333313343133531336313373133831339313403134131342313433134431345313463134731348313493135031351313523135331354313553135631357313583135931360313613136231363313643136531366313673136831369313703137131372313733137431375313763137731378313793138031381313823138331384313853138631387313883138931390313913139231393313943139531396313973139831399314003140131402314033140431405314063140731408314093141031411314123141331414314153141631417314183141931420314213142231423314243142531426314273142831429314303143131432314333143431435314363143731438314393144031441314423144331444314453144631447314483144931450314513145231453314543145531456314573145831459314603146131462314633146431465314663146731468314693147031471314723147331474314753147631477314783147931480314813148231483314843148531486314873148831489314903149131492314933149431495314963149731498314993150031501315023150331504315053150631507315083150931510315113151231513315143151531516315173151831519315203152131522315233152431525315263152731528315293153031531315323153331534315353153631537315383153931540315413154231543315443154531546315473154831549315503155131552315533155431555315563155731558315593156031561315623156331564315653156631567315683156931570315713157231573315743157531576315773157831579315803158131582315833158431585315863158731588315893159031591315923159331594315953159631597315983159931600316013160231603316043160531606316073160831609316103161131612316133161431615316163161731618316193162031621316223162331624316253162631627316283162931630316313163231633316343163531636316373163831639316403164131642316433164431645316463164731648316493165031651316523165331654316553165631657316583165931660316613166231663316643166531666316673166831669316703167131672316733167431675316763167731678316793168031681316823168331684316853168631687316883168931690316913169231693316943169531696316973169831699317003170131702317033170431705317063170731708317093171031711317123171331714317153171631717317183171931720317213172231723317243172531726317273172831729317303173131732317333173431735317363173731738317393174031741317423174331744317453174631747317483174931750317513175231753317543175531756317573175831759317603176131762317633176431765317663176731768317693177031771317723177331774317753177631777317783177931780317813178231783317843178531786317873178831789317903179131792317933179431795317963179731798317993180031801318023180331804318053180631807318083180931810318113181231813318143181531816318173181831819318203182131822318233182431825318263182731828318293183031831318323183331834318353183631837318383183931840318413184231843318443184531846318473184831849318503185131852318533185431855318563185731858318593186031861318623186331864318653186631867318683186931870318713187231873318743187531876318773187831879318803188131882318833188431885318863188731888318893189031891318923189331894318953189631897318983189931900319013190231903319043190531906319073190831909319103191131912319133191431915319163191731918319193192031921319223192331924319253192631927319283192931930319313193231933319343193531936319373193831939319403194131942319433194431945319463194731948319493195031951319523195331954319553195631957319583195931960319613196231963319643196531966319673196831969319703197131972319733197431975319763197731978319793198031981319823198331984319853198631987319883198931990319913199231993319943199531996
  1. .type-large-title {
  2. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3. font-size: 2.5rem;
  4. line-height: 3rem;
  5. font-weight: 600;
  6. color: #403840
  7. }
  8. @media(min-width:48em) {
  9. .type-large-title {
  10. font-size: 3.875rem;
  11. line-height: 4.375rem
  12. }
  13. }
  14. .type-title-1 {
  15. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  16. font-size: 2rem;
  17. line-height: 2.375rem;
  18. font-weight: 600;
  19. color: #403840
  20. }
  21. @media(min-width:48em) {
  22. .type-title-1 {
  23. font-size: 2.625rem;
  24. line-height: 3rem
  25. }
  26. }
  27. .type-title-2 {
  28. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  29. font-size: 1.375rem;
  30. line-height: 1.75rem;
  31. font-weight: 600;
  32. color: #403840
  33. }
  34. @media(min-width:48em) {
  35. .type-title-2 {
  36. font-size: 2rem;
  37. line-height: 2.25rem
  38. }
  39. }
  40. .type-title-3 {
  41. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  42. font-size: 1.125rem;
  43. line-height: 1.5rem;
  44. font-weight: 600;
  45. color: #403840
  46. }
  47. @media(min-width:48em) {
  48. .type-title-3 {
  49. font-size: 1.5rem;
  50. line-height: 2rem
  51. }
  52. }
  53. .type-headline {
  54. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  55. font-size: 1rem;
  56. line-height: 1.375rem;
  57. font-weight: 600;
  58. color: #403840
  59. }
  60. @media(min-width:48em) {
  61. .type-headline {
  62. font-size: 1.125rem;
  63. line-height: 1.5rem
  64. }
  65. }
  66. .type-body {
  67. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  68. font-size: .9375rem;
  69. line-height: 1.25rem;
  70. color: #403840
  71. }
  72. @media(min-width:48em) {
  73. .type-body {
  74. font-size: 1rem;
  75. line-height: 1.375rem
  76. }
  77. }
  78. .type-button {
  79. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  80. font-size: 1rem;
  81. line-height: 1.125rem;
  82. color: #403840
  83. }
  84. @media(min-width:48em) {
  85. .type-button {
  86. line-height: 1.375rem
  87. }
  88. }
  89. .type-text-link {
  90. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  91. font-size: .9375rem;
  92. line-height: 1.25rem;
  93. color: #da291c
  94. }
  95. @media(min-width:48em) {
  96. .type-text-link {
  97. font-size: 1rem;
  98. line-height: 1.375rem
  99. }
  100. }
  101. .type-small-text {
  102. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  103. font-size: .75rem;
  104. line-height: 1rem;
  105. color: #403840
  106. }
  107. @media(min-width:48em) {
  108. .type-small-text {
  109. font-size: .875rem;
  110. line-height: 1.25rem
  111. }
  112. }
  113. .type-text-link-2 {
  114. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  115. font-size: .75rem;
  116. line-height: 1rem;
  117. color: #da291c
  118. }
  119. @media(min-width:48em) {
  120. .type-text-link-2 {
  121. font-size: .875rem;
  122. line-height: 1.25rem
  123. }
  124. }
  125. .marketing-tile-dismiss__confirm {
  126. padding: 20px;
  127. display: flex;
  128. flex-direction: column;
  129. justify-content: center;
  130. align-items: center
  131. }
  132. .marketing-tile-dismiss__heading {
  133. height: 30px;
  134. display: flex;
  135. align-items: center;
  136. padding: 0 20px
  137. }
  138. .marketing-tile-dismiss__heading svg {
  139. width: 40px;
  140. height: 30px
  141. }
  142. .marketing-tile-dismiss__text {
  143. font-weight: 700;
  144. margin-left: 10px;
  145. font-size: 1rem
  146. }
  147. .marketing-tile-dismiss__actions {
  148. margin-top: 20px
  149. }
  150. .marketing-tile-dismiss__cancel-link {
  151. margin-left: 20px
  152. }
  153. .marketing-tile-dismiss__first-try {
  154. padding: 20px;
  155. display: flex;
  156. flex-direction: column;
  157. align-items: center
  158. }
  159. .marketing-tile-dismiss__first-try button {
  160. margin-top: 20px;
  161. display: flex;
  162. justify-content: center;
  163. align-items: center
  164. }
  165. .marketing-tile-dismiss__first-try button svg {
  166. margin-right: 10px
  167. }
  168. .marketing-tile-dismiss__first-try-headingheading {
  169. height: 30px;
  170. display: inline-flex;
  171. align-items: center
  172. }
  173. .marketing-tile {
  174. box-sizing: border-box;
  175. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  176. overflow: hidden;
  177. border-radius: 8px;
  178. transition: box-shadow .3s ease-in-out;
  179. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14)
  180. }
  181. .marketing-tile:focus,
  182. .marketing-tile:focus-within,
  183. .marketing-tile:hover {
  184. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14)
  185. }
  186. .marketing-tile__main {
  187. display: flex;
  188. flex-direction: column;
  189. justify-content: space-between;
  190. align-items: center;
  191. position: relative;
  192. width: 100%
  193. }
  194. @media(min-width:64.0625em) {
  195. .marketing-tile__main {
  196. flex-direction: row
  197. }
  198. }
  199. .marketing-tile__header {
  200. display: flex;
  201. flex-direction: column;
  202. height: 100%;
  203. width: 100%;
  204. order: 1
  205. }
  206. @media(min-width:64em) {
  207. .marketing-tile__header {
  208. order: 1
  209. }
  210. }
  211. @media(min-width:64.0625em) {
  212. .marketing-tile__header {
  213. order: 0;
  214. min-height: 310px
  215. }
  216. }
  217. .marketing-tile__content {
  218. padding: 20px 20px 14px;
  219. flex-grow: 1;
  220. display: flex;
  221. flex-direction: column
  222. }
  223. @media(min-width:64em) {
  224. .marketing-tile__content {
  225. padding: 20px 30px
  226. }
  227. }
  228. .marketing-tile__title {
  229. font-size: 1.125rem;
  230. font-weight: 700;
  231. line-height: 1.333;
  232. margin: 0;
  233. padding: 0
  234. }
  235. @media(min-width:64em) {
  236. .marketing-tile__title {
  237. font-size: 1.5rem;
  238. line-height: 1.2
  239. }
  240. }
  241. .marketing-tile__description {
  242. margin: 4px 0;
  243. line-height: 1.4
  244. }
  245. @media(min-width:64em) {
  246. .marketing-tile__description {
  247. margin: 10px 0;
  248. line-height: 1.5
  249. }
  250. }
  251. .marketing-tile__learn-more {
  252. line-height: 1.333;
  253. margin: 0
  254. }
  255. @media(min-width:64em) {
  256. .marketing-tile__learn-more {
  257. line-height: 1.5
  258. }
  259. }
  260. .marketing-tile__view-details {
  261. flex-grow: 0;
  262. display: flex;
  263. align-items: center;
  264. flex-direction: column;
  265. text-align: center;
  266. padding: 10px 18px
  267. }
  268. @media(min-width:64em) {
  269. .marketing-tile__view-details {
  270. flex-direction: row;
  271. justify-content: space-between;
  272. padding: 10px 30px
  273. }
  274. }
  275. .marketing-tile__show-details-button {
  276. order: 1;
  277. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  278. font-weight: 400;
  279. font-size: .875rem;
  280. height: 1rem;
  281. display: inline-flex;
  282. align-self: center;
  283. background: none;
  284. border: none;
  285. padding: 0;
  286. cursor: pointer;
  287. text-decoration: underline
  288. }
  289. @media(min-width:64em) {
  290. .marketing-tile__show-details-button {
  291. order: 0;
  292. font-size: 1rem;
  293. line-height: 1.5
  294. }
  295. }
  296. .marketing-tile__logo {
  297. display: flex;
  298. align-items: center;
  299. justify-content: center;
  300. order: 0;
  301. margin-top: 10px;
  302. max-width: 95px
  303. }
  304. @media(min-width:64em) {
  305. .marketing-tile__logo {
  306. margin-top: 0;
  307. order: 1
  308. }
  309. }
  310. .marketing-tile__logo img {
  311. width: 100%;
  312. height: auto
  313. }
  314. .marketing-tile__img-container {
  315. display: flex;
  316. justify-content: center;
  317. align-items: stretch;
  318. overflow: hidden;
  319. z-index: 10;
  320. order: 0;
  321. height: 190px
  322. }
  323. @media(min-width:34.375em) {
  324. .marketing-tile__img-container {
  325. height: 310px
  326. }
  327. }
  328. @media(min-width:64em) {
  329. .marketing-tile__img-container {
  330. flex: auto
  331. }
  332. }
  333. @media(min-width:64.0625em) {
  334. .marketing-tile__img-container {
  335. order: 1;
  336. flex: 0 0 434px;
  337. align-self: flex-start
  338. }
  339. }
  340. .marketing-tile__img {
  341. height: 100%
  342. }
  343. .marketing-tile__img.image--error {
  344. width: 64px;
  345. height: 64px;
  346. margin: auto
  347. }
  348. .marketing-tile__details {
  349. display: flex;
  350. flex-direction: column;
  351. justify-content: center;
  352. align-items: center;
  353. background-color: #fff
  354. }
  355. .marketing-tile__additional-info-wrapper {
  356. width: 100%;
  357. padding: 20px 0
  358. }
  359. .marketing-tile__additional-info,
  360. .marketing-tile__date {
  361. padding: 0 20px;
  362. margin: 0;
  363. text-align: center
  364. }
  365. @media(min-width:48em) {
  366. .marketing-tile__additional-info,
  367. .marketing-tile__date {
  368. text-align: left
  369. }
  370. }
  371. .marketing-tile__additional-info:first-child,
  372. .marketing-tile__date:first-child {
  373. margin-bottom: 20px
  374. }
  375. .marketing-tile--theme-esso,
  376. .marketing-tile--theme-mobil,
  377. .marketing-tile--theme-pco_standard {
  378. background: #fff
  379. }
  380. .marketing-tile--theme-esso .marketing-tile__title,
  381. .marketing-tile--theme-mobil .marketing-tile__title,
  382. .marketing-tile--theme-pco_standard .marketing-tile__title {
  383. color: #f86457
  384. }
  385. .marketing-tile--theme-esso .marketing-tile-dismiss__text,
  386. .marketing-tile--theme-esso .marketing-tile__description,
  387. .marketing-tile--theme-mobil .marketing-tile-dismiss__text,
  388. .marketing-tile--theme-mobil .marketing-tile__description,
  389. .marketing-tile--theme-pco_standard .marketing-tile-dismiss__text,
  390. .marketing-tile--theme-pco_standard .marketing-tile__description {
  391. color: #191919
  392. }
  393. .marketing-tile--theme-esso .marketing-tile__details,
  394. .marketing-tile--theme-esso .marketing-tile__view-details,
  395. .marketing-tile--theme-mobil .marketing-tile__details,
  396. .marketing-tile--theme-mobil .marketing-tile__view-details,
  397. .marketing-tile--theme-pco_standard .marketing-tile__details,
  398. .marketing-tile--theme-pco_standard .marketing-tile__view-details {
  399. border-top: 1px solid rgba(25, 25, 25, .19)
  400. }
  401. .marketing-tile--theme-esso .marketing-tile__learn-more,
  402. .marketing-tile--theme-esso .marketing-tile__view-details-button,
  403. .marketing-tile--theme-mobil .marketing-tile__learn-more,
  404. .marketing-tile--theme-mobil .marketing-tile__view-details-button,
  405. .marketing-tile--theme-pco_standard .marketing-tile__learn-more,
  406. .marketing-tile--theme-pco_standard .marketing-tile__view-details-button {
  407. color: #da291c
  408. }
  409. .marketing-tile--theme-pco_red {
  410. background: #f86457
  411. }
  412. .marketing-tile--theme-pco_red .marketing-tile__title {
  413. color: #fff
  414. }
  415. .marketing-tile--theme-pco_red .marketing-tile-dismiss__text,
  416. .marketing-tile--theme-pco_red .marketing-tile__description {
  417. color: #191919
  418. }
  419. .marketing-tile--theme-pco_red .marketing-tile__details,
  420. .marketing-tile--theme-pco_red .marketing-tile__view-details {
  421. border-top: 1px solid rgba(25, 25, 25, .19)
  422. }
  423. .marketing-tile--theme-pco_red .marketing-tile__learn-more,
  424. .marketing-tile--theme-pco_red .marketing-tile__view-details-button {
  425. color: #191919
  426. }
  427. .marketing-tile--theme-pco_pink {
  428. background: #ffd9d9
  429. }
  430. .marketing-tile--theme-pco_pink .marketing-tile__title {
  431. color: #f86457
  432. }
  433. .marketing-tile--theme-pco_pink .marketing-tile-dismiss__text,
  434. .marketing-tile--theme-pco_pink .marketing-tile__description,
  435. .marketing-tile--theme-pco_pink .marketing-tile__learn-more,
  436. .marketing-tile--theme-pco_pink .marketing-tile__view-details-button {
  437. color: #191919
  438. }
  439. .marketing-tile--theme-pco_pink .marketing-tile__details,
  440. .marketing-tile--theme-pco_pink .marketing-tile__view-details {
  441. border-top: 1px solid rgba(25, 25, 25, .19)
  442. }
  443. .marketing-tile--theme-pco_black {
  444. background: #000
  445. }
  446. .marketing-tile--theme-pco_black .marketing-tile__title {
  447. color: #f86457
  448. }
  449. .marketing-tile--theme-pco_black .marketing-tile-dismiss__text,
  450. .marketing-tile--theme-pco_black .marketing-tile__description,
  451. .marketing-tile--theme-pco_black .marketing-tile__learn-more,
  452. .marketing-tile--theme-pco_black .marketing-tile__view-details-button {
  453. color: #fff
  454. }
  455. .marketing-tile--theme-pco_black .marketing-tile__details,
  456. .marketing-tile--theme-pco_black .marketing-tile__view-details {
  457. border-top: 1px solid #fff
  458. }
  459. .marketing-tile--theme-dominion,
  460. .marketing-tile--theme-fortinos,
  461. .marketing-tile--theme-freshmart,
  462. .marketing-tile--theme-independent-citymarket,
  463. .marketing-tile--theme-loblaws,
  464. .marketing-tile--theme-loblaws_citymarket,
  465. .marketing-tile--theme-provigo,
  466. .marketing-tile--theme-rass,
  467. .marketing-tile--theme-supervalue,
  468. .marketing-tile--theme-valumart,
  469. .marketing-tile--theme-yig,
  470. .marketing-tile--theme-zehrs {
  471. background: #121212
  472. }
  473. .marketing-tile--theme-dominion .marketing-tile-dismiss__text,
  474. .marketing-tile--theme-dominion .marketing-tile__description,
  475. .marketing-tile--theme-dominion .marketing-tile__title,
  476. .marketing-tile--theme-dominion .marketing-tile__view-details-button,
  477. .marketing-tile--theme-fortinos .marketing-tile-dismiss__text,
  478. .marketing-tile--theme-fortinos .marketing-tile__description,
  479. .marketing-tile--theme-fortinos .marketing-tile__title,
  480. .marketing-tile--theme-fortinos .marketing-tile__view-details-button,
  481. .marketing-tile--theme-freshmart .marketing-tile-dismiss__text,
  482. .marketing-tile--theme-freshmart .marketing-tile__description,
  483. .marketing-tile--theme-freshmart .marketing-tile__title,
  484. .marketing-tile--theme-freshmart .marketing-tile__view-details-button,
  485. .marketing-tile--theme-independent-citymarket .marketing-tile-dismiss__text,
  486. .marketing-tile--theme-independent-citymarket .marketing-tile__description,
  487. .marketing-tile--theme-independent-citymarket .marketing-tile__title,
  488. .marketing-tile--theme-independent-citymarket .marketing-tile__view-details-button,
  489. .marketing-tile--theme-loblaws .marketing-tile-dismiss__text,
  490. .marketing-tile--theme-loblaws .marketing-tile__description,
  491. .marketing-tile--theme-loblaws .marketing-tile__title,
  492. .marketing-tile--theme-loblaws .marketing-tile__view-details-button,
  493. .marketing-tile--theme-loblaws_citymarket .marketing-tile-dismiss__text,
  494. .marketing-tile--theme-loblaws_citymarket .marketing-tile__description,
  495. .marketing-tile--theme-loblaws_citymarket .marketing-tile__title,
  496. .marketing-tile--theme-loblaws_citymarket .marketing-tile__view-details-button,
  497. .marketing-tile--theme-provigo .marketing-tile-dismiss__text,
  498. .marketing-tile--theme-provigo .marketing-tile__description,
  499. .marketing-tile--theme-provigo .marketing-tile__title,
  500. .marketing-tile--theme-provigo .marketing-tile__view-details-button,
  501. .marketing-tile--theme-rass .marketing-tile-dismiss__text,
  502. .marketing-tile--theme-rass .marketing-tile__description,
  503. .marketing-tile--theme-rass .marketing-tile__title,
  504. .marketing-tile--theme-rass .marketing-tile__view-details-button,
  505. .marketing-tile--theme-supervalue .marketing-tile-dismiss__text,
  506. .marketing-tile--theme-supervalue .marketing-tile__description,
  507. .marketing-tile--theme-supervalue .marketing-tile__title,
  508. .marketing-tile--theme-supervalue .marketing-tile__view-details-button,
  509. .marketing-tile--theme-valumart .marketing-tile-dismiss__text,
  510. .marketing-tile--theme-valumart .marketing-tile__description,
  511. .marketing-tile--theme-valumart .marketing-tile__title,
  512. .marketing-tile--theme-valumart .marketing-tile__view-details-button,
  513. .marketing-tile--theme-yig .marketing-tile-dismiss__text,
  514. .marketing-tile--theme-yig .marketing-tile__description,
  515. .marketing-tile--theme-yig .marketing-tile__title,
  516. .marketing-tile--theme-yig .marketing-tile__view-details-button,
  517. .marketing-tile--theme-zehrs .marketing-tile-dismiss__text,
  518. .marketing-tile--theme-zehrs .marketing-tile__description,
  519. .marketing-tile--theme-zehrs .marketing-tile__title,
  520. .marketing-tile--theme-zehrs .marketing-tile__view-details-button {
  521. color: #fff
  522. }
  523. .marketing-tile--theme-dominion .marketing-tile__details,
  524. .marketing-tile--theme-dominion .marketing-tile__view-details,
  525. .marketing-tile--theme-fortinos .marketing-tile__details,
  526. .marketing-tile--theme-fortinos .marketing-tile__view-details,
  527. .marketing-tile--theme-freshmart .marketing-tile__details,
  528. .marketing-tile--theme-freshmart .marketing-tile__view-details,
  529. .marketing-tile--theme-independent-citymarket .marketing-tile__details,
  530. .marketing-tile--theme-independent-citymarket .marketing-tile__view-details,
  531. .marketing-tile--theme-loblaws .marketing-tile__details,
  532. .marketing-tile--theme-loblaws .marketing-tile__view-details,
  533. .marketing-tile--theme-loblaws_citymarket .marketing-tile__details,
  534. .marketing-tile--theme-loblaws_citymarket .marketing-tile__view-details,
  535. .marketing-tile--theme-provigo .marketing-tile__details,
  536. .marketing-tile--theme-provigo .marketing-tile__view-details,
  537. .marketing-tile--theme-rass .marketing-tile__details,
  538. .marketing-tile--theme-rass .marketing-tile__view-details,
  539. .marketing-tile--theme-supervalue .marketing-tile__details,
  540. .marketing-tile--theme-supervalue .marketing-tile__view-details,
  541. .marketing-tile--theme-valumart .marketing-tile__details,
  542. .marketing-tile--theme-valumart .marketing-tile__view-details,
  543. .marketing-tile--theme-yig .marketing-tile__details,
  544. .marketing-tile--theme-yig .marketing-tile__view-details,
  545. .marketing-tile--theme-zehrs .marketing-tile__details,
  546. .marketing-tile--theme-zehrs .marketing-tile__view-details {
  547. border-top: 1px solid #fff
  548. }
  549. .marketing-tile--theme-dominion .marketing-tile__learn-more,
  550. .marketing-tile--theme-fortinos .marketing-tile__learn-more,
  551. .marketing-tile--theme-freshmart .marketing-tile__learn-more,
  552. .marketing-tile--theme-independent-citymarket .marketing-tile__learn-more,
  553. .marketing-tile--theme-loblaws .marketing-tile__learn-more,
  554. .marketing-tile--theme-loblaws_citymarket .marketing-tile__learn-more,
  555. .marketing-tile--theme-provigo .marketing-tile__learn-more,
  556. .marketing-tile--theme-rass .marketing-tile__learn-more,
  557. .marketing-tile--theme-supervalue .marketing-tile__learn-more,
  558. .marketing-tile--theme-valumart .marketing-tile__learn-more,
  559. .marketing-tile--theme-yig .marketing-tile__learn-more,
  560. .marketing-tile--theme-zehrs .marketing-tile__learn-more {
  561. color: #ee3929
  562. }
  563. .marketing-tile--theme-extra_foods,
  564. .marketing-tile--theme-maxi,
  565. .marketing-tile--theme-superstore,
  566. .marketing-tile--theme-wholesale {
  567. background: #fff
  568. }
  569. .marketing-tile--theme-extra_foods .marketing-tile__title,
  570. .marketing-tile--theme-maxi .marketing-tile__title,
  571. .marketing-tile--theme-superstore .marketing-tile__title,
  572. .marketing-tile--theme-wholesale .marketing-tile__title {
  573. color: #194b9f
  574. }
  575. .marketing-tile--theme-extra_foods .marketing-tile-dismiss__text,
  576. .marketing-tile--theme-extra_foods .marketing-tile__description,
  577. .marketing-tile--theme-maxi .marketing-tile-dismiss__text,
  578. .marketing-tile--theme-maxi .marketing-tile__description,
  579. .marketing-tile--theme-superstore .marketing-tile-dismiss__text,
  580. .marketing-tile--theme-superstore .marketing-tile__description,
  581. .marketing-tile--theme-wholesale .marketing-tile-dismiss__text,
  582. .marketing-tile--theme-wholesale .marketing-tile__description {
  583. color: #000
  584. }
  585. .marketing-tile--theme-extra_foods .marketing-tile__details,
  586. .marketing-tile--theme-extra_foods .marketing-tile__view-details,
  587. .marketing-tile--theme-maxi .marketing-tile__details,
  588. .marketing-tile--theme-maxi .marketing-tile__view-details,
  589. .marketing-tile--theme-superstore .marketing-tile__details,
  590. .marketing-tile--theme-superstore .marketing-tile__view-details,
  591. .marketing-tile--theme-wholesale .marketing-tile__details,
  592. .marketing-tile--theme-wholesale .marketing-tile__view-details {
  593. border-top: 1px solid #000
  594. }
  595. .marketing-tile--theme-extra_foods .marketing-tile__learn-more,
  596. .marketing-tile--theme-extra_foods .marketing-tile__view-details-button,
  597. .marketing-tile--theme-maxi .marketing-tile__learn-more,
  598. .marketing-tile--theme-maxi .marketing-tile__view-details-button,
  599. .marketing-tile--theme-superstore .marketing-tile__learn-more,
  600. .marketing-tile--theme-superstore .marketing-tile__view-details-button,
  601. .marketing-tile--theme-wholesale .marketing-tile__learn-more,
  602. .marketing-tile--theme-wholesale .marketing-tile__view-details-button {
  603. color: #ee3131
  604. }
  605. .marketing-tile--theme-nofrills {
  606. background: #fd0
  607. }
  608. .marketing-tile--theme-nofrills .marketing-tile__title {
  609. color: #ee3131
  610. }
  611. .marketing-tile--theme-nofrills .marketing-tile-dismiss__text,
  612. .marketing-tile--theme-nofrills .marketing-tile__description,
  613. .marketing-tile--theme-nofrills .marketing-tile__learn-more,
  614. .marketing-tile--theme-nofrills .marketing-tile__view-details-button {
  615. color: #000
  616. }
  617. .marketing-tile--theme-nofrills .marketing-tile__details,
  618. .marketing-tile--theme-nofrills .marketing-tile__view-details {
  619. border-top: 1px solid #000
  620. }
  621. .marketing-tile--theme-joe_fresh {
  622. background: #fff
  623. }
  624. .marketing-tile--theme-joe_fresh .marketing-tile__learn-more,
  625. .marketing-tile--theme-joe_fresh .marketing-tile__title,
  626. .marketing-tile--theme-joe_fresh .marketing-tile__view-details-button {
  627. color: #ac342a
  628. }
  629. .marketing-tile--theme-joe_fresh .marketing-tile-dismiss__text,
  630. .marketing-tile--theme-joe_fresh .marketing-tile__description {
  631. color: #000
  632. }
  633. .marketing-tile--theme-joe_fresh .marketing-tile__details,
  634. .marketing-tile--theme-joe_fresh .marketing-tile__view-details {
  635. border-top: 1px solid #000
  636. }
  637. .marketing-tile--theme-sdm_phx {
  638. background: #fff
  639. }
  640. .marketing-tile--theme-sdm_phx .marketing-tile-dismiss__text,
  641. .marketing-tile--theme-sdm_phx .marketing-tile__description,
  642. .marketing-tile--theme-sdm_phx .marketing-tile__learn-more,
  643. .marketing-tile--theme-sdm_phx .marketing-tile__title,
  644. .marketing-tile--theme-sdm_phx .marketing-tile__view-details-button {
  645. color: #000
  646. }
  647. .marketing-tile--theme-sdm_phx .marketing-tile__details,
  648. .marketing-tile--theme-sdm_phx .marketing-tile__view-details {
  649. border-top: 1px solid #000
  650. }
  651. .marketing-tile--theme-sdm_beauty {
  652. background: #d3eef8
  653. }
  654. .marketing-tile--theme-sdm_beauty .marketing-tile-dismiss__text,
  655. .marketing-tile--theme-sdm_beauty .marketing-tile__description,
  656. .marketing-tile--theme-sdm_beauty .marketing-tile__learn-more,
  657. .marketing-tile--theme-sdm_beauty .marketing-tile__title,
  658. .marketing-tile--theme-sdm_beauty .marketing-tile__view-details-button {
  659. color: #000
  660. }
  661. .marketing-tile--theme-sdm_beauty .marketing-tile__details,
  662. .marketing-tile--theme-sdm_beauty .marketing-tile__view-details {
  663. border-top: 1px solid #000
  664. }
  665. .marketing-tile--theme-pc_financial {
  666. background: #ee2e24
  667. }
  668. .marketing-tile--theme-pc_financial .marketing-tile-dismiss__text,
  669. .marketing-tile--theme-pc_financial .marketing-tile__description,
  670. .marketing-tile--theme-pc_financial .marketing-tile__learn-more,
  671. .marketing-tile--theme-pc_financial .marketing-tile__title,
  672. .marketing-tile--theme-pc_financial .marketing-tile__view-details-button {
  673. color: #fff
  674. }
  675. .marketing-tile--theme-pc_financial .marketing-tile__details,
  676. .marketing-tile--theme-pc_financial .marketing-tile__view-details {
  677. border-top: 1px solid #fff
  678. }
  679. .marketing-tile--theme-pc_insiders {
  680. background: #fff
  681. }
  682. .marketing-tile--theme-pc_insiders .marketing-tile__learn-more,
  683. .marketing-tile--theme-pc_insiders .marketing-tile__title,
  684. .marketing-tile--theme-pc_insiders .marketing-tile__view-details-button {
  685. color: #ee3124
  686. }
  687. .marketing-tile--theme-pc_insiders .marketing-tile-dismiss__text,
  688. .marketing-tile--theme-pc_insiders .marketing-tile__description {
  689. color: #000
  690. }
  691. .marketing-tile--theme-pc_insiders .marketing-tile__details,
  692. .marketing-tile--theme-pc_insiders .marketing-tile__view-details {
  693. border-top: 1px solid #000
  694. }
  695. .image-set img {
  696. max-width: 100%;
  697. height: 100%;
  698. -o-object-fit: cover;
  699. object-fit: cover;
  700. display: block;
  701. margin: 0 auto
  702. }
  703. .points-days-header {
  704. display: flex;
  705. flex-direction: column;
  706. align-items: center
  707. }
  708. @media(min-width:48em) {
  709. .points-days-header {
  710. flex-direction: row;
  711. justify-content: center
  712. }
  713. }
  714. .points-days-header__header {
  715. background-size: contain;
  716. background-position: center 100%;
  717. background-repeat: no-repeat;
  718. background-color: #fbf1f1;
  719. min-height: 334px;
  720. padding-top: 21px
  721. }
  722. @media(min-width:48em) {
  723. .points-days-header__header {
  724. background-size: contain;
  725. background-position: center 100%;
  726. padding-top: 0;
  727. min-height: 220px
  728. }
  729. }
  730. @media(min-width:64em) {
  731. .points-days-header__header {
  732. background-size: 100%;
  733. min-height: 290px
  734. }
  735. }
  736. .points-days-header__image {
  737. width: 136px;
  738. height: 94px
  739. }
  740. @media(min-width:48em) {
  741. .points-days-header__image {
  742. width: 144px;
  743. height: 100px
  744. }
  745. }
  746. @media(min-width:64em) {
  747. .points-days-header__image {
  748. width: 282px;
  749. height: 194px
  750. }
  751. }
  752. .points-days-header__logo {
  753. text-align: right;
  754. margin-bottom: 31px
  755. }
  756. @media(min-width:48em) {
  757. .points-days-header__logo {
  758. margin-bottom: 0
  759. }
  760. }
  761. .points-days-header__text-section {
  762. padding: 0 16px
  763. }
  764. @media(min-width:48em) {
  765. .points-days-header__text-section {
  766. display: flex;
  767. flex-direction: column;
  768. padding-left: 24px
  769. }
  770. }
  771. .points-days-header__text-section-block {
  772. display: block
  773. }
  774. .points-days-header__title {
  775. color: #ac342a;
  776. text-align: center;
  777. margin: 0 0 16px
  778. }
  779. @media(min-width:48em) {
  780. .points-days-header__title {
  781. text-align: left;
  782. margin: 0 0 7px
  783. }
  784. }
  785. @media(min-width:64em) {
  786. .points-days-header__title {
  787. margin: -1.25em 0 16px
  788. }
  789. }
  790. .points-days-header__subtitle {
  791. text-align: center;
  792. color: #403840;
  793. padding-bottom: 35px;
  794. margin-bottom: 0
  795. }
  796. @media(min-width:48em) {
  797. .points-days-header__subtitle {
  798. text-align: left;
  799. width: 420px;
  800. padding-bottom: 0;
  801. margin-top: 0
  802. }
  803. }
  804. .layoutCard {
  805. box-sizing: border-box;
  806. margin: 0 auto;
  807. border-radius: 1rem;
  808. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  809. position: relative;
  810. overflow: hidden;
  811. display: flex
  812. }
  813. @media(max-width:47.99em) {
  814. .layoutCard {
  815. flex-direction: column;
  816. min-height: 492px;
  817. width: 100%;
  818. max-width: 390px
  819. }
  820. }
  821. .layoutCard__bg-dark {
  822. background-color: #ac342a
  823. }
  824. .layoutCard__bg-medium {
  825. background-color: #df6c46
  826. }
  827. .layoutCard__bg-light {
  828. background-color: #fbf1f1
  829. }
  830. .layoutCard__bg-off-white {
  831. background-color: #fdfdfd
  832. }
  833. .layoutCard__text-dark {
  834. color: #403840
  835. }
  836. .layoutCard__text-light {
  837. color: #fff
  838. }
  839. @media(min-width:48em) {
  840. .layoutCard__horizontal {
  841. width: 100%;
  842. flex-direction: row;
  843. max-width: 996px;
  844. min-height: 364px
  845. }
  846. }
  847. @media(min-width:48em) {
  848. .layoutCard__horizontal .layoutCard__text-container {
  849. padding-right: 3.5rem
  850. }
  851. }
  852. @media(min-width:64em) {
  853. .layoutCard__horizontal .layoutCard__text-container {
  854. padding-right: 5rem
  855. }
  856. }
  857. @media(min-width:48em) {
  858. .layoutCard__horizontal .layoutCard__image-container {
  859. max-width: 456px
  860. }
  861. }
  862. @media(max-width:47.99em) {
  863. .layoutCard__horizontal .layoutCard__image-container img {
  864. right: -174px;
  865. bottom: -50px
  866. }
  867. }
  868. @media(min-width:48em) {
  869. .layoutCard__vertical {
  870. width: calc(50% - 1rem);
  871. max-width: 482px;
  872. min-height: 590px;
  873. flex-direction: column
  874. }
  875. .layoutCard__vertical .layoutCard__title {
  876. margin-bottom: 1.5rem
  877. }
  878. .layoutCard__vertical .layoutCard__image-container {
  879. position: absolute;
  880. bottom: 0;
  881. right: -20px;
  882. max-width: 337px
  883. }
  884. }
  885. @media(min-width:64em) {
  886. .layoutCard__vertical .layoutCard__image-container {
  887. bottom: 0;
  888. right: 0
  889. }
  890. }
  891. .layoutCard__image-container {
  892. position: relative
  893. }
  894. .layoutCard__image-container img {
  895. display: block;
  896. max-width: 100%
  897. }
  898. @media(max-width:47.99em) {
  899. .layoutCard__image-container img {
  900. position: absolute;
  901. right: -41px;
  902. bottom: -105px
  903. }
  904. }
  905. @media only screen and (max-width:374px) {
  906. .layoutCard__image-container img {
  907. right: -110px;
  908. bottom: -105px
  909. }
  910. }
  911. .layoutCard__text-container {
  912. display: flex;
  913. flex-direction: column;
  914. align-items: flex-start;
  915. justify-content: space-between;
  916. flex-grow: 1;
  917. padding: 1.875rem;
  918. position: relative;
  919. z-index: 1
  920. }
  921. @media(min-width:48em) {
  922. .layoutCard__text-container {
  923. padding: 2rem
  924. }
  925. }
  926. @media(min-width:64em) {
  927. .layoutCard__text-container {
  928. padding: 2.5rem
  929. }
  930. }
  931. .layoutCard__text-body {
  932. display: flex;
  933. flex-direction: column;
  934. align-items: flex-start
  935. }
  936. .layoutCard__title {
  937. margin: 0 0 1rem
  938. }
  939. @media(min-width:48em)and (max-width:63.99em) {
  940. .layoutCard__title {
  941. font-size: 1.75rem;
  942. line-height: 2rem
  943. }
  944. }
  945. .layoutCard__body {
  946. margin: 0 0 1rem;
  947. max-width: 415px
  948. }
  949. @media(min-width:48em)and (max-width:63.99em) {
  950. .layoutCard__body {
  951. font-size: 1.25rem;
  952. line-height: 1.5rem
  953. }
  954. }
  955. .layoutCard__button {
  956. border-radius: 100px;
  957. padding: 12px 20px;
  958. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  959. font-weight: 600;
  960. transition: all .1s
  961. }
  962. .layoutCard__button-light {
  963. color: #fff;
  964. border-color: #fff
  965. }
  966. .layoutCard__button-light:hover {
  967. border-color: #fff;
  968. background: #fff;
  969. color: #403840
  970. }
  971. .layoutCard__button-dark {
  972. color: #403840;
  973. border-color: #403840
  974. }
  975. .layoutCard__button-dark:hover {
  976. border-color: #403840;
  977. background: #403840;
  978. color: #fff
  979. }
  980. .layoutCard__logo-list {
  981. margin: 0;
  982. padding: 0;
  983. list-style: none;
  984. line-height: 0
  985. }
  986. .accordion {
  987. display: flex;
  988. flex-direction: column
  989. }
  990. .accordion__button {
  991. margin: 0 auto
  992. }
  993. .accordion__button-contents {
  994. display: flex;
  995. align-items: center
  996. }
  997. .accordion__button-sprite {
  998. height: 8px;
  999. width: 14px;
  1000. margin-left: 8px;
  1001. transform: rotate(90deg)
  1002. }
  1003. .accordion__button-sprite--expanded {
  1004. transform: rotate(-90deg)
  1005. }
  1006. .screen-cards {
  1007. padding: 24px;
  1008. margin-bottom: 50px
  1009. }
  1010. @media(min-width:46.25em) {
  1011. .screen-cards {
  1012. padding: 40px 24px;
  1013. margin-bottom: 56px
  1014. }
  1015. }
  1016. @media(min-width:61.25em) {
  1017. .screen-cards {
  1018. padding: 48px 32px;
  1019. margin-bottom: 100px
  1020. }
  1021. }
  1022. .screen-cards__title {
  1023. margin: 0 auto;
  1024. text-align: center
  1025. }
  1026. @media(min-width:61.25em) {
  1027. .screen-cards__title {
  1028. max-width: 992px
  1029. }
  1030. }
  1031. .screen-cards__subtitle {
  1032. margin: 16px auto 0;
  1033. text-align: center
  1034. }
  1035. @media(min-width:61.25em) {
  1036. .screen-cards__subtitle {
  1037. max-width: 540px
  1038. }
  1039. }
  1040. .screen-cards__list {
  1041. align-items: center;
  1042. display: flex;
  1043. flex-direction: column;
  1044. margin: 32px 0 -74px
  1045. }
  1046. @media(min-width:46.25em) {
  1047. .screen-cards__list {
  1048. align-items: flex-start;
  1049. flex-direction: row;
  1050. flex-wrap: wrap;
  1051. justify-content: center;
  1052. margin: 20px -12px -108px
  1053. }
  1054. }
  1055. @media(min-width:61.25em) {
  1056. .screen-cards__list {
  1057. margin: 28px -12px -160px
  1058. }
  1059. }
  1060. .screen-cards__card {
  1061. margin-top: 16px
  1062. }
  1063. .screen-cards__card:first-child {
  1064. margin-top: 0
  1065. }
  1066. @media(min-width:46.25em) {
  1067. .screen-cards__card:first-child {
  1068. margin-top: 12px
  1069. }
  1070. }
  1071. @media(min-width:46.25em) {
  1072. .screen-cards__card {
  1073. margin: 12px
  1074. }
  1075. }
  1076. .pc-card {
  1077. background-color: #fff;
  1078. border-radius: 8px;
  1079. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  1080. text-align: center
  1081. }
  1082. .pc-card-sm {
  1083. width: 310px
  1084. }
  1085. @media(min-width:48em) {
  1086. .pc-card-sm {
  1087. min-height: 398px
  1088. }
  1089. }
  1090. @media(min-width:64em) {
  1091. .pc-card-sm {
  1092. min-height: 362px;
  1093. width: 362px
  1094. }
  1095. }
  1096. .pc-card-sm .pc-card__image-section-image {
  1097. height: 156px;
  1098. width: 310px
  1099. }
  1100. .pc-card__image-section {
  1101. padding: 24px 0;
  1102. border-bottom: 1px solid #9e93a6
  1103. }
  1104. @media(min-width:64em) {
  1105. .pc-card__image-section {
  1106. padding: 24px
  1107. }
  1108. }
  1109. .pc-card__image-section-image {
  1110. display: block
  1111. }
  1112. .pc-card__content {
  1113. display: flex;
  1114. flex-direction: column;
  1115. padding: 24px
  1116. }
  1117. .pc-card__title {
  1118. margin: 0
  1119. }
  1120. .pc-card__body {
  1121. margin-top: 8px
  1122. }
  1123. .pc-card__body p {
  1124. margin: 0
  1125. }
  1126. .cta-section {
  1127. padding: 30px 24px 24px
  1128. }
  1129. @media(min-width:46.25em) {
  1130. .cta-section {
  1131. padding: 40px
  1132. }
  1133. }
  1134. @media(min-width:61.25em) {
  1135. .cta-section {
  1136. padding: 40px 142px
  1137. }
  1138. }
  1139. .cta-section__header {
  1140. margin: 0
  1141. }
  1142. .cta-section__subheader {
  1143. margin: 24px 0 0
  1144. }
  1145. @media(min-width:46.25em) {
  1146. .cta-section__subheader {
  1147. margin: 16px 0 0;
  1148. max-width: 564px
  1149. }
  1150. }
  1151. @media(min-width:61.25em) {
  1152. .cta-section__subheader {
  1153. margin: 16px 0 0;
  1154. max-width: 660px
  1155. }
  1156. }
  1157. .cta-section__tiles-container {
  1158. margin-top: 32px
  1159. }
  1160. @media(min-width:61.25em) {
  1161. .cta-section__tiles-container {
  1162. margin-top: 40px
  1163. }
  1164. }
  1165. .cta-section__tiles {
  1166. display: flex;
  1167. flex-direction: column;
  1168. margin-bottom: -24px
  1169. }
  1170. @media(min-width:46.25em) {
  1171. .cta-section__tiles {
  1172. flex-direction: row;
  1173. flex-wrap: wrap;
  1174. margin: -16px -15px
  1175. }
  1176. }
  1177. @media(min-width:61.25em) {
  1178. .cta-section__tiles {
  1179. margin: -20px -32px
  1180. }
  1181. }
  1182. .cta-section__tile {
  1183. margin: 0 0 24px
  1184. }
  1185. @media(min-width:46.25em) {
  1186. .cta-section__tile {
  1187. width: 284px;
  1188. margin: 16px 15px
  1189. }
  1190. }
  1191. @media(min-width:61.25em) {
  1192. .cta-section__tile {
  1193. width: 340px;
  1194. margin: 20px 32px
  1195. }
  1196. }
  1197. .cta-section__tile--header {
  1198. margin: 0
  1199. }
  1200. .cta-section__tile--subheader {
  1201. margin: 4px 0 0
  1202. }
  1203. @media(min-width:46.25em) {
  1204. .cta-section__tile--subheader {
  1205. margin: 16px 0 0
  1206. }
  1207. }
  1208. .cta-section__link {
  1209. display: inline-block;
  1210. margin-top: 32px
  1211. }
  1212. @media(min-width:46.25em) {
  1213. .cta-section__link {
  1214. margin-top: 40px
  1215. }
  1216. }
  1217. .points-days-mobile__text-section-block ol li::marker,
  1218. .type-ds-title-3 {
  1219. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1220. font-size: 1.125rem;
  1221. line-height: 1.5rem;
  1222. font-weight: 600;
  1223. color: #403840
  1224. }
  1225. @media(min-width:48em) {
  1226. .points-days-mobile__text-section-block ol li::marker,
  1227. .type-ds-title-3 {
  1228. font-size: 1.5rem;
  1229. line-height: 2rem
  1230. }
  1231. }
  1232. .points-days-mobile__text-section-block ol p,
  1233. .type-ds-body {
  1234. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1235. font-size: .9375rem;
  1236. line-height: 1.428571429;
  1237. color: #403840
  1238. }
  1239. @media(min-width:48em) {
  1240. .points-days-mobile__text-section-block ol p,
  1241. .type-ds-body {
  1242. font-size: 1rem;
  1243. line-height: 1.375rem
  1244. }
  1245. }
  1246. .container,
  1247. .points-days-mobile {
  1248. max-width: 1280px;
  1249. margin-left: auto;
  1250. margin-right: auto;
  1251. padding-left: 20px;
  1252. padding-right: 20px
  1253. }
  1254. @media(min-width:48em) {
  1255. .container,
  1256. .points-days-mobile {
  1257. padding-left: 40px;
  1258. padding-right: 40px
  1259. }
  1260. }
  1261. .points-days-mobile {
  1262. display: flex;
  1263. flex-direction: column;
  1264. align-items: center
  1265. }
  1266. @media(min-width:48em) {
  1267. .points-days-mobile {
  1268. flex-direction: row;
  1269. justify-content: center
  1270. }
  1271. }
  1272. .points-days-mobile__mobile {
  1273. min-height: 375px;
  1274. padding-bottom: 21px;
  1275. background-size: 120%
  1276. }
  1277. @media(min-width:48em) {
  1278. .points-days-mobile__mobile {
  1279. background-size: 100%;
  1280. background-position: center -10px;
  1281. min-height: 220px;
  1282. padding-bottom: 0
  1283. }
  1284. }
  1285. @media(min-width:64em) {
  1286. .points-days-mobile__mobile {
  1287. background-position-y: 25%;
  1288. min-height: 290px
  1289. }
  1290. }
  1291. .points-days-mobile__logo {
  1292. text-align: right
  1293. }
  1294. @media(min-width:48em) {
  1295. .points-days-mobile__logo {
  1296. display: flex;
  1297. flex-direction: column
  1298. }
  1299. }
  1300. .points-days-mobile__image {
  1301. width: 286px;
  1302. height: 412px
  1303. }
  1304. @media(min-width:48em) {
  1305. .points-days-mobile__image {
  1306. width: 235px;
  1307. height: 337px
  1308. }
  1309. }
  1310. @media(min-width:64em) {
  1311. .points-days-mobile__image {
  1312. width: 372px;
  1313. height: 536px
  1314. }
  1315. }
  1316. .points-days-mobile__text-section {
  1317. padding: 0 16px
  1318. }
  1319. @media(min-width:48em) {
  1320. .points-days-mobile__text-section {
  1321. display: flex;
  1322. flex-direction: column;
  1323. padding: 1em 0 1em 24px
  1324. }
  1325. }
  1326. .points-days-mobile__text-section-block {
  1327. display: block;
  1328. margin-block-start: 1em
  1329. }
  1330. .points-days-mobile__text-section-block-social {
  1331. align-items: center;
  1332. display: flex;
  1333. justify-content: space-around;
  1334. width: 100%
  1335. }
  1336. @media(min-width:48em) {
  1337. .points-days-mobile__text-section-block-social {
  1338. justify-content: flex-start;
  1339. padding-inline-start: 22px
  1340. }
  1341. }
  1342. .points-days-mobile__text-section-block-social svg {
  1343. height: 40px;
  1344. width: 121px
  1345. }
  1346. @media(min-width:48em) {
  1347. .points-days-mobile__text-section-block-social svg {
  1348. margin-right: 24px;
  1349. padding: 0
  1350. }
  1351. }
  1352. @media(min-width:64em) {
  1353. .points-days-mobile__text-section-block-social svg {
  1354. margin-right: 40px;
  1355. padding: 0
  1356. }
  1357. }
  1358. .points-days-mobile__text-section-block-social img {
  1359. height: 40px;
  1360. width: 138px
  1361. }
  1362. .points-days-mobile__text-section-block ol {
  1363. padding-inline-start: 5px
  1364. }
  1365. .points-days-mobile__text-section-block ol li {
  1366. counter-increment: li
  1367. }
  1368. .points-days-mobile__text-section-block ol li::marker {
  1369. content: counter(li)
  1370. }
  1371. .points-days-mobile__text-section-block ol p {
  1372. padding-inline-start: 25px
  1373. }
  1374. @media(min-width:48em) {
  1375. .points-days-mobile__text-section-block ol {
  1376. padding-inline-start: 40px
  1377. }
  1378. }
  1379. .points-days-mobile__title {
  1380. color: #ac342a;
  1381. text-align: center;
  1382. font-size: 22px;
  1383. line-height: 28px;
  1384. margin: 0
  1385. }
  1386. @media(min-width:48em) {
  1387. .points-days-mobile__title {
  1388. text-align: left;
  1389. padding-inline-start: 25px;
  1390. font-size: 32px;
  1391. line-height: 36px
  1392. }
  1393. }
  1394. .points-days-mobile__subtitle {
  1395. text-align: center;
  1396. color: #403840;
  1397. padding-bottom: 24px;
  1398. margin: 0
  1399. }
  1400. @media(min-width:48em) {
  1401. .points-days-mobile__subtitle {
  1402. text-align: left;
  1403. width: 420px;
  1404. padding-bottom: 0;
  1405. padding-inline-start: 25px
  1406. }
  1407. }
  1408. @media(min-width:48em) {
  1409. .points-days-mobile p {
  1410. padding-inline-start: 25px
  1411. }
  1412. }
  1413. .logo-section__logos {
  1414. display: flex;
  1415. flex-wrap: wrap;
  1416. justify-content: center;
  1417. padding: 32px
  1418. }
  1419. @media(min-width:34.375em) {
  1420. .logo-section__logos {
  1421. justify-content: space-between
  1422. }
  1423. }
  1424. @media(min-width:48em) {
  1425. .logo-section__logos {
  1426. padding: 76px
  1427. }
  1428. }
  1429. @media(min-width:64em) {
  1430. .logo-section__logos {
  1431. padding: 48px
  1432. }
  1433. }
  1434. .logo-section__logos-logo {
  1435. width: 130px
  1436. }
  1437. @media(min-width:48em) {
  1438. .logo-section__logos-logo {
  1439. width: 258px
  1440. }
  1441. }
  1442. .logo-section__body-text {
  1443. padding: 0 32px;
  1444. text-align: center
  1445. }
  1446. @media(min-width:48em) {
  1447. .logo-section__body-text {
  1448. padding: 0 76px
  1449. }
  1450. }
  1451. @media(min-width:64em) {
  1452. .logo-section__body-text {
  1453. padding: 0 48px
  1454. }
  1455. }
  1456. .type-ds-title-1 {
  1457. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1458. font-size: 2rem;
  1459. line-height: 2.375rem;
  1460. font-weight: 600;
  1461. color: #403840
  1462. }
  1463. @media(min-width:48em) {
  1464. .type-ds-title-1 {
  1465. font-size: 2.625rem;
  1466. line-height: 3rem
  1467. }
  1468. }
  1469. .type-ds-title-2 {
  1470. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1471. font-size: 1.375rem;
  1472. line-height: 1.75rem;
  1473. font-weight: 600;
  1474. color: #403840
  1475. }
  1476. @media(min-width:48em) {
  1477. .type-ds-title-2 {
  1478. font-size: 2rem;
  1479. line-height: 2.25rem
  1480. }
  1481. }
  1482. .type-ds-title-3 {
  1483. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1484. font-size: 1.125rem;
  1485. line-height: 1.5rem;
  1486. font-weight: 600;
  1487. color: #403840
  1488. }
  1489. @media(min-width:48em) {
  1490. .type-ds-title-3 {
  1491. font-size: 1.5rem;
  1492. line-height: 2rem
  1493. }
  1494. }
  1495. .type-ds-headline {
  1496. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1497. font-size: 1rem;
  1498. line-height: 1.375rem;
  1499. font-weight: 600;
  1500. color: #403840
  1501. }
  1502. @media(min-width:48em) {
  1503. .type-ds-headline {
  1504. font-size: 1.125rem;
  1505. line-height: 1.5rem
  1506. }
  1507. }
  1508. .type-ds-body {
  1509. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1510. font-size: .9375rem;
  1511. line-height: 1.428571429;
  1512. color: #403840
  1513. }
  1514. @media(min-width:48em) {
  1515. .type-ds-body {
  1516. font-size: 1rem;
  1517. line-height: 1.375rem
  1518. }
  1519. }
  1520. .type-ds-button {
  1521. font-size: 1rem;
  1522. line-height: 1.375rem;
  1523. font-weight: 600;
  1524. color: #403840
  1525. }
  1526. .type-ds-button,
  1527. .type-ds-text-link {
  1528. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  1529. }
  1530. .type-ds-text-link {
  1531. font-size: .9375rem;
  1532. line-height: 1.428571429;
  1533. color: #da291c
  1534. }
  1535. @media(min-width:48em) {
  1536. .type-ds-text-link {
  1537. font-size: 1rem;
  1538. line-height: 1.5rem
  1539. }
  1540. }
  1541. .type-ds-small-text {
  1542. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1543. font-size: .75rem;
  1544. line-height: 1rem;
  1545. color: #403840
  1546. }
  1547. @media(min-width:48em) {
  1548. .type-ds-small-text {
  1549. font-size: .875rem;
  1550. line-height: 1.25rem
  1551. }
  1552. }
  1553. .type-ds-small-text-bold,
  1554. .type-ds-small-text-strong {
  1555. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1556. font-size: .75rem;
  1557. line-height: 1rem;
  1558. font-weight: 600;
  1559. color: #403840
  1560. }
  1561. @media(min-width:48em) {
  1562. .type-ds-small-text-bold,
  1563. .type-ds-small-text-strong {
  1564. font-size: .875rem;
  1565. line-height: 1.25rem
  1566. }
  1567. }
  1568. .type-ds-text-link-2 {
  1569. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1570. font-size: .75rem;
  1571. line-height: 1.333333333;
  1572. color: #da291c
  1573. }
  1574. @media(min-width:48em) {
  1575. .type-ds-text-link-2 {
  1576. font-size: .875rem;
  1577. line-height: 1.25rem
  1578. }
  1579. }
  1580. .type-ds-text-link-2-new {
  1581. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1582. font-size: .75rem;
  1583. line-height: 1.333333333;
  1584. color: #157a77
  1585. }
  1586. @media(min-width:48em) {
  1587. .type-ds-text-link-2-new {
  1588. font-size: .875rem;
  1589. line-height: 1.25rem
  1590. }
  1591. }
  1592. .type-h1 {
  1593. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1594. font-size: 3.125rem;
  1595. line-height: 1.1;
  1596. letter-spacing: -.02rem;
  1597. font-weight: 700;
  1598. color: #191919
  1599. }
  1600. @media(min-width:48em) {
  1601. .type-h1 {
  1602. font-size: 4.5rem;
  1603. line-height: 1.108108108
  1604. }
  1605. }
  1606. .type-h2 {
  1607. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1608. font-size: 2rem;
  1609. line-height: 1.125;
  1610. letter-spacing: -.02rem;
  1611. font-weight: 700;
  1612. color: #191919
  1613. }
  1614. @media(min-width:48em) {
  1615. .type-h2 {
  1616. font-size: 3rem;
  1617. line-height: 1.166666666
  1618. }
  1619. }
  1620. .type-h3 {
  1621. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1622. font-size: 1.25rem;
  1623. line-height: 1.4;
  1624. font-weight: 400;
  1625. color: #191919
  1626. }
  1627. @media(min-width:48em) {
  1628. .type-h3 {
  1629. font-size: 2rem;
  1630. line-height: 1.3125
  1631. }
  1632. }
  1633. .type-h4 {
  1634. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1635. font-size: 1.5rem;
  1636. line-height: 1.166666666;
  1637. letter-spacing: -.02rem;
  1638. font-weight: 700;
  1639. color: #191919
  1640. }
  1641. @media(min-width:48em) {
  1642. .type-h4 {
  1643. font-size: 2rem;
  1644. line-height: 1.25
  1645. }
  1646. }
  1647. .type-p2 {
  1648. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1649. font-size: 1.125rem;
  1650. line-height: 1.333333333;
  1651. letter-spacing: -.02rem;
  1652. font-weight: 700;
  1653. color: #191919
  1654. }
  1655. @media(min-width:48em) {
  1656. .type-p2 {
  1657. font-size: 1.5rem;
  1658. line-height: 1.333333333
  1659. }
  1660. }
  1661. .type-p3 {
  1662. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1663. font-size: 1.125rem;
  1664. line-height: 1.333333333;
  1665. letter-spacing: -.02rem;
  1666. font-weight: 700;
  1667. color: #191919
  1668. }
  1669. @media(min-width:48em) {
  1670. .type-p3 {
  1671. font-size: 1.125rem;
  1672. line-height: 1.555555556
  1673. }
  1674. }
  1675. .type-p4 {
  1676. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1677. font-size: .9375rem;
  1678. line-height: 1.4;
  1679. font-weight: 400;
  1680. color: #191919
  1681. }
  1682. @media(min-width:48em) {
  1683. .type-p4 {
  1684. font-size: 1.125rem;
  1685. line-height: 1.555555556
  1686. }
  1687. }
  1688. .type-offer-header {
  1689. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1690. font-size: 1.375rem;
  1691. line-height: 1.28;
  1692. font-weight: 700;
  1693. color: #403840
  1694. }
  1695. @media(min-width:48em) {
  1696. .type-offer-header {
  1697. font-size: 2rem;
  1698. line-height: 1.125
  1699. }
  1700. }
  1701. .type-offer-header-copy {
  1702. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1703. font-size: .9375rem;
  1704. line-height: 1.4;
  1705. font-weight: 400;
  1706. color: #f86457
  1707. }
  1708. @media(min-width:48em) {
  1709. .type-offer-header-copy {
  1710. font-size: 1;
  1711. line-height: 1.3333
  1712. }
  1713. }
  1714. .type-offer-header-error {
  1715. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1716. font-size: 1.125rem;
  1717. line-height: 1.333333333;
  1718. font-weight: 700;
  1719. color: #191919
  1720. }
  1721. @media(min-width:48em) {
  1722. .type-offer-header-error {
  1723. font-size: 1.5rem;
  1724. line-height: 1.166666666
  1725. }
  1726. }
  1727. .type-body1 {
  1728. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1729. font-size: .9375rem;
  1730. line-height: 1.4;
  1731. font-weight: 400;
  1732. color: #191919
  1733. }
  1734. @media(min-width:48em) {
  1735. .type-body1 {
  1736. font-size: 1rem;
  1737. line-height: 1.5
  1738. }
  1739. }
  1740. .type-offer-body1 {
  1741. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1742. font-size: .9375rem;
  1743. line-height: 1.4;
  1744. font-weight: 400;
  1745. color: #403840
  1746. }
  1747. @media(min-width:48em) {
  1748. .type-offer-body1 {
  1749. font-size: 1rem;
  1750. line-height: 1.5
  1751. }
  1752. }
  1753. .type-body2 {
  1754. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  1755. font-size: .9375rem;
  1756. line-height: 1.4;
  1757. font-weight: 400;
  1758. color: #191919
  1759. }
  1760. @media(min-width:48em) {
  1761. .type-body2 {
  1762. font-size: 1rem;
  1763. line-height: 1.5
  1764. }
  1765. }
  1766. .type-subcopy {
  1767. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1768. font-size: .75rem;
  1769. line-height: 1.333333333;
  1770. font-weight: 400;
  1771. color: #585858
  1772. }
  1773. @media(min-width:48em) {
  1774. .type-subcopy {
  1775. font-size: .875rem;
  1776. line-height: 1.428571429
  1777. }
  1778. }
  1779. .type-offer-subcopy {
  1780. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1781. font-size: .75rem;
  1782. line-height: 1.333333333;
  1783. font-weight: 400;
  1784. color: #655c6c
  1785. }
  1786. @media(min-width:48em) {
  1787. .type-offer-subcopy {
  1788. font-size: .875rem;
  1789. line-height: 1.428571429
  1790. }
  1791. }
  1792. .type-subcopy-bold {
  1793. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1794. font-size: .75rem;
  1795. line-height: 1.333333333;
  1796. font-weight: 600;
  1797. color: #191919
  1798. }
  1799. @media(min-width:48em) {
  1800. .type-subcopy-bold {
  1801. font-size: .875rem;
  1802. line-height: 1.428571429
  1803. }
  1804. }
  1805. .type-link1 {
  1806. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1807. font-size: .9375rem;
  1808. line-height: 1.4;
  1809. font-weight: 400;
  1810. color: #ee3124;
  1811. text-decoration: underline
  1812. }
  1813. @media(min-width:48em) {
  1814. .type-link1 {
  1815. font-size: 1rem;
  1816. line-height: 1.75
  1817. }
  1818. }
  1819. .type-link2 {
  1820. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1821. font-size: .75rem;
  1822. line-height: 1.333333333;
  1823. font-weight: 400;
  1824. color: #585858;
  1825. text-decoration: underline
  1826. }
  1827. .type-link2:hover {
  1828. color: #191919
  1829. }
  1830. @media(min-width:48em) {
  1831. .type-link2 {
  1832. font-size: .875rem;
  1833. line-height: 1.428571429
  1834. }
  1835. }
  1836. .type-footertitle {
  1837. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1838. font-size: .9375rem;
  1839. line-height: 1.4;
  1840. font-weight: 700;
  1841. color: #191919
  1842. }
  1843. @media(min-width:48em) {
  1844. .type-footertitle {
  1845. font-size: 1rem;
  1846. line-height: 1.5
  1847. }
  1848. }
  1849. .type-eyebrow {
  1850. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1851. font-size: .75rem;
  1852. line-height: 1.333333333;
  1853. letter-spacing: .03rem;
  1854. font-weight: 700;
  1855. color: #191919;
  1856. text-transform: uppercase
  1857. }
  1858. @media(min-width:48em) {
  1859. .type-eyebrow {
  1860. font-size: .875rem;
  1861. line-height: 1.428571429;
  1862. letter-spacing: .05rem
  1863. }
  1864. }
  1865. .type-offer-eyebrow {
  1866. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1867. font-size: .75rem;
  1868. line-height: 1.333333333;
  1869. font-weight: 400;
  1870. text-transform: uppercase
  1871. }
  1872. @media(min-width:48em) {
  1873. .type-offer-eyebrow {
  1874. font-size: .875rem;
  1875. line-height: 1.428571429
  1876. }
  1877. }
  1878. .type-form-label {
  1879. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1880. font-size: .75rem;
  1881. line-height: 1.333333333;
  1882. letter-spacing: .05em;
  1883. font-weight: 400;
  1884. color: #191919
  1885. }
  1886. @media(min-width:48em) {
  1887. .type-form-label {
  1888. font-size: .875rem;
  1889. line-height: 1.428571429
  1890. }
  1891. }
  1892. .type-form-subtext {
  1893. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1894. font-size: .75rem;
  1895. line-height: 1.333333333;
  1896. font-weight: 400;
  1897. color: #585858
  1898. }
  1899. @media(min-width:48em) {
  1900. .type-form-subtext {
  1901. font-size: .875rem;
  1902. line-height: 1.428571429
  1903. }
  1904. }
  1905. .type-homepage-title {
  1906. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1907. font-size: 2rem;
  1908. line-height: 1.176470588;
  1909. letter-spacing: -.02rem;
  1910. font-weight: 700;
  1911. color: #ee3124
  1912. }
  1913. @media(min-width:48em) {
  1914. .type-homepage-title {
  1915. font-size: 3rem;
  1916. line-height: 1.166666666
  1917. }
  1918. }
  1919. .type-homepage-subtitle {
  1920. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  1921. font-size: 1.375rem;
  1922. line-height: 1.363636364;
  1923. font-weight: 400;
  1924. color: #191919
  1925. }
  1926. @media(min-width:48em) {
  1927. .type-homepage-subtitle {
  1928. font-size: 1.5625rem;
  1929. line-height: 1.2
  1930. }
  1931. }
  1932. .container,
  1933. .content-card {
  1934. max-width: 1280px;
  1935. margin-left: auto;
  1936. margin-right: auto;
  1937. padding-left: 20px;
  1938. padding-right: 20px
  1939. }
  1940. @media(min-width:48em) {
  1941. .container,
  1942. .content-card {
  1943. padding-left: 40px;
  1944. padding-right: 40px
  1945. }
  1946. }
  1947. .content-card {
  1948. display: flex;
  1949. flex-direction: column;
  1950. justify-content: center;
  1951. width: 100%
  1952. }
  1953. @media(min-width:48em) {
  1954. .content-card {
  1955. flex-direction: row
  1956. }
  1957. }
  1958. .content-card__image {
  1959. display: block;
  1960. width: 295px;
  1961. height: 295px;
  1962. margin: 0 auto
  1963. }
  1964. @media(min-width:48em) {
  1965. .content-card__image {
  1966. width: 242px;
  1967. height: 242px;
  1968. margin: 0
  1969. }
  1970. }
  1971. @media(min-width:64em) {
  1972. .content-card__image {
  1973. width: 384px;
  1974. height: 384px
  1975. }
  1976. }
  1977. .content-card__content {
  1978. display: flex;
  1979. flex-direction: column;
  1980. justify-content: center;
  1981. text-align: center;
  1982. padding-top: 40px;
  1983. width: 100%
  1984. }
  1985. @media(min-width:48em) {
  1986. .content-card__content {
  1987. margin-left: 64px;
  1988. align-items: flex-start;
  1989. text-align: left;
  1990. padding-top: 0;
  1991. width: calc(100% - 306px)
  1992. }
  1993. }
  1994. @media(min-width:64em) {
  1995. .content-card__content {
  1996. width: calc(100% - 448px)
  1997. }
  1998. }
  1999. .content-card__content-title {
  2000. margin: 0;
  2001. width: 100%
  2002. }
  2003. .content-card__content-sub-title {
  2004. margin-top: 8px;
  2005. margin-bottom: 0;
  2006. width: 100%
  2007. }
  2008. .content-card__content-body {
  2009. margin: 32px 0 40px;
  2010. width: 100%
  2011. }
  2012. .content-card__content-body p {
  2013. margin-top: 0;
  2014. margin-bottom: 0
  2015. }
  2016. .content-card__content-primary-button {
  2017. width: 100%
  2018. }
  2019. @media(min-width:48em) {
  2020. .content-card__content-primary-button {
  2021. width: 276px
  2022. }
  2023. }
  2024. .container {
  2025. max-width: 1280px;
  2026. margin-left: auto;
  2027. margin-right: auto;
  2028. padding-left: 20px;
  2029. padding-right: 20px
  2030. }
  2031. @media(min-width:48em) {
  2032. .container {
  2033. padding-left: 40px;
  2034. padding-right: 40px
  2035. }
  2036. }
  2037. .pco-offers-container {
  2038. max-width: 688px;
  2039. margin-left: auto;
  2040. margin-right: auto
  2041. }
  2042. @media(min-width:64em) {
  2043. .pco-offers-container {
  2044. max-width: 780px
  2045. }
  2046. }
  2047. .error-card {
  2048. text-align: center;
  2049. background-position: bottom;
  2050. padding: 25px;
  2051. border: 1px solid #f4f1f6;
  2052. box-sizing: border-box;
  2053. border-radius: 8px;
  2054. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14)
  2055. }
  2056. .error-card h1,
  2057. .error-card h2,
  2058. .error-card h3,
  2059. .error-card h4,
  2060. .error-card h5,
  2061. .error-card h6,
  2062. .error-card p {
  2063. padding: 0;
  2064. margin: 0
  2065. }
  2066. @media(min-width:48em) {
  2067. .error-card {
  2068. padding: 35px 40px 40px
  2069. }
  2070. }
  2071. .error-card-title {
  2072. margin: 8px 0
  2073. }
  2074. /*! normalize.css v9.0.1 | MIT License | github.com/csstools/normalize.css */
  2075. html {
  2076. line-height: 1.15;
  2077. -ms-text-size-adjust: 100%;
  2078. -webkit-text-size-adjust: 100%
  2079. }
  2080. h1 {
  2081. font-size: 2em;
  2082. margin: .67em 0
  2083. }
  2084. hr {
  2085. box-sizing: content-box;
  2086. height: 0;
  2087. overflow: visible
  2088. }
  2089. pre {
  2090. font-family: monospace, monospace;
  2091. font-size: 1em
  2092. }
  2093. abbr[title] {
  2094. text-decoration: underline;
  2095. text-decoration: underline dotted
  2096. }
  2097. b,
  2098. strong {
  2099. font-weight: bolder
  2100. }
  2101. code,
  2102. kbd,
  2103. samp {
  2104. font-family: monospace, monospace;
  2105. font-size: 1em
  2106. }
  2107. small {
  2108. font-size: 80%
  2109. }
  2110. button,
  2111. input,
  2112. select {
  2113. margin: 0
  2114. }
  2115. button {
  2116. text-transform: none
  2117. }
  2118. [type=button],
  2119. [type=reset],
  2120. [type=submit],
  2121. button {
  2122. -webkit-appearance: button
  2123. }
  2124. fieldset {
  2125. padding: .35em .75em .625em
  2126. }
  2127. input {
  2128. overflow: visible
  2129. }
  2130. legend {
  2131. box-sizing: border-box;
  2132. display: table;
  2133. max-width: 100%;
  2134. white-space: normal
  2135. }
  2136. progress {
  2137. display: inline-block;
  2138. vertical-align: baseline
  2139. }
  2140. select {
  2141. text-transform: none
  2142. }
  2143. textarea {
  2144. margin: 0
  2145. }
  2146. [type=search] {
  2147. -webkit-appearance: textfield;
  2148. outline-offset: -2px
  2149. }
  2150. ::-webkit-inner-spin-button,
  2151. ::-webkit-outer-spin-button {
  2152. height: auto
  2153. }
  2154. ::-webkit-input-placeholder {
  2155. color: inherit;
  2156. opacity: .54
  2157. }
  2158. ::-webkit-search-decoration {
  2159. -webkit-appearance: none
  2160. }
  2161. ::-webkit-file-upload-button {
  2162. -webkit-appearance: button;
  2163. font: inherit
  2164. }
  2165. ::-moz-focus-inner {
  2166. border-style: none;
  2167. padding: 0
  2168. }
  2169. :-moz-focusring {
  2170. outline: 1px dotted ButtonText
  2171. }
  2172. details,
  2173. dialog {
  2174. display: block
  2175. }
  2176. dialog {
  2177. background-color: #fff;
  2178. border: solid;
  2179. color: #000;
  2180. height: -moz-fit-content;
  2181. height: -webkit-fit-content;
  2182. height: fit-content;
  2183. left: 0;
  2184. margin: auto;
  2185. padding: 1em;
  2186. position: absolute;
  2187. right: 0;
  2188. width: -moz-fit-content;
  2189. width: -webkit-fit-content;
  2190. width: fit-content
  2191. }
  2192. dialog:not([open]) {
  2193. display: none
  2194. }
  2195. summary {
  2196. display: list-item
  2197. }
  2198. @keyframes enterFromBottom {
  2199. 0% {
  2200. transform: translateY(100%)
  2201. }
  2202. to {
  2203. transform: translateY(0)
  2204. }
  2205. }
  2206. .lds__privacy-policy {
  2207. box-sizing: border-box;
  2208. background-color: #666;
  2209. color: #efefef;
  2210. font-size: 1em;
  2211. line-height: 1.1875em;
  2212. font-family: Noir Std, Helvetica, -system-ui, Calibri, Arial;
  2213. font-weight: 300
  2214. }
  2215. .lds__privacy-policy__innerWrapper {
  2216. box-sizing: border-box;
  2217. padding: 16px
  2218. }
  2219. .lds__privacy-policy__innerWrapper p {
  2220. margin-top: 0
  2221. }
  2222. .lds__privacy-policy__btnClose,
  2223. .lds__privacy-policy__link:link,
  2224. .lds__privacy-policy__link:visited {
  2225. text-decoration: underline;
  2226. color: #efefef
  2227. }
  2228. .lds__privacy-policy__btnClose {
  2229. display: inline-block;
  2230. position: relative;
  2231. left: 50%;
  2232. padding: 0 1em;
  2233. border: none;
  2234. background-color: transparent;
  2235. font-size: 1em;
  2236. line-height: 1.1875em;
  2237. font-family: Noir Std, Helvetica, -system-ui, Calibri, Arial;
  2238. font-weight: 300;
  2239. transform: translateX(-50%);
  2240. cursor: pointer
  2241. }
  2242. .lds__privacy-policy__positionBottom {
  2243. position: fixed;
  2244. z-index: 9999;
  2245. left: 0;
  2246. right: 0;
  2247. bottom: 0;
  2248. transition: transform 1.5s ease-in-out 0s;
  2249. animation-duration: 1.5s;
  2250. animation-timing-function: ease-in-out;
  2251. animation-delay: 0s;
  2252. animation-iteration-count: 1;
  2253. animation-name: enterFromBottom
  2254. }
  2255. .lds__privacy-policy__positionBottom.lds__privacy-policy__closed {
  2256. transform: translateY(100%)
  2257. }
  2258. .lds__privacy-policy__positionBottom.lds__privacy-policy__closed--init {
  2259. animation: none
  2260. }
  2261. @media screen and (min-width:641px) {
  2262. .lds__privacy-policy {
  2263. line-height: 1.5em
  2264. }
  2265. }
  2266. @media screen and (min-width:1280px) {
  2267. .lds__privacy-policy__innerWrapper {
  2268. margin: auto;
  2269. max-width: 1280px
  2270. }
  2271. }
  2272. @font-face {
  2273. font-display: swap;
  2274. font-family: Noir;
  2275. font-weight: 400;
  2276. src: url(/static/fonts/noirpro-regular.otf)
  2277. }
  2278. @font-face {
  2279. font-display: swap;
  2280. font-family: Noir;
  2281. font-weight: 400;
  2282. font-style: italic;
  2283. src: url(/static/fonts/noirpro-italic.otf)
  2284. }
  2285. @font-face {
  2286. font-display: swap;
  2287. font-family: Noir;
  2288. font-weight: 700;
  2289. src: url(/static/fonts/noirpro-semibold.otf)
  2290. }
  2291. @font-face {
  2292. font-display: swap;
  2293. font-family: Noir;
  2294. font-weight: 700;
  2295. font-style: italic;
  2296. src: url(/static/fonts/noirpro-semibolditalic.otf)
  2297. }
  2298. .esso-redemption-header__title,
  2299. .type-ds-large-title {
  2300. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2301. font-size: 2.5rem;
  2302. line-height: 3rem;
  2303. font-weight: 600;
  2304. color: #403840
  2305. }
  2306. @media(min-width:48em) {
  2307. .esso-redemption-header__title,
  2308. .type-ds-large-title {
  2309. font-size: 3.875rem;
  2310. line-height: 4.375rem
  2311. }
  2312. }
  2313. .enrol-flow .flow-header__title,
  2314. .type-ds-title-1 {
  2315. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2316. font-size: 2rem;
  2317. line-height: 2.375rem;
  2318. font-weight: 600;
  2319. color: #403840
  2320. }
  2321. @media(min-width:48em) {
  2322. .enrol-flow .flow-header__title,
  2323. .type-ds-title-1 {
  2324. font-size: 2.625rem;
  2325. line-height: 3rem
  2326. }
  2327. }
  2328. .account-header__title,
  2329. .activation-card-display__points,
  2330. .download-app__title,
  2331. .esso-redemption-earning-card__title,
  2332. .modal-content .offer__reward--carousel,
  2333. .type-ds-title-2,
  2334. .your-pco-section__heading {
  2335. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2336. font-size: 1.375rem;
  2337. line-height: 1.75rem;
  2338. font-weight: 600;
  2339. color: #403840
  2340. }
  2341. @media(min-width:48em) {
  2342. .account-header__title,
  2343. .activation-card-display__points,
  2344. .download-app__title,
  2345. .esso-redemption-earning-card__title,
  2346. .modal-content .offer__reward--carousel,
  2347. .type-ds-title-2,
  2348. .your-pco-section__heading {
  2349. font-size: 2rem;
  2350. line-height: 2.25rem
  2351. }
  2352. }
  2353. .billing-history-empty-state__message h4,
  2354. .deals-for-you__subtitle,
  2355. .download-app__subtitle,
  2356. .esso-redemption-header__subtitle,
  2357. .esso-redemption-pcf__title,
  2358. .esso-redemption-redeem-cards__text-divider,
  2359. .esso-redemption-redeem-cards__title,
  2360. .loadToCard-brand-banner .layoutCard__title,
  2361. .modal-content .offer__text--carousel,
  2362. .offer-standalone__heading,
  2363. .offer__reward--carousel,
  2364. .slider-header__text--heading,
  2365. .type-ds-title-3,
  2366. .your-pco-error__tile-content-title {
  2367. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2368. font-size: 1.125rem;
  2369. line-height: 1.5rem;
  2370. font-weight: 600;
  2371. color: #403840
  2372. }
  2373. @media(min-width:48em) {
  2374. .billing-history-empty-state__message h4,
  2375. .deals-for-you__subtitle,
  2376. .download-app__subtitle,
  2377. .esso-redemption-header__subtitle,
  2378. .esso-redemption-pcf__title,
  2379. .esso-redemption-redeem-cards__text-divider,
  2380. .esso-redemption-redeem-cards__title,
  2381. .loadToCard-brand-banner .layoutCard__title,
  2382. .modal-content .offer__text--carousel,
  2383. .offer-standalone__heading,
  2384. .offer__reward--carousel,
  2385. .slider-header__text--heading,
  2386. .type-ds-title-3,
  2387. .your-pco-error__tile-content-title {
  2388. font-size: 1.5rem;
  2389. line-height: 2rem
  2390. }
  2391. }
  2392. .activation-card-display__points-label,
  2393. .billing-history__date,
  2394. .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type,
  2395. .category-btn,
  2396. .deals-for-you-tile__item,
  2397. .enrol-flow .flow-progress-bar__title,
  2398. .esso-redemption-earning-card__subtitle,
  2399. .esso-redemption-pcf__money-subtitle,
  2400. .esso-redemption-redeem-cards__text,
  2401. .expandable-form-wrapper__title,
  2402. .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder,
  2403. .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder,
  2404. .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder,
  2405. .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder,
  2406. .initial-offers-slider__slider-container__slide-content__question,
  2407. .no-subscription-plan__content h3,
  2408. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned,
  2409. .offer-content-group-carousel .offer__text,
  2410. .offer__text--carousel,
  2411. .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  2412. .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  2413. .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  2414. .quest-offer-child-offer.offer--faded .offer__reward--earned,
  2415. .quest-offer-child-offer .product-offer__content-group .offer__reward,
  2416. .subscription-plan__content h3,
  2417. .type-ds-headline {
  2418. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2419. font-size: 1rem;
  2420. line-height: 1.375rem;
  2421. font-weight: 600;
  2422. color: #403840
  2423. }
  2424. @media(min-width:48em) {
  2425. .activation-card-display__points-label,
  2426. .billing-history__date,
  2427. .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type,
  2428. .category-btn,
  2429. .deals-for-you-tile__item,
  2430. .enrol-flow .flow-progress-bar__title,
  2431. .esso-redemption-earning-card__subtitle,
  2432. .esso-redemption-pcf__money-subtitle,
  2433. .esso-redemption-redeem-cards__text,
  2434. .expandable-form-wrapper__title,
  2435. .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder,
  2436. .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder,
  2437. .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder,
  2438. .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder,
  2439. .initial-offers-slider__slider-container__slide-content__question,
  2440. .no-subscription-plan__content h3,
  2441. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned,
  2442. .offer-content-group-carousel .offer__text,
  2443. .offer__text--carousel,
  2444. .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  2445. .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  2446. .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  2447. .quest-offer-child-offer.offer--faded .offer__reward--earned,
  2448. .quest-offer-child-offer .product-offer__content-group .offer__reward,
  2449. .subscription-plan__content h3,
  2450. .type-ds-headline {
  2451. font-size: 1.125rem;
  2452. line-height: 1.5rem
  2453. }
  2454. }
  2455. .activation-card-display__redeemable-value,
  2456. .activation-card-display__redeemable-value-section,
  2457. .billing-history__amount p,
  2458. .billing-history__card--number p,
  2459. .billing-history__type,
  2460. .checkbox-group-new-ds__label,
  2461. .enrol-flow .flow-header__sub-title,
  2462. .enrol-form__expanded-legal-copy,
  2463. .esso-redemption-earning-card__text,
  2464. .esso-redemption-redeem-cards__subtext,
  2465. .flow-faq--new-design-system .flow-faq__subtitle,
  2466. .header-points__redeemable,
  2467. .hero-quest-offer .offer__text,
  2468. .initial-offers-slider__slider-container__slide-content__title,
  2469. .load-to-card-section-header .checkbox-group-new-ds__label,
  2470. .loadToCard-brand-banner .layoutCard__body,
  2471. .loadToCard-header__subtitle,
  2472. .messages__all-read,
  2473. .quest-offer .offer__text,
  2474. .redemption-perk-details .dropdown-group__dropdown,
  2475. .text-group--new-design-system .text-group__input-container--with-addon .flyers-header__input,
  2476. .text-group--new-design-system .text-group__input-container--with-addon .homepage-stores__input,
  2477. .text-group--new-design-system .text-group__input-container--with-addon .search-box__input,
  2478. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input,
  2479. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input-addon,
  2480. .type-ds-body,
  2481. .your-pco-error__tile-content-subtitle,
  2482. .your-pco-section__description,
  2483. .your-pco-section__heading+p {
  2484. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2485. font-size: .9375rem;
  2486. line-height: 1.25rem;
  2487. color: #403840
  2488. }
  2489. @media(min-width:48em) {
  2490. .activation-card-display__redeemable-value,
  2491. .activation-card-display__redeemable-value-section,
  2492. .billing-history__amount p,
  2493. .billing-history__card--number p,
  2494. .billing-history__type,
  2495. .checkbox-group-new-ds__label,
  2496. .enrol-flow .flow-header__sub-title,
  2497. .enrol-form__expanded-legal-copy,
  2498. .esso-redemption-earning-card__text,
  2499. .esso-redemption-redeem-cards__subtext,
  2500. .flow-faq--new-design-system .flow-faq__subtitle,
  2501. .header-points__redeemable,
  2502. .hero-quest-offer .offer__text,
  2503. .initial-offers-slider__slider-container__slide-content__title,
  2504. .load-to-card-section-header .checkbox-group-new-ds__label,
  2505. .loadToCard-brand-banner .layoutCard__body,
  2506. .loadToCard-header__subtitle,
  2507. .messages__all-read,
  2508. .quest-offer .offer__text,
  2509. .redemption-perk-details .dropdown-group__dropdown,
  2510. .text-group--new-design-system .text-group__input-container--with-addon .flyers-header__input,
  2511. .text-group--new-design-system .text-group__input-container--with-addon .homepage-stores__input,
  2512. .text-group--new-design-system .text-group__input-container--with-addon .search-box__input,
  2513. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input,
  2514. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input-addon,
  2515. .type-ds-body,
  2516. .your-pco-error__tile-content-subtitle,
  2517. .your-pco-section__description,
  2518. .your-pco-section__heading+p {
  2519. font-size: 1rem;
  2520. line-height: 1.375rem
  2521. }
  2522. }
  2523. .esso-redemption-earning-card__cta,
  2524. .esso-redemption-faq__faq-link-button,
  2525. .load-to-card-tile__checkbox-container .checkbox-group-new-ds__label,
  2526. .offer-footer--carousel .shoppable-offer-link,
  2527. .type-ds-button {
  2528. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2529. font-size: 1rem;
  2530. line-height: 1.125rem;
  2531. font-weight: 600;
  2532. color: #403840
  2533. }
  2534. @media(min-width:48em) {
  2535. .esso-redemption-earning-card__cta,
  2536. .esso-redemption-faq__faq-link-button,
  2537. .load-to-card-tile__checkbox-container .checkbox-group-new-ds__label,
  2538. .offer-footer--carousel .shoppable-offer-link,
  2539. .type-ds-button {
  2540. line-height: 1.375rem
  2541. }
  2542. }
  2543. .deals-for-you-tile__shop-now,
  2544. .type-ds-button-3 {
  2545. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2546. font-size: 1rem;
  2547. line-height: 1.375rem;
  2548. font-weight: 600;
  2549. color: #157a77;
  2550. text-decoration: underline;
  2551. transition: all .2s
  2552. }
  2553. .deals-for-you-tile__shop-now:focus,
  2554. .deals-for-you-tile__shop-now:hover,
  2555. .type-ds-button-3:focus,
  2556. .type-ds-button-3:hover {
  2557. color: #615395
  2558. }
  2559. .deals-for-you-tile__shop-now:active,
  2560. .type-ds-button-3:active {
  2561. color: #403840
  2562. }
  2563. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  2564. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  2565. .deals-for-you__header-cta,
  2566. .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  2567. .redeemable-perk-content__cta.button,
  2568. .redeemable-perk-content__cta.household-grid__invite-button,
  2569. .redeemable-perk-content__cta.link--theme-button,
  2570. .redeemable-perk-content__cta.link--theme-button--large-primary,
  2571. .redeemable-perk-content__cta.link--theme-button--large-secondary,
  2572. .redeemable-perk-content__cta.link--theme-button--small-primary,
  2573. .redeemable-perk-content__cta.link--theme-button--small-secondary,
  2574. .redeemable-perk-content__cta.link--theme-button-gray,
  2575. .redeemable-perk-content__cta.link--theme-button-red,
  2576. .redeemable-perk-content__cta.link--theme-button-transparent,
  2577. .redeemable-perk-content__cta.link--theme-button-transparent-white,
  2578. .redeemable-perk-content__cta.link--theme-button-white,
  2579. .redeemable-perk-content__cta.load-shop-pay-header__link,
  2580. .redeemable-perk-content__cta.load-shop-pay-module__link,
  2581. .redeemable-perk-content__cta.marketing-page-header__link,
  2582. .redeemable-perk-content__cta.marketing-page-module__link,
  2583. .redeemable-perk-content__cta.partnership-perk-details__cta,
  2584. .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  2585. .redeemable-perk-content__cta.points-days__cta,
  2586. .type-ds-text-link {
  2587. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2588. font-size: .9375rem;
  2589. line-height: 1.25rem;
  2590. color: #da291c
  2591. }
  2592. @media(min-width:48em) {
  2593. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  2594. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  2595. .deals-for-you__header-cta,
  2596. .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  2597. .redeemable-perk-content__cta.button,
  2598. .redeemable-perk-content__cta.household-grid__invite-button,
  2599. .redeemable-perk-content__cta.link--theme-button,
  2600. .redeemable-perk-content__cta.link--theme-button--large-primary,
  2601. .redeemable-perk-content__cta.link--theme-button--large-secondary,
  2602. .redeemable-perk-content__cta.link--theme-button--small-primary,
  2603. .redeemable-perk-content__cta.link--theme-button--small-secondary,
  2604. .redeemable-perk-content__cta.link--theme-button-gray,
  2605. .redeemable-perk-content__cta.link--theme-button-red,
  2606. .redeemable-perk-content__cta.link--theme-button-transparent,
  2607. .redeemable-perk-content__cta.link--theme-button-transparent-white,
  2608. .redeemable-perk-content__cta.link--theme-button-white,
  2609. .redeemable-perk-content__cta.load-shop-pay-header__link,
  2610. .redeemable-perk-content__cta.load-shop-pay-module__link,
  2611. .redeemable-perk-content__cta.marketing-page-header__link,
  2612. .redeemable-perk-content__cta.marketing-page-module__link,
  2613. .redeemable-perk-content__cta.partnership-perk-details__cta,
  2614. .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  2615. .redeemable-perk-content__cta.points-days__cta,
  2616. .type-ds-text-link {
  2617. font-size: 1rem;
  2618. line-height: 1.375rem
  2619. }
  2620. }
  2621. .ad-unit__sponsored-label,
  2622. .base-form input,
  2623. .base-form label,
  2624. .base-form label .link.primary,
  2625. .base-form select,
  2626. .billing-history-empty-state__message p,
  2627. .checklist-polling__answered-message,
  2628. .checklist-polling__not-answered-dash,
  2629. .checklist-polling__not-answered-message,
  2630. .deals-for-you-tile__text-subcopy,
  2631. .enrol-form__firstname-helper-text,
  2632. .enrol-form__privacy-copy,
  2633. .esso-redemption-ts-and-cs__accordion p,
  2634. .expandable-form-wrapper .billing-info__summary,
  2635. .expandable-form-wrapper__collapsed p,
  2636. .offer--carousel .offer-description-container .offer-description,
  2637. .offer--carousel .offer-footer-date,
  2638. .offer-footer-date,
  2639. .quest-offer-child-offer .continuity-offer__content-group .offer__text,
  2640. .quest-offer-child-offer .hero-continuity-offer__content-group .offer__text,
  2641. .quest-offer-child-offer .hero-product-offer__content-group .offer__text,
  2642. .quest-offer-child-offer .product-offer__content-group .offer__text,
  2643. .quest-offer-footer .quest-offer-footer-date,
  2644. .redemption-perk-details .dropdown-group__label span,
  2645. .shopping-list-generic-item-form .flyers-header__input,
  2646. .shopping-list-generic-item-form .homepage-stores__input,
  2647. .shopping-list-generic-item-form .search-box__input,
  2648. .shopping-list-generic-item-form .text-group__input,
  2649. .text-group--new-design-system .invitation-form__error-message,
  2650. .text-group--new-design-system .text-group__error,
  2651. .text-group--new-design-system .toggleable-container .account-setting__error,
  2652. .toggleable-container .text-group--new-design-system .account-setting__error,
  2653. .type-ds-small-text {
  2654. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2655. font-size: .75rem;
  2656. line-height: 1rem;
  2657. color: #403840
  2658. }
  2659. @media(min-width:48em) {
  2660. .ad-unit__sponsored-label,
  2661. .base-form input,
  2662. .base-form label,
  2663. .base-form label .link.primary,
  2664. .base-form select,
  2665. .billing-history-empty-state__message p,
  2666. .checklist-polling__answered-message,
  2667. .checklist-polling__not-answered-dash,
  2668. .checklist-polling__not-answered-message,
  2669. .deals-for-you-tile__text-subcopy,
  2670. .enrol-form__firstname-helper-text,
  2671. .enrol-form__privacy-copy,
  2672. .esso-redemption-ts-and-cs__accordion p,
  2673. .expandable-form-wrapper .billing-info__summary,
  2674. .expandable-form-wrapper__collapsed p,
  2675. .offer--carousel .offer-description-container .offer-description,
  2676. .offer--carousel .offer-footer-date,
  2677. .offer-footer-date,
  2678. .quest-offer-child-offer .continuity-offer__content-group .offer__text,
  2679. .quest-offer-child-offer .hero-continuity-offer__content-group .offer__text,
  2680. .quest-offer-child-offer .hero-product-offer__content-group .offer__text,
  2681. .quest-offer-child-offer .product-offer__content-group .offer__text,
  2682. .quest-offer-footer .quest-offer-footer-date,
  2683. .redemption-perk-details .dropdown-group__label span,
  2684. .shopping-list-generic-item-form .flyers-header__input,
  2685. .shopping-list-generic-item-form .homepage-stores__input,
  2686. .shopping-list-generic-item-form .search-box__input,
  2687. .shopping-list-generic-item-form .text-group__input,
  2688. .text-group--new-design-system .invitation-form__error-message,
  2689. .text-group--new-design-system .text-group__error,
  2690. .text-group--new-design-system .toggleable-container .account-setting__error,
  2691. .toggleable-container .text-group--new-design-system .account-setting__error,
  2692. .type-ds-small-text {
  2693. font-size: .875rem;
  2694. line-height: 1.25rem
  2695. }
  2696. }
  2697. .deals-for-you-feature__badge,
  2698. .dropdown-group--new-design-system .dropdown-group__label,
  2699. .input-error-new-design-system,
  2700. .load-to-card-tile__offer-expiry-date,
  2701. .text-group--new-design-system .text-group__label,
  2702. .text-group--new-design-system .text-group__subtext,
  2703. .type-ds-small-text-inter {
  2704. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2705. font-size: .75rem;
  2706. line-height: 1rem;
  2707. color: #403840
  2708. }
  2709. @media(min-width:48em) {
  2710. .deals-for-you-feature__badge,
  2711. .dropdown-group--new-design-system .dropdown-group__label,
  2712. .input-error-new-design-system,
  2713. .load-to-card-tile__offer-expiry-date,
  2714. .text-group--new-design-system .text-group__label,
  2715. .text-group--new-design-system .text-group__subtext,
  2716. .type-ds-small-text-inter {
  2717. font-size: .875rem;
  2718. line-height: 1.25rem
  2719. }
  2720. }
  2721. .activate-card__subtitle,
  2722. .billing-history__amount,
  2723. .billing-history__card--number,
  2724. .esso-redemption-ts-and-cs__accordion h3,
  2725. .esso-redemption-ts-and-cs__accordion h4,
  2726. .quest-offer-progress__indicator span,
  2727. .type-ds-small-text-strong {
  2728. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2729. font-size: .75rem;
  2730. line-height: 1rem;
  2731. font-weight: 600;
  2732. color: #403840
  2733. }
  2734. @media(min-width:48em) {
  2735. .activate-card__subtitle,
  2736. .billing-history__amount,
  2737. .billing-history__card--number,
  2738. .esso-redemption-ts-and-cs__accordion h3,
  2739. .esso-redemption-ts-and-cs__accordion h4,
  2740. .quest-offer-progress__indicator span,
  2741. .type-ds-small-text-strong {
  2742. font-size: .875rem;
  2743. line-height: 1.25rem
  2744. }
  2745. }
  2746. .initial-offers-slider__slider-container__slide-content--skipButton,
  2747. .product-love-story-details__link.product-love-story-details__link,
  2748. .type-ds-text-link-2 {
  2749. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2750. font-size: .75rem;
  2751. line-height: 1.333333333;
  2752. color: #da291c
  2753. }
  2754. @media(min-width:48em) {
  2755. .initial-offers-slider__slider-container__slide-content--skipButton,
  2756. .product-love-story-details__link.product-love-story-details__link,
  2757. .type-ds-text-link-2 {
  2758. font-size: .875rem;
  2759. line-height: 1.25rem
  2760. }
  2761. }
  2762. .homepage-hero__title,
  2763. .not-found__title,
  2764. .point-summary__title,
  2765. .type-h1 {
  2766. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2767. font-size: 3.125rem;
  2768. line-height: 1.1;
  2769. letter-spacing: -.02rem;
  2770. font-weight: 700;
  2771. color: #191919
  2772. }
  2773. @media(min-width:48em) {
  2774. .homepage-hero__title,
  2775. .not-found__title,
  2776. .point-summary__title,
  2777. .type-h1 {
  2778. font-size: 4.5rem;
  2779. line-height: 1.108108108
  2780. }
  2781. }
  2782. .contact-us-header__title,
  2783. .default-hero .homepage-hero__title,
  2784. .eflyers-subscription-header__title,
  2785. .flow-header__title,
  2786. .flyers-header__title,
  2787. .how-points-work__header,
  2788. .points-inquiry-header__title,
  2789. .store-locator-header__title,
  2790. .type-h2,
  2791. .utility-header__title {
  2792. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2793. font-size: 2rem;
  2794. line-height: 1.125;
  2795. letter-spacing: -.02rem;
  2796. font-weight: 700;
  2797. color: #191919
  2798. }
  2799. @media(min-width:48em) {
  2800. .contact-us-header__title,
  2801. .default-hero .homepage-hero__title,
  2802. .eflyers-subscription-header__title,
  2803. .flow-header__title,
  2804. .flyers-header__title,
  2805. .how-points-work__header,
  2806. .points-inquiry-header__title,
  2807. .store-locator-header__title,
  2808. .type-h2,
  2809. .utility-header__title {
  2810. font-size: 3rem;
  2811. line-height: 1.166666666
  2812. }
  2813. }
  2814. .donate-points__confirm-heading,
  2815. .flow-tile__title-text,
  2816. .household-instruction__text,
  2817. .modal-content h1,
  2818. .type-h3 {
  2819. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2820. font-size: 1.25rem;
  2821. line-height: 1.4;
  2822. font-weight: 400;
  2823. color: #191919
  2824. }
  2825. @media(min-width:48em) {
  2826. .donate-points__confirm-heading,
  2827. .flow-tile__title-text,
  2828. .household-instruction__text,
  2829. .modal-content h1,
  2830. .type-h3 {
  2831. font-size: 2rem;
  2832. line-height: 1.3125
  2833. }
  2834. }
  2835. .not-found__subtitle,
  2836. .type-h4 {
  2837. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2838. font-size: 1.5rem;
  2839. line-height: 1.166666666;
  2840. letter-spacing: -.02rem;
  2841. font-weight: 700;
  2842. color: #191919
  2843. }
  2844. @media(min-width:48em) {
  2845. .not-found__subtitle,
  2846. .type-h4 {
  2847. font-size: 2rem;
  2848. line-height: 1.25
  2849. }
  2850. }
  2851. .type-p1 {
  2852. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2853. font-size: .9375rem;
  2854. line-height: 1.4;
  2855. font-weight: 400;
  2856. color: #191919
  2857. }
  2858. @media(min-width:48em) {
  2859. .type-p1 {
  2860. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2861. font-size: 1.75rem;
  2862. line-height: 1.142857143
  2863. }
  2864. }
  2865. .accept-invitation-full-house__title,
  2866. .accept-invitation-info__title,
  2867. .checklist-how-points-work__header,
  2868. .checklist__header h2,
  2869. .contest-rules-page__heading,
  2870. .field-set__header,
  2871. .flyer-result__header,
  2872. .homepage-province-stores__title,
  2873. .how-points-work-tile__title,
  2874. .legal-page__heading,
  2875. .login-page__title,
  2876. .more-ways-to-shop h1,
  2877. .offer-savedempty__title,
  2878. .offer__reward,
  2879. .offer__reward--earned,
  2880. .offers-container-empty__header,
  2881. .pc-insiders-subscription__highlighted-number,
  2882. .pc-insiders-subscription__tile-value,
  2883. .point-event__diff-value,
  2884. .point-event__dollar-savings,
  2885. .points-summary__inner,
  2886. .promoted-action__title,
  2887. .store-details-section__title,
  2888. .submission-message__header,
  2889. .type-p2,
  2890. .utility-section__title,
  2891. .weekly-flyer-opt-in__title,
  2892. .what-to-expect-in-store h1 {
  2893. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2894. font-size: 1.125rem;
  2895. line-height: 1.333333333;
  2896. letter-spacing: -.02rem;
  2897. font-weight: 700;
  2898. color: #191919
  2899. }
  2900. @media(min-width:48em) {
  2901. .accept-invitation-full-house__title,
  2902. .accept-invitation-info__title,
  2903. .checklist-how-points-work__header,
  2904. .checklist__header h2,
  2905. .contest-rules-page__heading,
  2906. .field-set__header,
  2907. .flyer-result__header,
  2908. .homepage-province-stores__title,
  2909. .how-points-work-tile__title,
  2910. .legal-page__heading,
  2911. .login-page__title,
  2912. .more-ways-to-shop h1,
  2913. .offer-savedempty__title,
  2914. .offer__reward,
  2915. .offer__reward--earned,
  2916. .offers-container-empty__header,
  2917. .pc-insiders-subscription__highlighted-number,
  2918. .pc-insiders-subscription__tile-value,
  2919. .point-event__diff-value,
  2920. .point-event__dollar-savings,
  2921. .points-summary__inner,
  2922. .promoted-action__title,
  2923. .store-details-section__title,
  2924. .submission-message__header,
  2925. .type-p2,
  2926. .utility-section__title,
  2927. .weekly-flyer-opt-in__title,
  2928. .what-to-expect-in-store h1 {
  2929. font-size: 1.5rem;
  2930. line-height: 1.333333333
  2931. }
  2932. }
  2933. .already-claimed__title,
  2934. .contest-rules-page__section-title,
  2935. .flow-faq__title,
  2936. .flyer-store-details__contact-header,
  2937. .household-link-account__title,
  2938. .household-member__name,
  2939. .info-window__button,
  2940. .info-window__title,
  2941. .legacy-transfer__description,
  2942. .legal-page__section-title,
  2943. .point-event__title,
  2944. .search-result-item__distance,
  2945. .search-result-item__name,
  2946. .tab-bar__button,
  2947. .tab-bar__link,
  2948. .toggleable-drawer-content__subtitle,
  2949. .type-p3 {
  2950. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  2951. font-size: 1.125rem;
  2952. line-height: 1.333333333;
  2953. letter-spacing: -.02rem;
  2954. font-weight: 700;
  2955. color: #191919
  2956. }
  2957. @media(min-width:48em) {
  2958. .already-claimed__title,
  2959. .contest-rules-page__section-title,
  2960. .flow-faq__title,
  2961. .flyer-store-details__contact-header,
  2962. .household-link-account__title,
  2963. .household-member__name,
  2964. .info-window__button,
  2965. .info-window__title,
  2966. .legacy-transfer__description,
  2967. .legal-page__section-title,
  2968. .point-event__title,
  2969. .search-result-item__distance,
  2970. .search-result-item__name,
  2971. .tab-bar__button,
  2972. .tab-bar__link,
  2973. .toggleable-drawer-content__subtitle,
  2974. .type-p3 {
  2975. font-size: 1.125rem;
  2976. line-height: 1.555555556
  2977. }
  2978. }
  2979. .accept-invitation-info__member,
  2980. .donate-points__charity-heading,
  2981. .pc-insiders-subscription__subtitle,
  2982. .type-p4 {
  2983. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  2984. font-size: .9375rem;
  2985. line-height: 1.4;
  2986. font-weight: 400;
  2987. color: #191919
  2988. }
  2989. @media(min-width:48em) {
  2990. .accept-invitation-info__member,
  2991. .donate-points__charity-heading,
  2992. .pc-insiders-subscription__subtitle,
  2993. .type-p4 {
  2994. font-size: 1.125rem;
  2995. line-height: 1.555555556
  2996. }
  2997. }
  2998. .offers-section-header h1,
  2999. .type-offer-header {
  3000. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3001. font-size: 1.375rem;
  3002. line-height: 1.28;
  3003. font-weight: 700;
  3004. color: #403840
  3005. }
  3006. @media(min-width:48em) {
  3007. .offers-section-header h1,
  3008. .type-offer-header {
  3009. font-size: 2rem;
  3010. line-height: 1.125
  3011. }
  3012. }
  3013. .offers-section-header__description,
  3014. .type-offer-header-copy {
  3015. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3016. font-size: .9375rem;
  3017. line-height: 1.4;
  3018. font-weight: 400;
  3019. color: #f86457
  3020. }
  3021. @media(min-width:48em) {
  3022. .offers-section-header__description,
  3023. .type-offer-header-copy {
  3024. font-size: 1;
  3025. line-height: 1.3333
  3026. }
  3027. }
  3028. .error-offer-tile__content-header,
  3029. .type-offer-header-error {
  3030. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3031. font-size: 1.125rem;
  3032. line-height: 1.333333333;
  3033. font-weight: 700;
  3034. color: #191919
  3035. }
  3036. @media(min-width:48em) {
  3037. .error-offer-tile__content-header,
  3038. .type-offer-header-error {
  3039. font-size: 1.5rem;
  3040. line-height: 1.166666666
  3041. }
  3042. }
  3043. .account-device__legacy-type,
  3044. .account-device__nickname,
  3045. .account-setting__value,
  3046. .checkbox-group,
  3047. .contest-rules-page__body,
  3048. .contest-rules-page h3,
  3049. .error-offer-tile__content-body,
  3050. .error-tile,
  3051. .flow-faq__link,
  3052. .flyer__missing-flyers-text,
  3053. .flyers-header__input,
  3054. .homepage-stores__input,
  3055. .household-link-account__text,
  3056. .how-points-work-rule__subtext,
  3057. .how-points-work-rule__title,
  3058. .how-points-work-tile-footer__footer-text,
  3059. .how-points-work-tile__subtitle,
  3060. .legal-page__body,
  3061. .legal-page h3,
  3062. .modal-content--scrollable .offer-content-group-carousel-wrapper.offers-modal__scroll-content p,
  3063. .point-event__transaction-inquiry,
  3064. .redemption-message__text,
  3065. .refine-search__services-radio-group-single,
  3066. .search-box__input,
  3067. .system-message,
  3068. .text-group__input,
  3069. .type-body1,
  3070. body {
  3071. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3072. font-size: .9375rem;
  3073. line-height: 1.4;
  3074. font-weight: 400;
  3075. color: #191919
  3076. }
  3077. @media(min-width:48em) {
  3078. .account-device__legacy-type,
  3079. .account-device__nickname,
  3080. .account-setting__value,
  3081. .checkbox-group,
  3082. .contest-rules-page__body,
  3083. .contest-rules-page h3,
  3084. .error-offer-tile__content-body,
  3085. .error-tile,
  3086. .flow-faq__link,
  3087. .flyer__missing-flyers-text,
  3088. .flyers-header__input,
  3089. .homepage-stores__input,
  3090. .household-link-account__text,
  3091. .how-points-work-rule__subtext,
  3092. .how-points-work-rule__title,
  3093. .how-points-work-tile-footer__footer-text,
  3094. .how-points-work-tile__subtitle,
  3095. .legal-page__body,
  3096. .legal-page h3,
  3097. .modal-content--scrollable .offer-content-group-carousel-wrapper.offers-modal__scroll-content p,
  3098. .point-event__transaction-inquiry,
  3099. .redemption-message__text,
  3100. .refine-search__services-radio-group-single,
  3101. .search-box__input,
  3102. .system-message,
  3103. .text-group__input,
  3104. .type-body1,
  3105. body {
  3106. font-size: 1rem;
  3107. line-height: 1.5
  3108. }
  3109. }
  3110. .offer__text,
  3111. .type-offer-body1 {
  3112. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3113. font-size: .9375rem;
  3114. line-height: 1.4;
  3115. font-weight: 400;
  3116. color: #403840
  3117. }
  3118. @media(min-width:48em) {
  3119. .offer__text,
  3120. .type-offer-body1 {
  3121. font-size: 1rem;
  3122. line-height: 1.5
  3123. }
  3124. }
  3125. .accept-invitation-full-house__body,
  3126. .account-setting__form-info,
  3127. .contest-rules-page__subheading,
  3128. .donate-points__charity-subheading,
  3129. .flow-faq__subtitle,
  3130. .flow-tile__body-text,
  3131. .flyer-result__address,
  3132. .flyer-result__content p,
  3133. .flyer-store-details__contact-address,
  3134. .flyers-header__subtitle,
  3135. .homepage-legacy__item,
  3136. .homepage-offers-grid__square,
  3137. .info-window__address1,
  3138. .info-window__address2,
  3139. .legal-page__subheading,
  3140. .offers-container-empty__body,
  3141. .offers-count,
  3142. .promoted-action__message,
  3143. .search-result-item__address1,
  3144. .search-result-item__address2,
  3145. .store-details-header__name,
  3146. .store-locator-header__subtitle,
  3147. .toggleable-drawer-content__text,
  3148. .type-body2,
  3149. .update-email-form__info,
  3150. .utility-header__subtitle,
  3151. .utility-section__subtitle {
  3152. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  3153. font-size: .9375rem;
  3154. line-height: 1.4;
  3155. font-weight: 400;
  3156. color: #191919
  3157. }
  3158. @media(min-width:48em) {
  3159. .accept-invitation-full-house__body,
  3160. .account-setting__form-info,
  3161. .contest-rules-page__subheading,
  3162. .donate-points__charity-subheading,
  3163. .flow-faq__subtitle,
  3164. .flow-tile__body-text,
  3165. .flyer-result__address,
  3166. .flyer-result__content p,
  3167. .flyer-store-details__contact-address,
  3168. .flyers-header__subtitle,
  3169. .homepage-legacy__item,
  3170. .homepage-offers-grid__square,
  3171. .info-window__address1,
  3172. .info-window__address2,
  3173. .legal-page__subheading,
  3174. .offers-container-empty__body,
  3175. .offers-count,
  3176. .promoted-action__message,
  3177. .search-result-item__address1,
  3178. .search-result-item__address2,
  3179. .store-details-header__name,
  3180. .store-locator-header__subtitle,
  3181. .toggleable-drawer-content__text,
  3182. .type-body2,
  3183. .update-email-form__info,
  3184. .utility-header__subtitle,
  3185. .utility-section__subtitle {
  3186. font-size: 1rem;
  3187. line-height: 1.5
  3188. }
  3189. }
  3190. .account-device__bullet,
  3191. .account-device__last-four,
  3192. .account-device__legacy-description,
  3193. .account-device__secondary-info,
  3194. .account-device__state,
  3195. .account-setting__form-info--sub-info,
  3196. .call-centre-details__availability,
  3197. .checklist-how-points-work__subcopy,
  3198. .checklist-item__subcopy,
  3199. .communication-opt-in-form__affiliates,
  3200. .copy-invite-link,
  3201. .household-member__copy-link,
  3202. .household-member__expiry,
  3203. .offer-badge,
  3204. .offer-details__cta-label,
  3205. .offer-details__cta-notice,
  3206. .pc-insiders-subscription__tile-value-sub-text,
  3207. .point-event-category-details__list,
  3208. .point-event-notification__message,
  3209. .point-event-offer,
  3210. .point-event__pts-label,
  3211. .point-event__subtitle,
  3212. .progress-bar__ratio,
  3213. .registration-page__all-fields-required,
  3214. .site-footer__copyright,
  3215. .text-group__label-optional-text,
  3216. .type-subcopy,
  3217. .utility-section__right-title,
  3218. .video-tile__subcopy {
  3219. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3220. font-size: .75rem;
  3221. line-height: 1.333333333;
  3222. font-weight: 400;
  3223. color: #585858
  3224. }
  3225. @media(min-width:48em) {
  3226. .account-device__bullet,
  3227. .account-device__last-four,
  3228. .account-device__legacy-description,
  3229. .account-device__secondary-info,
  3230. .account-device__state,
  3231. .account-setting__form-info--sub-info,
  3232. .call-centre-details__availability,
  3233. .checklist-how-points-work__subcopy,
  3234. .checklist-item__subcopy,
  3235. .communication-opt-in-form__affiliates,
  3236. .copy-invite-link,
  3237. .household-member__copy-link,
  3238. .household-member__expiry,
  3239. .offer-badge,
  3240. .offer-details__cta-label,
  3241. .offer-details__cta-notice,
  3242. .pc-insiders-subscription__tile-value-sub-text,
  3243. .point-event-category-details__list,
  3244. .point-event-notification__message,
  3245. .point-event-offer,
  3246. .point-event__pts-label,
  3247. .point-event__subtitle,
  3248. .progress-bar__ratio,
  3249. .registration-page__all-fields-required,
  3250. .site-footer__copyright,
  3251. .text-group__label-optional-text,
  3252. .type-subcopy,
  3253. .utility-section__right-title,
  3254. .video-tile__subcopy {
  3255. font-size: .875rem;
  3256. line-height: 1.25rem
  3257. }
  3258. }
  3259. .flyer__date,
  3260. .offer__subcopy,
  3261. .site-footer__app-links-paragraph,
  3262. .site-footer__tagline,
  3263. .type-offer-subcopy {
  3264. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3265. font-size: .75rem;
  3266. line-height: 1.333333333;
  3267. font-weight: 400;
  3268. color: #655c6c
  3269. }
  3270. @media(min-width:48em) {
  3271. .flyer__date,
  3272. .offer__subcopy,
  3273. .site-footer__app-links-paragraph,
  3274. .site-footer__tagline,
  3275. .type-offer-subcopy {
  3276. font-size: .875rem;
  3277. line-height: 1.25rem
  3278. }
  3279. }
  3280. .point-event-category-details__sub-header,
  3281. .type-subcopy-bold {
  3282. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3283. font-size: .75rem;
  3284. line-height: 1.333333333;
  3285. font-weight: 600;
  3286. color: #191919
  3287. }
  3288. @media(min-width:48em) {
  3289. .point-event-category-details__sub-header,
  3290. .type-subcopy-bold {
  3291. font-size: .875rem;
  3292. line-height: 1.25rem
  3293. }
  3294. }
  3295. .site-footer__social-media-link,
  3296. .type-link1 {
  3297. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3298. font-size: .9375rem;
  3299. line-height: 1.4;
  3300. font-weight: 400;
  3301. color: #ee3124;
  3302. text-decoration: underline
  3303. }
  3304. @media(min-width:48em) {
  3305. .site-footer__social-media-link,
  3306. .type-link1 {
  3307. font-size: 1rem;
  3308. line-height: 1.75
  3309. }
  3310. }
  3311. .checklist-item__watch-how-link,
  3312. .donate-points .donate-points-form__forgot-password,
  3313. .info-window__hours,
  3314. .info-window__service,
  3315. .promoted-action__decline,
  3316. .search-result-item__hours,
  3317. .search-result-item__service,
  3318. .site-footer__app-links-link,
  3319. .type-link2,
  3320. .weekly-flyer-opt-in__message {
  3321. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3322. font-size: .75rem;
  3323. line-height: 1.333333333;
  3324. font-weight: 400;
  3325. color: #585858;
  3326. text-decoration: underline
  3327. }
  3328. .checklist-item__watch-how-link:hover,
  3329. .donate-points .donate-points-form__forgot-password:hover,
  3330. .info-window__hours:hover,
  3331. .info-window__service:hover,
  3332. .promoted-action__decline:hover,
  3333. .search-result-item__hours:hover,
  3334. .search-result-item__service:hover,
  3335. .site-footer__app-links-link:hover,
  3336. .type-link2:hover,
  3337. .weekly-flyer-opt-in__message:hover {
  3338. color: #191919
  3339. }
  3340. @media(min-width:48em) {
  3341. .checklist-item__watch-how-link,
  3342. .donate-points .donate-points-form__forgot-password,
  3343. .info-window__hours,
  3344. .info-window__service,
  3345. .promoted-action__decline,
  3346. .search-result-item__hours,
  3347. .search-result-item__service,
  3348. .site-footer__app-links-link,
  3349. .type-link2,
  3350. .weekly-flyer-opt-in__message {
  3351. font-size: .875rem;
  3352. line-height: 1.25rem
  3353. }
  3354. }
  3355. .site-footer__links-title,
  3356. .type-footertitle {
  3357. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3358. font-size: .9375rem;
  3359. line-height: 1.4;
  3360. font-weight: 700;
  3361. color: #191919
  3362. }
  3363. @media(min-width:48em) {
  3364. .site-footer__links-title,
  3365. .type-footertitle {
  3366. font-size: 1rem;
  3367. line-height: 1.5
  3368. }
  3369. }
  3370. .assign-card-form__member-title,
  3371. .flyer-result--disabled .offer-details__saved-title,
  3372. .household-instruction__title,
  3373. .locale-toggle,
  3374. .offer--disabled .offer-details__saved-title,
  3375. .offers-preview .offer--invalid .offer-details__saved-title,
  3376. .point-event-category-details__header-category-name,
  3377. .point-event-category-details__header-points,
  3378. .point-event-category-details__header-savings,
  3379. .point-event-category-details__header-total,
  3380. .point-event__dollar-total,
  3381. .points-summary-tile__title,
  3382. .refine-search__title h3,
  3383. .site-footer__app-links-title,
  3384. .toggleable-drawer-content__title,
  3385. .type-eyebrow {
  3386. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3387. font-size: .75rem;
  3388. line-height: 1.333333333;
  3389. letter-spacing: .03rem;
  3390. font-weight: 700;
  3391. color: #191919;
  3392. text-transform: uppercase
  3393. }
  3394. @media(min-width:48em) {
  3395. .assign-card-form__member-title,
  3396. .flyer-result--disabled .offer-details__saved-title,
  3397. .household-instruction__title,
  3398. .locale-toggle,
  3399. .offer--disabled .offer-details__saved-title,
  3400. .offers-preview .offer--invalid .offer-details__saved-title,
  3401. .point-event-category-details__header-category-name,
  3402. .point-event-category-details__header-points,
  3403. .point-event-category-details__header-savings,
  3404. .point-event-category-details__header-total,
  3405. .point-event__dollar-total,
  3406. .points-summary-tile__title,
  3407. .refine-search__title h3,
  3408. .site-footer__app-links-title,
  3409. .toggleable-drawer-content__title,
  3410. .type-eyebrow {
  3411. font-size: .875rem;
  3412. line-height: 1.25rem;
  3413. letter-spacing: .05rem
  3414. }
  3415. }
  3416. .flyer__state,
  3417. .load-to-card-tile-brand-banner__banner-exclusive-text,
  3418. .offer-banner__text,
  3419. .type-offer-eyebrow {
  3420. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3421. font-size: .75rem;
  3422. line-height: 1.333333333;
  3423. font-weight: 400;
  3424. text-transform: uppercase
  3425. }
  3426. @media(min-width:48em) {
  3427. .flyer__state,
  3428. .load-to-card-tile-brand-banner__banner-exclusive-text,
  3429. .offer-banner__text,
  3430. .type-offer-eyebrow {
  3431. font-size: .875rem;
  3432. line-height: 1.25rem
  3433. }
  3434. }
  3435. .dropdown-group__label,
  3436. .points-summary__container--precombined .points-summary__inner,
  3437. .points-summary__redeemable,
  3438. .text-group__label,
  3439. .type-form-label {
  3440. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3441. font-size: .75rem;
  3442. line-height: 1.333333333;
  3443. letter-spacing: .05em;
  3444. font-weight: 400;
  3445. color: #191919
  3446. }
  3447. @media(min-width:48em) {
  3448. .dropdown-group__label,
  3449. .points-summary__container--precombined .points-summary__inner,
  3450. .points-summary__redeemable,
  3451. .text-group__label,
  3452. .type-form-label {
  3453. font-size: .875rem;
  3454. line-height: 1.25rem
  3455. }
  3456. }
  3457. .account-setting--communication .account-setting__terms,
  3458. .account-setting__label,
  3459. .checkbox-group__error,
  3460. .donate-points .donate-points-form__hint,
  3461. .dropdown-group__error-text,
  3462. .form-error__error-text,
  3463. .invitation-form__error-message,
  3464. .menu-panel__section-title,
  3465. .text-group__error,
  3466. .text-group__subtext,
  3467. .toggleable-container .account-setting__error,
  3468. .type-form-subtext {
  3469. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3470. font-size: .75rem;
  3471. line-height: 1.333333333;
  3472. font-weight: 400;
  3473. color: #585858
  3474. }
  3475. @media(min-width:48em) {
  3476. .account-setting--communication .account-setting__terms,
  3477. .account-setting__label,
  3478. .checkbox-group__error,
  3479. .donate-points .donate-points-form__hint,
  3480. .dropdown-group__error-text,
  3481. .form-error__error-text,
  3482. .invitation-form__error-message,
  3483. .menu-panel__section-title,
  3484. .text-group__error,
  3485. .text-group__subtext,
  3486. .toggleable-container .account-setting__error,
  3487. .type-form-subtext {
  3488. font-size: .875rem;
  3489. line-height: 1.25rem
  3490. }
  3491. }
  3492. .esso-redemption-faq__title,
  3493. .homepage-app__title,
  3494. .homepage-faq__title,
  3495. .homepage-join__title,
  3496. .homepage-legacy__title,
  3497. .homepage-offers__title,
  3498. .homepage-pcf__title,
  3499. .homepage-stores__title,
  3500. .offers-preview__title,
  3501. .type-homepage-title {
  3502. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3503. font-size: 2rem;
  3504. line-height: 1.176470588;
  3505. letter-spacing: -.02rem;
  3506. font-weight: 700;
  3507. color: #ee3124
  3508. }
  3509. @media(min-width:48em) {
  3510. .esso-redemption-faq__title,
  3511. .homepage-app__title,
  3512. .homepage-faq__title,
  3513. .homepage-join__title,
  3514. .homepage-legacy__title,
  3515. .homepage-offers__title,
  3516. .homepage-pcf__title,
  3517. .homepage-stores__title,
  3518. .offers-preview__title,
  3519. .type-homepage-title {
  3520. font-size: 3rem;
  3521. line-height: 1.166666666
  3522. }
  3523. }
  3524. .default-hero .homepage-hero__subtitle,
  3525. .homepage-app__subtitle,
  3526. .homepage-hero__subtitle,
  3527. .homepage-join__subtitle,
  3528. .homepage-offers__subtitle,
  3529. .homepage-pcf__subtitle,
  3530. .homepage-stores__subtitle,
  3531. .type-homepage-subtitle {
  3532. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3533. font-size: 1.375rem;
  3534. line-height: 1.363636364;
  3535. font-weight: 400;
  3536. color: #191919
  3537. }
  3538. @media(min-width:48em) {
  3539. .default-hero .homepage-hero__subtitle,
  3540. .homepage-app__subtitle,
  3541. .homepage-hero__subtitle,
  3542. .homepage-join__subtitle,
  3543. .homepage-offers__subtitle,
  3544. .homepage-pcf__subtitle,
  3545. .homepage-stores__subtitle,
  3546. .type-homepage-subtitle {
  3547. font-size: 1.5625rem;
  3548. line-height: 1.2
  3549. }
  3550. }
  3551. .type-scan-app-h1 {
  3552. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3553. font-size: 2.5rem;
  3554. line-height: 2.625rem;
  3555. font-weight: 700;
  3556. color: #ee3124
  3557. }
  3558. @media(min-width:48em) {
  3559. .type-scan-app-h1 {
  3560. font-size: 4rem;
  3561. line-height: 3.75rem
  3562. }
  3563. }
  3564. .type-scan-app-h2 {
  3565. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3566. font-size: 1.31rem;
  3567. line-height: 1.625rem;
  3568. letter-spacing: -.02rem;
  3569. font-weight: 700;
  3570. color: #403840
  3571. }
  3572. @media(min-width:48em) {
  3573. .type-scan-app-h2 {
  3574. font-size: 2rem;
  3575. line-height: 2.25rem
  3576. }
  3577. }
  3578. .type-scan-app-h3 {
  3579. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3580. font-size: 1.125rem;
  3581. line-height: 1.375rem;
  3582. letter-spacing: -.02rem;
  3583. font-weight: 700;
  3584. color: #403840
  3585. }
  3586. @media(min-width:48em) {
  3587. .type-scan-app-h3 {
  3588. font-size: 1.31rem;
  3589. line-height: 1.4rem
  3590. }
  3591. }
  3592. .type-scan-app-subcopy {
  3593. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3594. font-size: .75rem;
  3595. line-height: 1.066rem;
  3596. color: #655c6c
  3597. }
  3598. @media(min-width:48em) {
  3599. .type-scan-app-subcopy {
  3600. font-size: 1rem;
  3601. line-height: 1.1875rem
  3602. }
  3603. }
  3604. .type-scan-app-p1 {
  3605. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3606. font-size: .875rem;
  3607. line-height: 1.375rem;
  3608. color: #655c6c
  3609. }
  3610. @media(min-width:48em) {
  3611. .type-scan-app-p1 {
  3612. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3613. font-size: 1.125rem;
  3614. line-height: 1.56rem
  3615. }
  3616. }
  3617. .type-scan-app-p2 {
  3618. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3619. font-size: .9375rem;
  3620. line-height: 1.375rem;
  3621. color: #655c6c
  3622. }
  3623. @media(min-width:48em) {
  3624. .type-scan-app-p2 {
  3625. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3626. font-size: .875rem;
  3627. line-height: 1.375rem
  3628. }
  3629. }
  3630. .type-scan-app-p3 {
  3631. font-size: .875rem;
  3632. line-height: 1.25rem
  3633. }
  3634. .type-scan-app-p3,
  3635. .type-scan-app-p4 {
  3636. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3637. color: #655c6c
  3638. }
  3639. .type-scan-app-p4 {
  3640. font-size: 1rem;
  3641. line-height: 1.5rem;
  3642. font-weight: 700
  3643. }
  3644. .type-dashboard-error-full-title,
  3645. .your-pco-error__full-content-title {
  3646. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  3647. font-size: 1.375rem;
  3648. line-height: 1.166666666;
  3649. color: #403840
  3650. }
  3651. @media(min-width:34.375em) {
  3652. .type-dashboard-error-full-title,
  3653. .your-pco-error__full-content-title {
  3654. font-size: 2.625rem;
  3655. line-height: 3rem
  3656. }
  3657. }
  3658. .type-dashboard-error-full-subtitle,
  3659. .your-pco-error__full-content-subtitle {
  3660. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  3661. font-size: .75rem;
  3662. line-height: 1rem;
  3663. color: #403840
  3664. }
  3665. @media(min-width:34.375em) {
  3666. .type-dashboard-error-full-subtitle,
  3667. .your-pco-error__full-content-subtitle {
  3668. font-size: 1rem;
  3669. line-height: 1.375rem
  3670. }
  3671. }
  3672. *,
  3673. :after,
  3674. :before {
  3675. box-sizing: inherit
  3676. }
  3677. html {
  3678. box-sizing: border-box;
  3679. font-size: 100%
  3680. }
  3681. body {
  3682. margin: 0
  3683. }
  3684. a {
  3685. color: #da291c;
  3686. text-decoration: underline;
  3687. transition: color .1s
  3688. }
  3689. a:hover {
  3690. color: #982822
  3691. }
  3692. button,
  3693. input,
  3694. select,
  3695. textarea {
  3696. font: inherit
  3697. }
  3698. .app-root {
  3699. min-width: 320px
  3700. }
  3701. .lines-to-paragraph--spacing {
  3702. white-space: pre-line
  3703. }
  3704. .clearfix:after,
  3705. .clearfix:before,
  3706. .homepage-hero__faq-link:after,
  3707. .homepage-hero__faq-link:before,
  3708. .homepage-hero__login-link:after,
  3709. .homepage-hero__login-link:before {
  3710. content: "";
  3711. display: table
  3712. }
  3713. .clearfix:after,
  3714. .homepage-hero__faq-link:after,
  3715. .homepage-hero__login-link:after {
  3716. clear: both
  3717. }
  3718. .no-scroll {
  3719. overflow: hidden
  3720. }
  3721. .no-scroll-ios {
  3722. position: fixed;
  3723. width: 100%;
  3724. height: 100%
  3725. }
  3726. .full-width {
  3727. flex-basis: 100%;
  3728. width: 100%
  3729. }
  3730. .offer--diminish,
  3731. .remove-shadow {
  3732. box-shadow: none;
  3733. border: none
  3734. }
  3735. .offers-section-width {
  3736. max-width: 688px;
  3737. margin-left: auto;
  3738. margin-right: auto
  3739. }
  3740. @media(min-width:64em) {
  3741. .offers-section-width {
  3742. max-width: 780px
  3743. }
  3744. }
  3745. .button--theme-visible-only-onfocus,
  3746. .button--theme-visible-only-onfocus-link-style,
  3747. .checkbox-group-new-ds__input,
  3748. .checkbox-group__input,
  3749. .partnership-perk-redeemed-success-details__copy-code-copied-message,
  3750. .radio-group__input,
  3751. .refine-search__services-radio-input,
  3752. .visually-hidden {
  3753. border: 0;
  3754. clip: rect(0 0 0 0);
  3755. height: 1px;
  3756. margin: -1px;
  3757. overflow: hidden;
  3758. padding: 0;
  3759. position: absolute;
  3760. width: 1px
  3761. }
  3762. .button--theme-visible-only-onfocus-link-style:active,
  3763. .button--theme-visible-only-onfocus-link-style:focus,
  3764. .button--theme-visible-only-onfocus:active,
  3765. .button--theme-visible-only-onfocus:focus,
  3766. .visually-hidden--focusable:active,
  3767. .visually-hidden--focusable:focus {
  3768. clip: auto;
  3769. height: auto;
  3770. margin: 0;
  3771. overflow: visible;
  3772. position: relative;
  3773. width: auto
  3774. }
  3775. .button--theme-visible-only-onfocus-link-style:active.skip-navigation,
  3776. .button--theme-visible-only-onfocus-link-style:focus.skip-navigation,
  3777. .button--theme-visible-only-onfocus:active.skip-navigation,
  3778. .button--theme-visible-only-onfocus:focus.skip-navigation,
  3779. .visually-hidden--focusable:active.skip-navigation,
  3780. .visually-hidden--focusable:focus.skip-navigation {
  3781. position: fixed;
  3782. z-index: 101;
  3783. top: 5px;
  3784. left: 5px;
  3785. padding: 2px;
  3786. background: #fff
  3787. }
  3788. .a11y-anchor:focus:target,
  3789. .focusable-element-focus-style,
  3790. .form-error__error-text:focus,
  3791. .offer-checkmark__input:focus+.offer-checkmark__label,
  3792. .offer-checkmark__label:focus,
  3793. .refine-search__stores-radio-input:focus+.refine-search__stores-radio-input-label,
  3794. [role=button]:focus,
  3795. [role=link]:focus,
  3796. [role=menuitem]:focus,
  3797. a:focus,
  3798. button:focus,
  3799. iframe:focus {
  3800. outline: 2px auto -webkit-focus-ring-color
  3801. }
  3802. .checkbox-group__input:focus+.checkbox-group__icon,
  3803. .checkbox-group__input:focus+.refine-search__services-radio-checkbox-icon,
  3804. .focusable-element-focus-style--alternative,
  3805. .radio-group__input:focus+.radio-group__label:before,
  3806. .refine-search__services-radio-input:focus+.checkbox-group__icon,
  3807. .refine-search__services-radio-input:focus+.refine-search__services-radio-checkbox-icon,
  3808. input:focus,
  3809. textarea:focus {
  3810. outline: none;
  3811. box-shadow: 0 0 0 2px -webkit-focus-ring-color
  3812. }
  3813. .a11y-popup-wrapper:hover [aria-expanded=true]:focus,
  3814. .dropdown-group__button[aria-expanded=true]:focus,
  3815. .flyer-store-details:hover .flyer-store-details__button:focus,
  3816. .focusable-element-focus-reset,
  3817. .offer-checkmark__input:active+.offer-checkmark__label,
  3818. .offer-checkmark__input:focus,
  3819. [role=button]:focus:active,
  3820. [role=button]:focus:hover,
  3821. [role=link]:focus:active,
  3822. [role=link]:focus:hover,
  3823. [role=menuitem]:focus:active,
  3824. [role=menuitem]:focus:hover,
  3825. a:focus:active,
  3826. a:focus:hover,
  3827. button:focus:active,
  3828. button:focus:hover,
  3829. iframe:focus:active,
  3830. iframe:focus:hover {
  3831. outline: none
  3832. }
  3833. .a11y-anchor {
  3834. outline-style: none
  3835. }
  3836. fieldset {
  3837. margin: auto 0;
  3838. padding: 0;
  3839. min-width: auto;
  3840. border: none
  3841. }
  3842. legend {
  3843. float: left;
  3844. display: block
  3845. }
  3846. input[type=number] {
  3847. -webkit-appearance: textfield;
  3848. -moz-appearance: textfield;
  3849. appearance: textfield
  3850. }
  3851. input[type=number]::-webkit-inner-spin-button,
  3852. input[type=number]::-webkit-outer-spin-button {
  3853. -webkit-appearance: none;
  3854. appearance: none;
  3855. margin: 0
  3856. }
  3857. @media print {
  3858. .checklist-container,
  3859. .homepage-hero,
  3860. .menu,
  3861. .notifications-container,
  3862. .site-footer {
  3863. display: none
  3864. }
  3865. .tab-bar__inner {
  3866. justify-content: center
  3867. }
  3868. .tab-bar__button {
  3869. display: none
  3870. }
  3871. .tab-bar__button--active {
  3872. display: block
  3873. }
  3874. }
  3875. .ada-button-frame {
  3876. display: none !important
  3877. }
  3878. .page-container {
  3879. display: flex;
  3880. flex-flow: column nowrap;
  3881. width: 100%;
  3882. min-height: 100vh;
  3883. padding-top: 55px
  3884. }
  3885. @media(min-width:64.0625em) {
  3886. .page-container {
  3887. padding-top: 80px
  3888. }
  3889. }
  3890. .page-container__contents,
  3891. .page-container__sticky-container {
  3892. display: flex;
  3893. flex-flow: column nowrap;
  3894. flex-grow: 1
  3895. }
  3896. .page-container--chromeless {
  3897. padding-top: 0
  3898. }
  3899. .page-container--chromeless .tab-bar {
  3900. display: none
  3901. }
  3902. .page-container__sticky-container>.error-tile {
  3903. max-width: 1280px;
  3904. margin: 60px auto 100px;
  3905. padding-left: 20px;
  3906. padding-right: 20px
  3907. }
  3908. @media(min-width:48em) {
  3909. .page-container__sticky-container>.error-tile {
  3910. padding-left: 40px;
  3911. padding-right: 40px
  3912. }
  3913. }
  3914. .page-container__ada-container .ada-chatbot-button {
  3915. position: fixed;
  3916. right: 32px;
  3917. bottom: 32px
  3918. }
  3919. .smartbanner-show .smartbanner {
  3920. margin-top: 55px;
  3921. z-index: 99
  3922. }
  3923. @media(min-width:48em) {
  3924. .smartbanner-show .smartbanner {
  3925. margin-top: 80px
  3926. }
  3927. }
  3928. .flow-body,
  3929. .flow-body__inner {
  3930. display: flex;
  3931. width: 100%
  3932. }
  3933. .flow-body__inner {
  3934. flex-flow: column nowrap;
  3935. align-items: stretch;
  3936. margin-left: auto;
  3937. margin-right: auto;
  3938. padding-bottom: 55px;
  3939. max-width: 700px
  3940. }
  3941. @media(min-width:48em) {
  3942. .flow-body__inner {
  3943. padding-bottom: 110px
  3944. }
  3945. }
  3946. .flow-faq {
  3947. align-self: stretch;
  3948. position: relative;
  3949. margin-top: auto;
  3950. background: #fff;
  3951. border-top: 1px solid #ddd
  3952. }
  3953. .flow-faq__inner {
  3954. display: flex;
  3955. justify-content: center;
  3956. align-items: center;
  3957. min-height: 164px;
  3958. padding-top: 30px;
  3959. padding-bottom: 30px
  3960. }
  3961. @media(min-width:48em) {
  3962. .flow-faq__inner {
  3963. min-height: 125px
  3964. }
  3965. }
  3966. @media(max-width:47.99em) {
  3967. .flow-faq__inner {
  3968. padding-top: 34px;
  3969. align-items: flex-start
  3970. }
  3971. }
  3972. .flow-faq__icon {
  3973. flex: 0 0 45px;
  3974. height: 41px;
  3975. margin-left: 12px
  3976. }
  3977. @media(min-width:48em) {
  3978. .flow-faq__icon {
  3979. flex: 0 0 52px;
  3980. height: 48px;
  3981. position: relative;
  3982. top: -14px;
  3983. margin-left: 0
  3984. }
  3985. }
  3986. .flow-faq__content {
  3987. margin-left: 26px
  3988. }
  3989. @media(min-width:48em) {
  3990. .flow-faq__content {
  3991. margin-left: 14px;
  3992. text-align: center
  3993. }
  3994. }
  3995. .flow-faq__text {
  3996. margin: 0
  3997. }
  3998. .flow-faq__title {
  3999. text-decoration: none
  4000. }
  4001. @media(max-width:47.99em) {
  4002. .flow-faq__subtitle {
  4003. display: block;
  4004. margin-top: 5px
  4005. }
  4006. }
  4007. .flow-faq__link {
  4008. font-weight: 700;
  4009. text-decoration: none;
  4010. display: inline-flex;
  4011. align-items: center;
  4012. margin-top: 16px
  4013. }
  4014. @media(min-width:48em) {
  4015. .flow-faq__link {
  4016. margin-top: 10px;
  4017. margin-left: -52px
  4018. }
  4019. }
  4020. .flow-faq__link:hover {
  4021. color: #ee3124
  4022. }
  4023. .flow-faq__link .sprite {
  4024. width: 20px;
  4025. height: 20px;
  4026. fill: #ee3124
  4027. }
  4028. .flow-faq--new-design-system .flow-faq__subtitle {
  4029. color: #655c6c
  4030. }
  4031. .flow-faq--new-design-system .flow-faq__caret--green {
  4032. fill: #157a77;
  4033. margin: 0 6px;
  4034. width: 13px;
  4035. height: auto
  4036. }
  4037. .flow-faq--new-design-system .flow-faq__title {
  4038. margin-right: 12px
  4039. }
  4040. .flow-faq--new-design-system .flow-faq__title:hover {
  4041. color: #403840
  4042. }
  4043. .flow-faq--new-design-system .flow-faq__icon {
  4044. fill: transparent;
  4045. height: 56px
  4046. }
  4047. .flow-faq--new-design-system .flow-faq__link {
  4048. font-weight: 400;
  4049. text-decoration: underline;
  4050. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  4051. }
  4052. .flow-form-submit__content {
  4053. margin: 70px auto 0
  4054. }
  4055. .flow-form-submit__buttons {
  4056. margin: auto
  4057. }
  4058. .flow-form-submit__cancel,
  4059. .flow-form-submit__submit {
  4060. width: 100%
  4061. }
  4062. @media(min-width:48em) {
  4063. .flow-form-submit__cancel,
  4064. .flow-form-submit__submit {
  4065. width: auto;
  4066. min-width: 160px
  4067. }
  4068. }
  4069. .flow-form-submit__cancel {
  4070. margin: 16px 0 0
  4071. }
  4072. .flow-header {
  4073. position: relative;
  4074. max-width: 740px;
  4075. text-align: center;
  4076. padding-top: 30px;
  4077. padding-bottom: 26px
  4078. }
  4079. @media(min-width:48em) {
  4080. .flow-header {
  4081. padding-top: 60px;
  4082. padding-bottom: 46px;
  4083. max-width: 780px
  4084. }
  4085. }
  4086. .flow-header__title {
  4087. margin-top: 0;
  4088. margin-bottom: 20px;
  4089. color: #191919
  4090. }
  4091. .flow-header__title:last-child {
  4092. margin-bottom: 0
  4093. }
  4094. .flow-header__sub-title {
  4095. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  4096. font-size: .9375rem;
  4097. line-height: 1.25rem;
  4098. color: #403840;
  4099. font-weight: 400;
  4100. margin: 0
  4101. }
  4102. @media(min-width:48em) {
  4103. .flow-header__sub-title {
  4104. font-size: 1rem;
  4105. line-height: 1.375rem
  4106. }
  4107. }
  4108. .flow-layout {
  4109. flex-grow: 1;
  4110. display: flex;
  4111. flex-direction: column;
  4112. align-items: center;
  4113. position: relative;
  4114. background: #f0f0f0
  4115. }
  4116. .flow-layout--has-faq .flows-background {
  4117. bottom: 164px
  4118. }
  4119. @media(min-width:48em) {
  4120. .flow-layout--has-faq .flows-background {
  4121. bottom: 125px
  4122. }
  4123. }
  4124. .flow-progress-bar {
  4125. align-self: stretch;
  4126. position: relative;
  4127. padding: 30px 0 26px
  4128. }
  4129. @media(min-width:48em) {
  4130. .flow-progress-bar {
  4131. padding: 60px 0 54px
  4132. }
  4133. }
  4134. .flow-progress-bar__inner {
  4135. text-align: center;
  4136. margin: 0 auto;
  4137. max-width: 520px
  4138. }
  4139. .flow-progress-bar+.flow-header {
  4140. padding-top: 0
  4141. }
  4142. .flow-progress-bar__title {
  4143. margin-bottom: 25px
  4144. }
  4145. .flow-progress-bar .progress-bar {
  4146. margin-top: 15px
  4147. }
  4148. .flow-progress-bar .progress-bar__parent {
  4149. background-color: #fbcdcd
  4150. }
  4151. .flow-progress-bar--rounded-corners .progress-bar__parent:not(:first-child) {
  4152. margin-left: 2px
  4153. }
  4154. .flow-progress-bar--rounded-corners .progress-bar__parent:first-child {
  4155. border-radius: 5px 0 0 5px
  4156. }
  4157. .flow-progress-bar--rounded-corners .progress-bar__parent:last-child {
  4158. border-radius: 0 5px 5px 0
  4159. }
  4160. .flow-tile {
  4161. position: relative;
  4162. background: #fff;
  4163. padding: 40px 20px;
  4164. text-align: center;
  4165. width: 100%;
  4166. max-width: 700px
  4167. }
  4168. @media(min-width:48em) {
  4169. .flow-tile {
  4170. width: 700px
  4171. }
  4172. }
  4173. .flow-tile.registration-form {
  4174. padding: 20px
  4175. }
  4176. .flow-tile.registration-form a {
  4177. padding: 0 12px;
  4178. display: inline-block
  4179. }
  4180. @media(min-width:375px)and (max-width:480px) {
  4181. .flow-tile.registration-form a {
  4182. padding: 0
  4183. }
  4184. }
  4185. @media(min-width:481px)and (max-width:767px) {
  4186. .flow-tile.registration-form a {
  4187. padding: 0 20px
  4188. }
  4189. }
  4190. .flow-tile+.flow-tile {
  4191. margin-top: 20px
  4192. }
  4193. .flow-tile>* {
  4194. max-width: 440px;
  4195. margin-left: auto;
  4196. margin-right: auto
  4197. }
  4198. .flow-tile--wide-children>* {
  4199. max-width: 620px
  4200. }
  4201. .flow-tile>:first-child {
  4202. margin-top: 0
  4203. }
  4204. .flow-tile>:last-child {
  4205. margin-bottom: 0
  4206. }
  4207. .flow-tile__rule-absolute {
  4208. position: absolute;
  4209. left: 0;
  4210. right: 0;
  4211. margin: 0;
  4212. border: 0;
  4213. max-width: none;
  4214. border-top: 1px solid #ddd
  4215. }
  4216. .legal-layout .tab-bar__inner:lang(en) {
  4217. max-width: 640px
  4218. }
  4219. .legal-layout .tab-bar__inner:lang(fr) {
  4220. max-width: 840px
  4221. }
  4222. .legal-layout .utility-content {
  4223. margin: 0 auto
  4224. }
  4225. .offers-page {
  4226. overflow-x: hidden;
  4227. display: flex;
  4228. flex-direction: column
  4229. }
  4230. .offers-page__header {
  4231. position: relative;
  4232. padding: 40px;
  4233. display: flex
  4234. }
  4235. @media(min-width:48em) {
  4236. .offers-page__header {
  4237. min-height: 300px
  4238. }
  4239. }
  4240. .offers-page__header-text {
  4241. z-index: 1;
  4242. display: flex;
  4243. align-items: flex-end;
  4244. width: 100%
  4245. }
  4246. @media(max-width:63.99em) {
  4247. .offers-page__header-text {
  4248. flex-direction: column;
  4249. justify-content: center;
  4250. align-items: center
  4251. }
  4252. }
  4253. .offers-page__main-content {
  4254. background: #fff
  4255. }
  4256. @media(min-width:64.0625em) {
  4257. .offers-page__main-content {
  4258. display: flex
  4259. }
  4260. }
  4261. .offers-page .header-greeting {
  4262. color: #ac342a
  4263. }
  4264. .offers-page.offers-page__insiders .header-greeting,
  4265. .offers-page.offers-page__insiders .header-points {
  4266. color: #f9dada
  4267. }
  4268. @media(min-width:64.0625em) {
  4269. .offers-page .offers-section {
  4270. flex: 1 100%
  4271. }
  4272. }
  4273. .offers-page .tab-bar {
  4274. overflow: visible
  4275. }
  4276. .offers-page .tab-bar__inner {
  4277. padding: 0;
  4278. overflow: visible
  4279. }
  4280. .offers-page .checklist-container {
  4281. z-index: 1;
  4282. flex: 0 1 36%;
  4283. max-width: 420px
  4284. }
  4285. @media(max-width:64.0525em) {
  4286. .offers-page .checklist-item {
  4287. padding: 0 14px 0 20px
  4288. }
  4289. .offers-page .checklist-item__inner {
  4290. padding: 14px 0
  4291. }
  4292. .offers-page .checklist-item__icon {
  4293. width: 32px;
  4294. margin-right: 16px
  4295. }
  4296. }
  4297. .utility-layout {
  4298. background-color: #f0f0f0;
  4299. flex-grow: 1
  4300. }
  4301. .utility-layout .tab-bar {
  4302. background: #fff
  4303. }
  4304. .utility-layout>.error-tile {
  4305. max-width: 920px;
  4306. margin: 60px auto 100px;
  4307. padding-left: 20px;
  4308. padding-right: 20px
  4309. }
  4310. @media(min-width:48em) {
  4311. .utility-layout>.error-tile {
  4312. padding-left: 40px;
  4313. padding-right: 40px
  4314. }
  4315. }
  4316. .utility-header {
  4317. position: relative;
  4318. color: #2c2a29
  4319. }
  4320. @media(min-width:48em) {
  4321. .utility-header {
  4322. min-height: 220px
  4323. }
  4324. }
  4325. .utility-header .container,
  4326. .utility-header .eflyers-subscription__container,
  4327. .utility-header .homepage-join__inner,
  4328. .utility-header .points-days-banners-section,
  4329. .utility-header .points-days-cta-section,
  4330. .utility-header .points-days-offers-section,
  4331. .utility-header .points-days-ts-and-cs__container,
  4332. .utility-header .weekly-flyer-opt-in__inner {
  4333. margin: 0 auto;
  4334. max-width: 920px
  4335. }
  4336. .utility-header__inner {
  4337. position: relative;
  4338. display: flex;
  4339. flex-direction: column;
  4340. justify-content: center
  4341. }
  4342. @media(max-width:47.99em) {
  4343. .utility-header__inner {
  4344. height: 140px
  4345. }
  4346. }
  4347. @media(min-width:48em) {
  4348. .utility-header__inner {
  4349. min-height: 220px
  4350. }
  4351. }
  4352. .utility-header__title {
  4353. margin-top: 0;
  4354. margin-bottom: 0;
  4355. color: #ac342a
  4356. }
  4357. .utility-header__subtitle {
  4358. font-family: Noir, sans-serif;
  4359. color: #ac342a;
  4360. margin-top: 10px;
  4361. margin-bottom: 0
  4362. }
  4363. .account-header__insiders .account-header__subtitle,
  4364. .account-header__insiders .account-header__title {
  4365. color: #fff
  4366. }
  4367. .account-header__title {
  4368. margin-top: 0;
  4369. margin-bottom: 0
  4370. }
  4371. .utility-content {
  4372. max-width: 920px
  4373. }
  4374. .utility-content>.error-tile {
  4375. margin: 32px 0
  4376. }
  4377. @media(min-width:48em) {
  4378. .utility-content>.error-tile {
  4379. margin: 64px 0
  4380. }
  4381. }
  4382. .utility-content .loading-tile {
  4383. align-self: center;
  4384. justify-content: center
  4385. }
  4386. .utility-section {
  4387. margin: 32px 0
  4388. }
  4389. @media(min-width:48em) {
  4390. .utility-section {
  4391. margin: 64px 0
  4392. }
  4393. }
  4394. .utility-section__header {
  4395. display: flex;
  4396. flex-flow: row wrap;
  4397. justify-content: space-between;
  4398. align-items: baseline;
  4399. margin-bottom: 16px
  4400. }
  4401. .utility-section__title {
  4402. flex-grow: 1;
  4403. margin: 0
  4404. }
  4405. .utility-section__right-title {
  4406. color: #8a8a8a;
  4407. margin: 0;
  4408. -webkit-font-smoothing: antialiased
  4409. }
  4410. .utility-section__subtitle {
  4411. flex-basis: 100%;
  4412. margin: 0
  4413. }
  4414. .container,
  4415. .eflyers-subscription__container,
  4416. .homepage-join__inner,
  4417. .points-days-banners-section,
  4418. .points-days-cta-section,
  4419. .points-days-offers-section,
  4420. .points-days-ts-and-cs__container,
  4421. .weekly-flyer-opt-in__inner {
  4422. max-width: 1280px;
  4423. margin-left: auto;
  4424. margin-right: auto;
  4425. padding-left: 20px;
  4426. padding-right: 20px
  4427. }
  4428. @media(min-width:48em) {
  4429. .container,
  4430. .eflyers-subscription__container,
  4431. .homepage-join__inner,
  4432. .points-days-banners-section,
  4433. .points-days-cta-section,
  4434. .points-days-offers-section,
  4435. .points-days-ts-and-cs__container,
  4436. .weekly-flyer-opt-in__inner {
  4437. padding-left: 40px;
  4438. padding-right: 40px
  4439. }
  4440. }
  4441. @media(min-width:48em)and (max-width:63.99em) {
  4442. .container--padding-none {
  4443. padding: 0
  4444. }
  4445. }
  4446. .load-to-card-page {
  4447. overflow-x: hidden;
  4448. display: flex;
  4449. flex-direction: column
  4450. }
  4451. .load-to-card-page__container {
  4452. width: 100%;
  4453. margin-left: auto;
  4454. margin-right: auto;
  4455. padding-left: 20px;
  4456. padding-right: 20px;
  4457. position: relative;
  4458. background-size: auto 560px;
  4459. background-repeat: no-repeat;
  4460. background-position: top;
  4461. background-color: snow;
  4462. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/load-to-card/header/swoop-mobile1.svg)
  4463. }
  4464. @media(min-width:48em) {
  4465. .load-to-card-page__container {
  4466. padding-left: 40px;
  4467. padding-right: 40px;
  4468. background-position: 100% 0;
  4469. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/load-to-card/header/swoop-tablet.svg)
  4470. }
  4471. }
  4472. @media(min-width:64em) {
  4473. .load-to-card-page__container {
  4474. background-size: auto 650px;
  4475. background-position: top;
  4476. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/load-to-card/header/swoop-desktop1.svg)
  4477. }
  4478. }
  4479. .load-to-card-page__main-content {
  4480. max-width: 1280px;
  4481. margin: 0 auto
  4482. }
  4483. .main-header {
  4484. position: relative;
  4485. overflow: hidden;
  4486. z-index: 1
  4487. }
  4488. .main-header__background {
  4489. position: absolute;
  4490. z-index: -1;
  4491. top: -56px;
  4492. left: 50%;
  4493. transform: translateX(-50%);
  4494. height: 348px;
  4495. min-width: 100%
  4496. }
  4497. @media(min-width:48em) {
  4498. .main-header__background {
  4499. top: 0;
  4500. height: 248px
  4501. }
  4502. }
  4503. @media(min-width:64em) {
  4504. .main-header__background {
  4505. height: 304px
  4506. }
  4507. }
  4508. .main-header__insiders {
  4509. color: #f9dada
  4510. }
  4511. .contest-rules-layout .tab-bar__inner:lang(en) {
  4512. max-width: 640px
  4513. }
  4514. .contest-rules-layout .tab-bar__inner:lang(fr) {
  4515. max-width: 840px
  4516. }
  4517. .contest-rules-layout .utility-content {
  4518. margin: 0 auto
  4519. }
  4520. .account-setting--security .account-setting__turn-off-button,
  4521. .account-setting--security .account-setting__turn-on-button,
  4522. .button,
  4523. .household-grid__invite-button,
  4524. .link--theme-button,
  4525. .link--theme-button--large-primary,
  4526. .link--theme-button--large-secondary,
  4527. .link--theme-button--small-primary,
  4528. .link--theme-button--small-secondary,
  4529. .link--theme-button-gray,
  4530. .link--theme-button-red,
  4531. .link--theme-button-transparent,
  4532. .link--theme-button-transparent-white,
  4533. .link--theme-button-white,
  4534. .load-shop-pay-header__link,
  4535. .load-shop-pay-module__link,
  4536. .marketing-page-header__link,
  4537. .marketing-page-module__link,
  4538. .partnership-perk-details__cta,
  4539. .partnership-perk-redeemed-success__cta,
  4540. .points-days-cta-section__content .cta-section__link,
  4541. .points-days__cta {
  4542. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  4543. cursor: pointer;
  4544. padding: 0;
  4545. border: 0;
  4546. background: transparent;
  4547. transition: color .1s, background .1s, border .1s, fill .1s
  4548. }
  4549. .account-setting--security .account-setting__turn-off-button:active,
  4550. .account-setting--security .account-setting__turn-on-button:active,
  4551. .button:active,
  4552. .household-grid__invite-button:active,
  4553. .link--theme-button--large-primary:active,
  4554. .link--theme-button--large-secondary:active,
  4555. .link--theme-button--small-primary:active,
  4556. .link--theme-button--small-secondary:active,
  4557. .link--theme-button-gray:active,
  4558. .link--theme-button-red:active,
  4559. .link--theme-button-transparent-white:active,
  4560. .link--theme-button-transparent:active,
  4561. .link--theme-button-white:active,
  4562. .link--theme-button:active,
  4563. .load-shop-pay-header__link:active,
  4564. .load-shop-pay-module__link:active,
  4565. .marketing-page-header__link:active,
  4566. .marketing-page-module__link:active,
  4567. .partnership-perk-details__cta:active,
  4568. .partnership-perk-redeemed-success__cta:active,
  4569. .points-days-cta-section__content .cta-section__link:active,
  4570. .points-days__cta:active {
  4571. outline: 0
  4572. }
  4573. .account-setting--security .account-setting__turn-off-button sup,
  4574. .account-setting--security .account-setting__turn-on-button sup,
  4575. .button sup,
  4576. .household-grid__invite-button sup,
  4577. .link--theme-button--large-primary sup,
  4578. .link--theme-button--large-secondary sup,
  4579. .link--theme-button--small-primary sup,
  4580. .link--theme-button--small-secondary sup,
  4581. .link--theme-button-gray sup,
  4582. .link--theme-button-red sup,
  4583. .link--theme-button-transparent-white sup,
  4584. .link--theme-button-transparent sup,
  4585. .link--theme-button-white sup,
  4586. .link--theme-button sup,
  4587. .load-shop-pay-header__link sup,
  4588. .load-shop-pay-module__link sup,
  4589. .marketing-page-header__link sup,
  4590. .marketing-page-module__link sup,
  4591. .partnership-perk-details__cta sup,
  4592. .partnership-perk-redeemed-success__cta sup,
  4593. .points-days-cta-section__content .cta-section__link sup,
  4594. .points-days__cta sup {
  4595. line-height: 0
  4596. }
  4597. .button--inline {
  4598. display: inline-block
  4599. }
  4600. .button--block,
  4601. .household-grid__invite-button {
  4602. display: block;
  4603. width: 100%
  4604. }
  4605. .button--small {
  4606. font-size: .8rem;
  4607. padding: 5px 10px
  4608. }
  4609. .account-setting--security .account-setting__turn-off-button,
  4610. .account-setting--security .account-setting__turn-on-button,
  4611. .button--theme-base,
  4612. .household-grid__invite-button,
  4613. .link--theme-button,
  4614. .link--theme-button-gray,
  4615. .link--theme-button-red,
  4616. .link--theme-button-transparent,
  4617. .link--theme-button-transparent-white,
  4618. .link--theme-button-white,
  4619. .points-days-cta-section__content .cta-section__link,
  4620. .points-days__cta {
  4621. font-size: 1rem;
  4622. line-height: 1.125;
  4623. min-width: 160px;
  4624. padding: 16px 20px;
  4625. text-decoration: none;
  4626. text-align: center;
  4627. white-space: nowrap;
  4628. color: #fff;
  4629. fill: #fff;
  4630. -webkit-font-smoothing: antialiased;
  4631. background: #191919;
  4632. border: 1px solid #191919;
  4633. border-radius: 0
  4634. }
  4635. .account-setting--security .account-setting__turn-off-button:focus,
  4636. .account-setting--security .account-setting__turn-off-button:hover,
  4637. .account-setting--security .account-setting__turn-on-button:focus,
  4638. .account-setting--security .account-setting__turn-on-button:hover,
  4639. .button--theme-base:focus,
  4640. .button--theme-base:hover,
  4641. .household-grid__invite-button:focus,
  4642. .household-grid__invite-button:hover,
  4643. .link--theme-button-gray:focus,
  4644. .link--theme-button-gray:hover,
  4645. .link--theme-button-red:focus,
  4646. .link--theme-button-red:hover,
  4647. .link--theme-button-transparent-white:focus,
  4648. .link--theme-button-transparent-white:hover,
  4649. .link--theme-button-transparent:focus,
  4650. .link--theme-button-transparent:hover,
  4651. .link--theme-button-white:focus,
  4652. .link--theme-button-white:hover,
  4653. .link--theme-button:focus,
  4654. .link--theme-button:hover,
  4655. .points-days-cta-section__content .cta-section__link:focus,
  4656. .points-days-cta-section__content .cta-section__link:hover,
  4657. .points-days__cta:focus,
  4658. .points-days__cta:hover {
  4659. color: #fff;
  4660. fill: #fff;
  4661. border-color: #8a8a8a;
  4662. background: #8a8a8a
  4663. }
  4664. .account-setting--security .account-setting__turn-off-button:active,
  4665. .account-setting--security .account-setting__turn-on-button:active,
  4666. .button--theme-base:active,
  4667. .household-grid__invite-button:active,
  4668. .link--theme-button-gray:active,
  4669. .link--theme-button-red:active,
  4670. .link--theme-button-transparent-white:active,
  4671. .link--theme-button-transparent:active,
  4672. .link--theme-button-white:active,
  4673. .link--theme-button:active,
  4674. .points-days-cta-section__content .cta-section__link:active,
  4675. .points-days__cta:active {
  4676. color: #fff;
  4677. fill: #fff;
  4678. border-color: #585858;
  4679. background: #585858
  4680. }
  4681. .account-setting--security .account-setting__turn-off-button:disabled,
  4682. .account-setting--security .account-setting__turn-on-button:disabled,
  4683. .button--theme-base:disabled,
  4684. .button--theme-base:disabled:active,
  4685. .button--theme-base:disabled:hover,
  4686. .household-grid__invite-button:disabled,
  4687. .link--theme-button-gray:disabled,
  4688. .link--theme-button-red:disabled,
  4689. .link--theme-button-transparent-white:disabled,
  4690. .link--theme-button-transparent:disabled,
  4691. .link--theme-button-white:disabled,
  4692. .link--theme-button:disabled,
  4693. .points-days-cta-section__content .cta-section__link:disabled,
  4694. .points-days__cta:disabled {
  4695. cursor: not-allowed;
  4696. color: #bcbcbc;
  4697. fill: #bcbcbc;
  4698. background: #8a8a8a;
  4699. border-color: #8a8a8a
  4700. }
  4701. .button--theme-primary,
  4702. .partnership-perk-details__cta,
  4703. .partnership-perk-redeemed-success__cta {
  4704. font-weight: 600;
  4705. font-size: 16px;
  4706. min-width: 143px;
  4707. padding: 12px 50px;
  4708. border-radius: 32px;
  4709. background: #157a77;
  4710. border-color: #157a77;
  4711. color: #fff;
  4712. fill: #fff
  4713. }
  4714. .button--theme-primary:focus,
  4715. .button--theme-primary:hover,
  4716. .partnership-perk-details__cta:focus,
  4717. .partnership-perk-details__cta:hover,
  4718. .partnership-perk-redeemed-success__cta:focus,
  4719. .partnership-perk-redeemed-success__cta:hover {
  4720. border-color: #615395;
  4721. background: #615395
  4722. }
  4723. .button--theme-primary:active,
  4724. .partnership-perk-details__cta:active,
  4725. .partnership-perk-redeemed-success__cta:active {
  4726. border-color: #403840;
  4727. background: #403840
  4728. }
  4729. .button--theme-primary:disabled,
  4730. .partnership-perk-details__cta:disabled,
  4731. .partnership-perk-redeemed-success__cta:disabled {
  4732. cursor: not-allowed;
  4733. background: #9e93a6;
  4734. border-color: #9e93a6;
  4735. color: #fff
  4736. }
  4737. .button--theme-primary--small {
  4738. padding: 9px 24px;
  4739. min-width: 90px
  4740. }
  4741. .button--theme-helios-primary {
  4742. font-weight: 600;
  4743. font-size: 16px;
  4744. min-width: 143px;
  4745. padding: 12px 50px;
  4746. border-radius: 32px;
  4747. background: #157a77;
  4748. border-color: #157a77;
  4749. color: #fff;
  4750. fill: #fff
  4751. }
  4752. .button--theme-helios-primary:hover {
  4753. border-color: #006665;
  4754. background: #006665
  4755. }
  4756. .button--theme-helios-primary:focus {
  4757. border-color: #157a77;
  4758. background: #157a77
  4759. }
  4760. .button--theme-helios-primary:active {
  4761. border-color: #004e4c;
  4762. background: #004e4c
  4763. }
  4764. .button--theme-helios-primary:disabled {
  4765. cursor: not-allowed
  4766. }
  4767. .button--theme-helios-primary--small {
  4768. padding: 9px 24px;
  4769. min-width: 90px
  4770. }
  4771. .button--theme-helios-secondary {
  4772. font-weight: 600;
  4773. font-size: 16px;
  4774. min-width: 143px;
  4775. padding: 12px 50px;
  4776. border-radius: 32px;
  4777. background: #fff;
  4778. border-color: #157a77;
  4779. color: #157a77;
  4780. fill: #157a77
  4781. }
  4782. .button--theme-helios-secondary:hover {
  4783. border-color: #006665;
  4784. color: #006665;
  4785. fill: #006665
  4786. }
  4787. .button--theme-helios-secondary:focus {
  4788. border-color: #157a77;
  4789. color: #157a77;
  4790. fill: #157a77
  4791. }
  4792. .button--theme-helios-secondary:active {
  4793. border-color: #004e4c;
  4794. color: #004e4c;
  4795. fill: #004e4c
  4796. }
  4797. .button--theme-helios-secondary:disabled {
  4798. cursor: not-allowed
  4799. }
  4800. .button--theme-helios-secondary--small {
  4801. padding: 9px 24px;
  4802. min-width: 90px
  4803. }
  4804. .button--theme-helios-flat {
  4805. font-weight: 600;
  4806. font-size: 16px;
  4807. min-width: 143px;
  4808. padding: 12px 50px;
  4809. border-radius: 32px;
  4810. background: #f3f3f3;
  4811. border-color: #f3f3f3;
  4812. color: #191919;
  4813. fill: #191919
  4814. }
  4815. .button--theme-helios-flat:hover {
  4816. border-color: #e1e1e1;
  4817. background: #e1e1e1;
  4818. color: #191919;
  4819. fill: #191919
  4820. }
  4821. .button--theme-helios-flat:focus {
  4822. border-color: #f3f3f3;
  4823. background: #f3f3f3;
  4824. color: #191919;
  4825. fill: #191919
  4826. }
  4827. .button--theme-helios-flat:active {
  4828. border-color: #c9c9c9;
  4829. background: #c9c9c9;
  4830. color: #191919;
  4831. fill: #191919
  4832. }
  4833. .button--theme-helios-flat:disabled {
  4834. cursor: not-allowed
  4835. }
  4836. .button--theme-helios-flat--small {
  4837. padding: 9px 24px;
  4838. min-width: 90px
  4839. }
  4840. .button--theme-helios-tertiary {
  4841. background: none;
  4842. border: 0;
  4843. padding: 0;
  4844. text-decoration: underline;
  4845. color: #157a77;
  4846. fill: #157a77
  4847. }
  4848. .button--theme-helios-tertiary:hover {
  4849. color: #006665;
  4850. background: none;
  4851. border: 0
  4852. }
  4853. .button--theme-helios-tertiary:active {
  4854. color: #004e4c;
  4855. background: none;
  4856. border: 0
  4857. }
  4858. .button--theme-secondary {
  4859. font-weight: 600;
  4860. font-size: 16px;
  4861. min-width: 143px;
  4862. padding: 12px 50px;
  4863. border-radius: 32px;
  4864. background: #fff;
  4865. border-color: #157a77;
  4866. color: #157a77;
  4867. fill: #157a77
  4868. }
  4869. .button--theme-secondary:focus,
  4870. .button--theme-secondary:hover {
  4871. border-color: #615395;
  4872. color: #615395;
  4873. fill: #615395;
  4874. background: #fff
  4875. }
  4876. .button--theme-secondary:active {
  4877. border-color: #403840;
  4878. color: #403840;
  4879. fill: #403840;
  4880. background: #fff
  4881. }
  4882. .button--theme-secondary:disabled {
  4883. cursor: not-allowed;
  4884. border-color: #9e93a6;
  4885. color: #9e93a6;
  4886. fill: #9e93a6;
  4887. background: #fff
  4888. }
  4889. .button--theme-secondary--small {
  4890. padding: 9px 24px;
  4891. min-width: 90px
  4892. }
  4893. .button--theme-tertiary {
  4894. font-weight: 600;
  4895. font-size: 16px;
  4896. padding: 9px 24px;
  4897. background: none;
  4898. border: none;
  4899. color: #157a77;
  4900. fill: #157a77;
  4901. -webkit-text-decoration: underline #157a77;
  4902. text-decoration: underline #157a77
  4903. }
  4904. .button--theme-tertiary:focus,
  4905. .button--theme-tertiary:hover {
  4906. color: #615395;
  4907. fill: #615395;
  4908. -webkit-text-decoration: underline #615395;
  4909. text-decoration: underline #615395;
  4910. background: none
  4911. }
  4912. .button--theme-tertiary:active {
  4913. color: #403840;
  4914. fill: #403840;
  4915. -webkit-text-decoration: underline #403840;
  4916. text-decoration: underline #403840;
  4917. background: none
  4918. }
  4919. .button--theme-tertiary:disabled {
  4920. cursor: not-allowed;
  4921. color: #9e93a6;
  4922. fill: #9e93a6;
  4923. -webkit-text-decoration: underline #9e93a6;
  4924. text-decoration: underline #9e93a6;
  4925. background: none
  4926. }
  4927. .button--theme-transparent,
  4928. .link--theme-button-transparent,
  4929. .points-days-cta-section__content .cta-section__link,
  4930. .points-days__cta {
  4931. color: #191919;
  4932. fill: #191919;
  4933. background: transparent;
  4934. border-color: #8a8a8a
  4935. }
  4936. .button--theme-transparent:focus,
  4937. .button--theme-transparent:hover,
  4938. .link--theme-button-transparent:focus,
  4939. .link--theme-button-transparent:hover,
  4940. .points-days-cta-section__content .cta-section__link:focus,
  4941. .points-days-cta-section__content .cta-section__link:hover,
  4942. .points-days__cta:focus,
  4943. .points-days__cta:hover {
  4944. border-color: #191919;
  4945. background: #191919
  4946. }
  4947. .button--theme-transparent:active,
  4948. .link--theme-button-transparent:active,
  4949. .points-days-cta-section__content .cta-section__link:active,
  4950. .points-days__cta:active {
  4951. border-color: #585858;
  4952. background: #585858
  4953. }
  4954. .button--theme-white-gray {
  4955. color: #191919;
  4956. fill: #191919;
  4957. background: #fff;
  4958. border-color: #8a8a8a
  4959. }
  4960. .button--theme-white-gray:focus,
  4961. .button--theme-white-gray:hover {
  4962. border-color: #191919;
  4963. background: #191919
  4964. }
  4965. .button--theme-white-gray:active {
  4966. border-color: #585858;
  4967. background: #585858
  4968. }
  4969. .button--theme-white,
  4970. .household-grid__invite-button,
  4971. .link--theme-button-white {
  4972. color: #ee3124;
  4973. fill: #ee3124;
  4974. background: #fff;
  4975. border-color: #fff
  4976. }
  4977. .button--theme-white:focus,
  4978. .button--theme-white:hover,
  4979. .household-grid__invite-button:focus,
  4980. .household-grid__invite-button:hover,
  4981. .link--theme-button-white:focus,
  4982. .link--theme-button-white:hover {
  4983. border-color: #8a8a8a;
  4984. background: #8a8a8a
  4985. }
  4986. .button--theme-white:active,
  4987. .household-grid__invite-button:active,
  4988. .link--theme-button-white:active {
  4989. border-color: #585858;
  4990. background: #585858
  4991. }
  4992. .button--theme-transparent-white,
  4993. .link--theme-button-transparent-white {
  4994. background: transparent;
  4995. border-color: #fff
  4996. }
  4997. .button--theme-transparent-white:focus,
  4998. .button--theme-transparent-white:hover,
  4999. .link--theme-button-transparent-white:focus,
  5000. .link--theme-button-transparent-white:hover {
  5001. color: #191919;
  5002. fill: #191919;
  5003. border-color: #fff;
  5004. background: #fff
  5005. }
  5006. .button--theme-transparent-white:active,
  5007. .link--theme-button-transparent-white:active {
  5008. color: #191919;
  5009. fill: #191919;
  5010. border-color: #ddd;
  5011. background: #ddd
  5012. }
  5013. .account-setting--security .account-setting__turn-on-button,
  5014. .button--theme-red,
  5015. .link--theme-button-red {
  5016. background: #ee3124;
  5017. border-color: #ee3124
  5018. }
  5019. .account-setting--security .account-setting__turn-on-button:focus,
  5020. .account-setting--security .account-setting__turn-on-button:hover,
  5021. .button--theme-red:focus,
  5022. .button--theme-red:hover,
  5023. .link--theme-button-red:focus,
  5024. .link--theme-button-red:hover {
  5025. border-color: #7f141e;
  5026. background: #7f141e
  5027. }
  5028. .account-setting--security .account-setting__turn-on-button:active,
  5029. .button--theme-red:active,
  5030. .link--theme-button-red:active {
  5031. border-color: #530d14;
  5032. background: #530d14
  5033. }
  5034. .button--theme-gray,
  5035. .link--theme-button-gray {
  5036. background: #f0f0f0;
  5037. border-color: #f0f0f0;
  5038. color: #191919;
  5039. fill: #191919
  5040. }
  5041. .button--theme-gray:focus,
  5042. .button--theme-gray:hover,
  5043. .link--theme-button-gray:focus,
  5044. .link--theme-button-gray:hover {
  5045. color: #191919;
  5046. fill: #191919;
  5047. border-color: #ddd;
  5048. background: #ddd
  5049. }
  5050. .button--theme-gray:active,
  5051. .link--theme-button-gray:active {
  5052. color: #191919;
  5053. fill: #191919;
  5054. border-color: #bcbcbc;
  5055. background: #bcbcbc
  5056. }
  5057. .button--theme-base-small,
  5058. .link--theme-button--small-primary,
  5059. .link--theme-button--small-secondary {
  5060. font-size: 1rem;
  5061. line-height: 1.125rem;
  5062. min-width: 90px;
  5063. padding: 9px 24px;
  5064. text-decoration: none;
  5065. text-align: center;
  5066. white-space: nowrap;
  5067. color: #fff;
  5068. fill: #fff;
  5069. -webkit-font-smoothing: antialiased;
  5070. background: #191919;
  5071. border: 1px solid #191919;
  5072. border-radius: 32px
  5073. }
  5074. .button--theme-base-small:focus,
  5075. .button--theme-base-small:hover,
  5076. .link--theme-button--small-primary:focus,
  5077. .link--theme-button--small-primary:hover,
  5078. .link--theme-button--small-secondary:focus,
  5079. .link--theme-button--small-secondary:hover {
  5080. color: #fff;
  5081. fill: #fff;
  5082. border-color: #8a8a8a;
  5083. background: #8a8a8a
  5084. }
  5085. .button--theme-base-small:active,
  5086. .link--theme-button--small-primary:active,
  5087. .link--theme-button--small-secondary:active {
  5088. color: #fff;
  5089. fill: #fff;
  5090. border-color: #585858;
  5091. background: #585858
  5092. }
  5093. .button--theme-base-small:disabled,
  5094. .button--theme-base-small:disabled:active,
  5095. .button--theme-base-small:disabled:hover,
  5096. .link--theme-button--small-primary:disabled,
  5097. .link--theme-button--small-secondary:disabled {
  5098. cursor: not-allowed;
  5099. color: #bcbcbc;
  5100. fill: #bcbcbc;
  5101. background: #8a8a8a;
  5102. border-color: #8a8a8a
  5103. }
  5104. .button--theme-base-large,
  5105. .link--theme-button--large-primary,
  5106. .link--theme-button--large-secondary,
  5107. .load-shop-pay-header__link,
  5108. .load-shop-pay-module__link,
  5109. .marketing-page-header__link,
  5110. .marketing-page-module__link {
  5111. font-size: 1rem;
  5112. line-height: 1.125rem;
  5113. min-width: 90px;
  5114. padding: 12px 50px;
  5115. text-decoration: none;
  5116. text-align: center;
  5117. white-space: nowrap;
  5118. color: #fff;
  5119. fill: #fff;
  5120. -webkit-font-smoothing: antialiased;
  5121. background: #191919;
  5122. border: 1px solid #191919;
  5123. border-radius: 32px
  5124. }
  5125. .button--theme-base-large:focus,
  5126. .button--theme-base-large:hover,
  5127. .link--theme-button--large-primary:focus,
  5128. .link--theme-button--large-primary:hover,
  5129. .link--theme-button--large-secondary:focus,
  5130. .link--theme-button--large-secondary:hover,
  5131. .load-shop-pay-header__link:focus,
  5132. .load-shop-pay-header__link:hover,
  5133. .load-shop-pay-module__link:focus,
  5134. .load-shop-pay-module__link:hover,
  5135. .marketing-page-header__link:focus,
  5136. .marketing-page-header__link:hover,
  5137. .marketing-page-module__link:focus,
  5138. .marketing-page-module__link:hover {
  5139. color: #fff;
  5140. fill: #fff;
  5141. border-color: #8a8a8a;
  5142. background: #8a8a8a
  5143. }
  5144. .button--theme-base-large:active,
  5145. .link--theme-button--large-primary:active,
  5146. .link--theme-button--large-secondary:active,
  5147. .load-shop-pay-header__link:active,
  5148. .load-shop-pay-module__link:active,
  5149. .marketing-page-header__link:active,
  5150. .marketing-page-module__link:active {
  5151. color: #fff;
  5152. fill: #fff;
  5153. border-color: #585858;
  5154. background: #585858
  5155. }
  5156. .button--theme-base-large:disabled,
  5157. .button--theme-base-large:disabled:active,
  5158. .button--theme-base-large:disabled:hover,
  5159. .link--theme-button--large-primary:disabled,
  5160. .link--theme-button--large-secondary:disabled,
  5161. .load-shop-pay-header__link:disabled,
  5162. .load-shop-pay-module__link:disabled,
  5163. .marketing-page-header__link:disabled,
  5164. .marketing-page-module__link:disabled {
  5165. cursor: not-allowed;
  5166. color: #bcbcbc;
  5167. fill: #bcbcbc;
  5168. background: #8a8a8a;
  5169. border-color: #8a8a8a
  5170. }
  5171. .button--theme-ds-primary,
  5172. .link--theme-button--large-primary,
  5173. .link--theme-button--small-primary,
  5174. .load-shop-pay-header__link,
  5175. .load-shop-pay-module__link,
  5176. .marketing-page-header__link,
  5177. .marketing-page-module__link {
  5178. background: #157a77;
  5179. border-color: #157a77;
  5180. font-weight: 600
  5181. }
  5182. .button--theme-ds-primary:focus,
  5183. .button--theme-ds-primary:hover,
  5184. .link--theme-button--large-primary:focus,
  5185. .link--theme-button--large-primary:hover,
  5186. .link--theme-button--small-primary:focus,
  5187. .link--theme-button--small-primary:hover,
  5188. .load-shop-pay-header__link:focus,
  5189. .load-shop-pay-header__link:hover,
  5190. .load-shop-pay-module__link:focus,
  5191. .load-shop-pay-module__link:hover,
  5192. .marketing-page-header__link:focus,
  5193. .marketing-page-header__link:hover,
  5194. .marketing-page-module__link:focus,
  5195. .marketing-page-module__link:hover {
  5196. border-color: #615395;
  5197. background: #615395
  5198. }
  5199. .button--theme-ds-primary:active,
  5200. .link--theme-button--large-primary:active,
  5201. .link--theme-button--small-primary:active,
  5202. .load-shop-pay-header__link:active,
  5203. .load-shop-pay-module__link:active,
  5204. .marketing-page-header__link:active,
  5205. .marketing-page-module__link:active {
  5206. border-color: #403840;
  5207. background: #403840
  5208. }
  5209. .button--theme-ds-primary:disabled,
  5210. .link--theme-button--large-primary:disabled,
  5211. .link--theme-button--small-primary:disabled,
  5212. .load-shop-pay-header__link:disabled,
  5213. .load-shop-pay-module__link:disabled,
  5214. .marketing-page-header__link:disabled,
  5215. .marketing-page-module__link:disabled {
  5216. cursor: not-allowed;
  5217. border-color: #9e93a6;
  5218. background: #9e93a6
  5219. }
  5220. .button--theme-ds-secondary,
  5221. .link--theme-button--large-secondary,
  5222. .link--theme-button--small-secondary {
  5223. background: #fff;
  5224. border-color: #157a77;
  5225. color: #157a77;
  5226. font-weight: 600
  5227. }
  5228. .button--theme-ds-secondary:focus,
  5229. .button--theme-ds-secondary:hover,
  5230. .link--theme-button--large-secondary:focus,
  5231. .link--theme-button--large-secondary:hover,
  5232. .link--theme-button--small-secondary:focus,
  5233. .link--theme-button--small-secondary:hover {
  5234. border-color: #615395;
  5235. background: #615395
  5236. }
  5237. .button--theme-ds-secondary:active,
  5238. .link--theme-button--large-secondary:active,
  5239. .link--theme-button--small-secondary:active {
  5240. border-color: #403840;
  5241. background: #403840
  5242. }
  5243. .button--theme-ds-secondary:disabled,
  5244. .link--theme-button--large-secondary:disabled,
  5245. .link--theme-button--small-secondary:disabled {
  5246. cursor: not-allowed;
  5247. border-color: #9e93a6;
  5248. background: #9e93a6
  5249. }
  5250. .button--theme-link {
  5251. text-decoration: underline;
  5252. color: #da291c;
  5253. fill: #da291c
  5254. }
  5255. .button--theme-link:hover {
  5256. color: #982822;
  5257. fill: #982822
  5258. }
  5259. .button--theme-link:disabled,
  5260. .button--theme-link:disabled:active,
  5261. .button--theme-link:disabled:hover {
  5262. cursor: not-allowed;
  5263. color: #bcbcbc;
  5264. fill: #bcbcbc
  5265. }
  5266. .button--theme-link-gray {
  5267. text-decoration: underline;
  5268. color: #585858;
  5269. fill: #585858
  5270. }
  5271. .button--theme-link-gray:hover {
  5272. color: #191919;
  5273. fill: #191919
  5274. }
  5275. .button--theme-link-primary {
  5276. text-decoration: underline;
  5277. color: #157a77;
  5278. fill: #157a77
  5279. }
  5280. .button--theme-link-primary:hover {
  5281. color: #615395;
  5282. fill: #615395
  5283. }
  5284. .button--theme-visible-only-onfocus-link-style {
  5285. text-decoration: underline;
  5286. color: #da291c;
  5287. fill: #da291c
  5288. }
  5289. .button--theme-visible-only-onfocus-link-style:hover {
  5290. color: #982822;
  5291. fill: #982822
  5292. }
  5293. .button--theme-visible-only-onfocus-link-style:disabled,
  5294. .button--theme-visible-only-onfocus-link-style:disabled:active,
  5295. .button--theme-visible-only-onfocus-link-style:disabled:hover {
  5296. cursor: not-allowed;
  5297. color: #bcbcbc;
  5298. fill: #bcbcbc
  5299. }
  5300. .button-loading {
  5301. position: relative
  5302. }
  5303. .button-loading__animation {
  5304. position: absolute;
  5305. animation: display 1ms .5s forwards;
  5306. opacity: 0;
  5307. top: 0;
  5308. right: 0;
  5309. left: 0;
  5310. bottom: 0;
  5311. background-color: #8a8a8a
  5312. }
  5313. .button-loading__animation div {
  5314. position: relative;
  5315. display: inline-block;
  5316. width: 7px;
  5317. height: 7px;
  5318. border-radius: 7px;
  5319. background-color: #fff;
  5320. margin-right: 5px;
  5321. animation: dot-animation 1s ease-in-out .5s infinite
  5322. }
  5323. .button-loading__animation div:nth-child(2) {
  5324. animation-delay: .65s
  5325. }
  5326. .button-loading__animation div:nth-child(3) {
  5327. animation-delay: .75s;
  5328. margin-right: 0
  5329. }
  5330. @keyframes dot-animation {
  5331. 0% {
  5332. top: 0
  5333. }
  5334. 20% {
  5335. top: -8px
  5336. }
  5337. 40% {
  5338. top: 0
  5339. }
  5340. to {
  5341. top: 0
  5342. }
  5343. }
  5344. @keyframes display {
  5345. 0% {
  5346. opacity: 0
  5347. }
  5348. to {
  5349. opacity: 1
  5350. }
  5351. }
  5352. .input-date-group {
  5353. display: flex;
  5354. flex-direction: column;
  5355. justify-content: space-between
  5356. }
  5357. @media(min-width:34.375em) {
  5358. .input-date-group {
  5359. flex-direction: row
  5360. }
  5361. }
  5362. .input-date-group__date-input-group {
  5363. display: flex;
  5364. flex-flow: column;
  5365. margin-top: 20px;
  5366. margin-bottom: 20px
  5367. }
  5368. @media(min-width:48em) {
  5369. .input-date-group__date-input-group {
  5370. margin-right: 10px
  5371. }
  5372. }
  5373. .input-date-group__date-input-group.text-group {
  5374. margin-top: 0
  5375. }
  5376. .input-date-group__date-input-group .dropdown-group__wrapper {
  5377. order: 2
  5378. }
  5379. .input-date-group__date-input-group:last-of-type {
  5380. margin-right: 0
  5381. }
  5382. .input-date-group__date-input-group.dropdown-group,
  5383. .input-date-group__date-input-group.dropdown-group:last-of-type {
  5384. margin-top: 0
  5385. }
  5386. @media(min-width:34.375em) {
  5387. .input-date-group__date-input-group.dropdown-group {
  5388. margin-top: 0
  5389. }
  5390. }
  5391. .input-date-group--error {
  5392. order: 1;
  5393. margin-top: 3px
  5394. }
  5395. .checkbox-group,
  5396. .refine-search__services-radio-group-single {
  5397. margin: 20px 0;
  5398. display: flex;
  5399. align-items: baseline
  5400. }
  5401. .checkbox-group__text,
  5402. .refine-search__services-radio-text {
  5403. display: block;
  5404. margin-left: 16px
  5405. }
  5406. .checkbox-group__label {
  5407. display: block;
  5408. text-align: left
  5409. }
  5410. .checkbox-group__icon,
  5411. .refine-search__services-radio-checkbox-icon {
  5412. display: inline-block;
  5413. overflow: hidden;
  5414. vertical-align: text-bottom;
  5415. background: #bcbcbc;
  5416. border: 1px solid transparent;
  5417. width: 18px;
  5418. height: 18px
  5419. }
  5420. .checkbox-group__icon .sprite,
  5421. .refine-search__services-radio-checkbox-icon .sprite {
  5422. position: relative;
  5423. width: 20px;
  5424. height: 20px;
  5425. left: -2px;
  5426. top: -2px;
  5427. fill: #191919
  5428. }
  5429. .checkbox-group__input:active+.checkbox-group__icon,
  5430. .checkbox-group__input:active+.refine-search__services-radio-checkbox-icon,
  5431. .checkbox-group__input:focus+.checkbox-group__icon,
  5432. .checkbox-group__input:focus+.refine-search__services-radio-checkbox-icon,
  5433. .refine-search__services-radio-input:active+.checkbox-group__icon,
  5434. .refine-search__services-radio-input:active+.refine-search__services-radio-checkbox-icon,
  5435. .refine-search__services-radio-input:focus+.checkbox-group__icon,
  5436. .refine-search__services-radio-input:focus+.refine-search__services-radio-checkbox-icon {
  5437. border-color: #8a8a8a
  5438. }
  5439. .checkbox-group__error {
  5440. display: block;
  5441. margin-top: 6px;
  5442. color: #bb2620
  5443. }
  5444. .ds-checkbox .checkmark {
  5445. height: 18px;
  5446. width: 18px;
  5447. border: 2px solid #655c6c;
  5448. border-radius: 4px;
  5449. background-color: #fff;
  5450. top: 2px
  5451. }
  5452. .ds-checkbox .checkmark:before {
  5453. width: 40px;
  5454. height: 40px;
  5455. background: #615395;
  5456. opacity: .08;
  5457. border-radius: 50%;
  5458. position: absolute;
  5459. left: -13px;
  5460. top: -13px
  5461. }
  5462. .ds-checkbox input[type=checkbox]:active~.checkbox-input--label .checkmark,
  5463. .ds-checkbox input[type=checkbox]:focus~.checkbox-input--label .checkmark {
  5464. border-color: #615395
  5465. }
  5466. .ds-checkbox input[type=checkbox]:active~.checkbox-input--label .checkmark:before,
  5467. .ds-checkbox input[type=checkbox]:focus~.checkbox-input--label .checkmark:before {
  5468. content: ""
  5469. }
  5470. .ds-checkbox.checkbox-input--checked .checkmark {
  5471. height: 18px;
  5472. width: 18px;
  5473. border: 1px solid #157a77;
  5474. border-radius: 4px;
  5475. background-color: #157a77;
  5476. top: 2px
  5477. }
  5478. .ds-checkbox.checkbox-input--checked .checkmark:after {
  5479. display: block;
  5480. border: solid #fff;
  5481. border-width: 0 2px 2px 0;
  5482. left: 5px;
  5483. bottom: 3px;
  5484. width: 6px;
  5485. height: 12px
  5486. }
  5487. .ds-checkbox.checkbox-input--checked .checkmark:before {
  5488. left: -12px;
  5489. top: -12px
  5490. }
  5491. .ds-checkbox.checkbox-input--checked input[type=checkbox]:active~.checkbox-input--label .checkmark,
  5492. .ds-checkbox.checkbox-input--checked input[type=checkbox]:focus~.checkbox-input--label .checkmark {
  5493. background: #615395
  5494. }
  5495. .ds-checkbox input[type=checkbox]:disabled~.checkbox-input--label .checkmark {
  5496. border-color: #9e93a6
  5497. }
  5498. .checkbox-group-new-ds {
  5499. display: flex;
  5500. align-items: center
  5501. }
  5502. .checkbox-group-new-ds__icon {
  5503. display: inline-block;
  5504. overflow: hidden;
  5505. vertical-align: text-bottom;
  5506. background: #fff;
  5507. border: 2px solid #655c6c;
  5508. border-radius: 2px;
  5509. width: 18px;
  5510. height: 18px;
  5511. cursor: pointer
  5512. }
  5513. .checkbox-group-new-ds__icon .sprite {
  5514. position: relative;
  5515. width: 18px;
  5516. height: 18px;
  5517. left: -2px;
  5518. top: -2px;
  5519. fill: #fff
  5520. }
  5521. .checkbox-group-new-ds__icon--checked {
  5522. border: 2px solid #157a77;
  5523. background-color: #157a77
  5524. }
  5525. .checkbox-group-new-ds__icon--error {
  5526. border-color: #c42d0c
  5527. }
  5528. .checkbox-group-new-ds__label {
  5529. display: flex
  5530. }
  5531. .checkbox-group-new-ds__label p {
  5532. margin: 0
  5533. }
  5534. .checkbox-group-new-ds__background {
  5535. display: flex;
  5536. min-width: 40px;
  5537. height: 40px;
  5538. border-radius: 50%;
  5539. align-items: center;
  5540. justify-content: center;
  5541. background-color: transparent;
  5542. border: none
  5543. }
  5544. .checkbox-group-new-ds__background:active,
  5545. .checkbox-group-new-ds__background:focus,
  5546. .checkbox-group-new-ds__background:hover {
  5547. background-color: rgba(97, 83, 149, .0784313725);
  5548. outline: none
  5549. }
  5550. .checkbox-group-new-ds__background:active .ds-checkbox-group__icon,
  5551. .checkbox-group-new-ds__background:focus .ds-checkbox-group__icon,
  5552. .checkbox-group-new-ds__background:hover .ds-checkbox-group__icon {
  5553. border-color: #615395;
  5554. background-color: rgba(97, 83, 149, .0784313725)
  5555. }
  5556. .checkbox-group-new-ds__background:active .ds-checkbox-group__icon--checked,
  5557. .checkbox-group-new-ds__background:focus .ds-checkbox-group__icon--checked,
  5558. .checkbox-group-new-ds__background:hover .ds-checkbox-group__icon--checked {
  5559. border-color: #615395;
  5560. background-color: #615395
  5561. }
  5562. .checkbox-group-new-ds__error {
  5563. margin-top: 10px
  5564. }
  5565. .dropdown-group {
  5566. margin-top: 20px;
  5567. margin-bottom: 20px
  5568. }
  5569. .dropdown-group__container {
  5570. position: relative
  5571. }
  5572. .dropdown-group__dropdown {
  5573. -webkit-appearance: none;
  5574. -moz-appearance: none;
  5575. appearance: none;
  5576. -webkit-user-select: none;
  5577. -moz-user-select: none;
  5578. background-color: #f0f0f0;
  5579. border: 1px solid #f0f0f0;
  5580. border-radius: 0;
  5581. font-size: 1.125rem;
  5582. width: 100%;
  5583. padding: 14px 48px 13px 22px;
  5584. position: relative;
  5585. text-overflow: ellipsis;
  5586. overflow: hidden;
  5587. white-space: pre-wrap
  5588. }
  5589. @media(min-width:48em) {
  5590. .dropdown-group__dropdown {
  5591. margin-right: 68px
  5592. }
  5593. }
  5594. .dropdown-group__dropdown-error {
  5595. border: 1px solid #bb2620
  5596. }
  5597. .dropdown-group__dropdown:invalid {
  5598. color: #8a8a8a
  5599. }
  5600. .dropdown-group__dropdown::-ms-expand {
  5601. display: none
  5602. }
  5603. .dropdown-group__item {
  5604. width: 760px;
  5605. text-align: left;
  5606. -moz-text-align-last: center;
  5607. text-align-last: center
  5608. }
  5609. .dropdown-group__label {
  5610. margin-top: 3px;
  5611. margin-bottom: 1px
  5612. }
  5613. .dropdown-group__icon--caret {
  5614. fill: #ee3124;
  5615. transform: rotate(90deg)
  5616. }
  5617. .dropdown-group__error-text {
  5618. color: #bb2620;
  5619. margin-top: 3px
  5620. }
  5621. .dropdown-group--new-design-system.dropdown-group {
  5622. text-align: left
  5623. }
  5624. .dropdown-group--new-design-system .dropdown-group__container {
  5625. margin-top: 8px
  5626. }
  5627. .dropdown-group--new-design-system .dropdown-group__dropdown {
  5628. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  5629. font-size: .9375rem;
  5630. line-height: 1.25rem;
  5631. color: #403840;
  5632. outline: none;
  5633. background-color: #fff;
  5634. border-radius: 4px;
  5635. border: 1px solid #2d2e39;
  5636. padding: 16px 48px 16px 22px
  5637. }
  5638. @media(min-width:48em) {
  5639. .dropdown-group--new-design-system .dropdown-group__dropdown {
  5640. font-size: 1rem;
  5641. line-height: 1.375rem
  5642. }
  5643. }
  5644. .dropdown-group--new-design-system .dropdown-group__dropdown-error,
  5645. .dropdown-group--new-design-system .dropdown-group__dropdown-error:focus {
  5646. border: 1px solid #c42d0c;
  5647. box-shadow: 0 0 0 1px #c42d0c
  5648. }
  5649. .dropdown-group--new-design-system .dropdown-group__dropdown-success,
  5650. .dropdown-group--new-design-system .dropdown-group__dropdown-success:focus {
  5651. border: 1px solid #098560;
  5652. box-shadow: 0 0 0 1px #098560
  5653. }
  5654. .dropdown-group--new-design-system .dropdown-group__item {
  5655. -moz-text-align-last: left;
  5656. text-align-last: left
  5657. }
  5658. .dropdown-group--new-design-system .dropdown-group__error-text {
  5659. margin-top: 12px;
  5660. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  5661. }
  5662. .dropdown-group--new-design-system .dropdown-group__icon--caret {
  5663. fill: #655c6c
  5664. }
  5665. .dropdown-group--new-design-system .dropdown-group__icon--caret-red {
  5666. transform: rotate(90deg);
  5667. fill: #c42d0c
  5668. }
  5669. .dropdown-group--new-design-system .dropdown-group__icon--success {
  5670. width: 18px;
  5671. height: auto
  5672. }
  5673. .radio-group__option {
  5674. margin-bottom: 20px
  5675. }
  5676. .radio-group__label {
  5677. display: flex;
  5678. align-items: center
  5679. }
  5680. .radio-group__label:before {
  5681. content: "";
  5682. display: block;
  5683. width: 24px;
  5684. height: 24px;
  5685. margin-right: 16px;
  5686. background: #f0f0f0;
  5687. border: 1px solid transparent;
  5688. border-radius: 50%;
  5689. flex-shrink: 0
  5690. }
  5691. .radio-group__input:checked+.radio-group__label:before {
  5692. background: #fff;
  5693. border: 8px solid #ee3124
  5694. }
  5695. .text-group {
  5696. margin-top: 20px;
  5697. margin-bottom: 20px
  5698. }
  5699. .text-group__input-container {
  5700. position: relative
  5701. }
  5702. .text-group__input-container--with-addon .flyers-header__input,
  5703. .text-group__input-container--with-addon .homepage-stores__input,
  5704. .text-group__input-container--with-addon .search-box__input,
  5705. .text-group__input-container--with-addon .text-group__input {
  5706. padding-left: 100px
  5707. }
  5708. .flyers-header__input,
  5709. .homepage-stores__input,
  5710. .search-box__input,
  5711. .text-group__input {
  5712. font-size: 1.125rem;
  5713. line-height: 1.4444444444;
  5714. padding: 14px 22px;
  5715. background: #f0f0f0;
  5716. border: 1px solid transparent;
  5717. border-radius: 0;
  5718. -webkit-appearance: none;
  5719. -moz-appearance: none;
  5720. appearance: none
  5721. }
  5722. .flyers-header__input::-moz-placeholder,
  5723. .homepage-stores__input::-moz-placeholder,
  5724. .search-box__input::-moz-placeholder,
  5725. .text-group__input::-moz-placeholder {
  5726. color: #8a8a8a;
  5727. -webkit-font-smoothing: antialiased
  5728. }
  5729. .flyers-header__input::placeholder,
  5730. .homepage-stores__input::placeholder,
  5731. .search-box__input::placeholder,
  5732. .text-group__input::placeholder {
  5733. color: #8a8a8a;
  5734. -webkit-font-smoothing: antialiased
  5735. }
  5736. .flyers-header__input:focus,
  5737. .homepage-stores__input:focus,
  5738. .search-box__input:focus,
  5739. .text-group__input:focus {
  5740. border-color: #8a8a8a
  5741. }
  5742. .text-group__input--error,
  5743. .text-group__input--error:focus {
  5744. border-color: #bb2620
  5745. }
  5746. .text-group__input--error,
  5747. .text-group__input--password {
  5748. padding-right: 56px
  5749. }
  5750. .text-group__input--error::-ms-reveal,
  5751. .text-group__input--password::-ms-reveal {
  5752. display: none
  5753. }
  5754. .text-group__input-addon {
  5755. font-size: 1.125rem;
  5756. line-height: 1.4444444444;
  5757. padding: 16px 0;
  5758. left: 22px;
  5759. white-space: nowrap
  5760. }
  5761. .text-group__input-addon,
  5762. .text-group__input-icon {
  5763. position: absolute;
  5764. top: 0;
  5765. bottom: 0;
  5766. margin: auto;
  5767. pointer-events: none
  5768. }
  5769. .text-group__input-icon {
  5770. right: 16px;
  5771. width: 24px;
  5772. height: 24px;
  5773. z-index: 1
  5774. }
  5775. .text-group__input-icon--privacy {
  5776. fill: #585858
  5777. }
  5778. .text-group__input-icon--success {
  5779. fill: #007a7c
  5780. }
  5781. .text-group__input-icon--spinner circle:last-child {
  5782. fill-opacity: 0;
  5783. stroke: #bcbcbc;
  5784. stroke-width: 6;
  5785. stroke-dasharray: 42 14;
  5786. stroke-dashoffset: -56;
  5787. animation: rotate 1.5s linear infinite
  5788. }
  5789. .text-group__input-icon--spinner circle:first-child {
  5790. fill-opacity: 0;
  5791. stroke: #ddd;
  5792. stroke-width: 6
  5793. }
  5794. @keyframes rotate {
  5795. 0% {
  5796. stroke-dasharray: 49 7;
  5797. stroke-dashoffset: -56
  5798. }
  5799. 25% {
  5800. stroke-dasharray: 21 35;
  5801. stroke-dashoffset: -42
  5802. }
  5803. to {
  5804. stroke-dasharray: 49 7;
  5805. stroke-dashoffset: 0
  5806. }
  5807. }
  5808. .text-group__label {
  5809. display: inline-block
  5810. }
  5811. .text-group__label-optional-text {
  5812. text-transform: none;
  5813. font-style: italic;
  5814. color: #8a8a8a;
  5815. letter-spacing: 0;
  5816. -webkit-font-smoothing: antialiased
  5817. }
  5818. .invitation-form__error-message,
  5819. .text-group__error,
  5820. .toggleable-container .account-setting__error {
  5821. margin-top: 6px;
  5822. color: #bb2620
  5823. }
  5824. .text-group__trailing-text {
  5825. color: #8a8a8a;
  5826. position: absolute;
  5827. right: 12px;
  5828. top: 50%;
  5829. transform: translateY(-50%)
  5830. }
  5831. .text-group__subtext {
  5832. margin-top: 6px
  5833. }
  5834. .text-group__subtext--dark {
  5835. color: #191919
  5836. }
  5837. .text-group--block,
  5838. .text-group--block .flyers-header__input,
  5839. .text-group--block .homepage-stores__input,
  5840. .text-group--block .search-box__input,
  5841. .text-group--block .text-group__input {
  5842. display: block;
  5843. width: 100%
  5844. }
  5845. .text-group--new-design-system .flyers-header__input,
  5846. .text-group--new-design-system .homepage-stores__input,
  5847. .text-group--new-design-system .search-box__input,
  5848. .text-group--new-design-system .text-group__input {
  5849. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  5850. font-size: .9375rem;
  5851. line-height: 1.25rem;
  5852. color: #403840;
  5853. padding: 16px;
  5854. background-color: #fff;
  5855. border-radius: 4px;
  5856. border: 1px solid #2d2e39;
  5857. -webkit-text-fill-color: #403840;
  5858. margin-bottom: 11px
  5859. }
  5860. @media(min-width:48em) {
  5861. .text-group--new-design-system .flyers-header__input,
  5862. .text-group--new-design-system .homepage-stores__input,
  5863. .text-group--new-design-system .search-box__input,
  5864. .text-group--new-design-system .text-group__input {
  5865. font-size: 1rem;
  5866. line-height: 1.375rem
  5867. }
  5868. }
  5869. .text-group--new-design-system .flyers-header__input:focus,
  5870. .text-group--new-design-system .homepage-stores__input:focus,
  5871. .text-group--new-design-system .search-box__input:focus,
  5872. .text-group--new-design-system .text-group__input:focus {
  5873. outline: 0;
  5874. box-shadow: 0 0 0 1px #615395;
  5875. border: 1px solid #615395
  5876. }
  5877. @media(min-width:48em) {
  5878. .text-group--new-design-system .flyers-header__input,
  5879. .text-group--new-design-system .homepage-stores__input,
  5880. .text-group--new-design-system .search-box__input,
  5881. .text-group--new-design-system .text-group__input {
  5882. margin-bottom: 12px
  5883. }
  5884. }
  5885. .text-group--new-design-system .text-group__input--error,
  5886. .text-group--new-design-system .text-group__input--error:focus {
  5887. border: 1px solid #c42d0c;
  5888. box-shadow: 0 0 0 1px #c42d0c
  5889. }
  5890. .text-group--new-design-system .text-group__input--success,
  5891. .text-group--new-design-system .text-group__input--success:focus {
  5892. border: 1px solid #098560;
  5893. box-shadow: 0 0 0 1px #098560
  5894. }
  5895. .text-group--new-design-system .text-group__input-icon--success {
  5896. width: 18px;
  5897. height: 18px;
  5898. fill: #098560
  5899. }
  5900. .text-group--new-design-system .text-group__label {
  5901. margin-bottom: 12px
  5902. }
  5903. .text-group--new-design-system .invitation-form__error-message,
  5904. .text-group--new-design-system .text-group__error,
  5905. .text-group--new-design-system .toggleable-container .account-setting__error,
  5906. .toggleable-container .text-group--new-design-system .account-setting__error {
  5907. display: flex;
  5908. color: #bb2620
  5909. }
  5910. .text-group--new-design-system .invitation-form__error-message .error-icon-input,
  5911. .text-group--new-design-system .text-group__error .error-icon-input,
  5912. .text-group--new-design-system .toggleable-container .account-setting__error .error-icon-input,
  5913. .toggleable-container .text-group--new-design-system .account-setting__error .error-icon-input {
  5914. margin-right: 7px
  5915. }
  5916. .text-group--new-design-system .text-group__input-container--with-addon .flyers-header__input,
  5917. .text-group--new-design-system .text-group__input-container--with-addon .homepage-stores__input,
  5918. .text-group--new-design-system .text-group__input-container--with-addon .search-box__input,
  5919. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input {
  5920. padding-left: 81px
  5921. }
  5922. @media(min-width:48em) {
  5923. .text-group--new-design-system .text-group__input-container--with-addon .flyers-header__input,
  5924. .text-group--new-design-system .text-group__input-container--with-addon .homepage-stores__input,
  5925. .text-group--new-design-system .text-group__input-container--with-addon .search-box__input,
  5926. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input {
  5927. padding-left: 86px
  5928. }
  5929. }
  5930. .text-group--new-design-system .text-group__input-container--with-addon .text-group__input-addon {
  5931. line-height: inherit;
  5932. padding: 16px 0
  5933. }
  5934. .text-group__textarea {
  5935. line-height: 1.222222222;
  5936. resize: vertical
  5937. }
  5938. .input-group {
  5939. display: block;
  5940. margin: 20px 0
  5941. }
  5942. .form-error__error-text {
  5943. margin-top: 6px;
  5944. color: #bb2620;
  5945. text-align: center
  5946. }
  5947. .input-error-new-design-system {
  5948. display: flex;
  5949. color: #bb2620
  5950. }
  5951. .input-error-new-design-system .error-icon-input {
  5952. width: 18px;
  5953. margin-right: 6px;
  5954. flex-shrink: 0
  5955. }
  5956. .input-error-new-design-system .error-text-input {
  5957. margin-top: 3px
  5958. }
  5959. .date-picker {
  5960. display: block;
  5961. margin: 16px 0
  5962. }
  5963. @media(min-width:64em) {
  5964. .date-picker {
  5965. margin: 18px 0
  5966. }
  5967. }
  5968. .date-picker__container {
  5969. position: relative
  5970. }
  5971. .date-picker__calendar-icon {
  5972. pointer-events: none;
  5973. position: absolute;
  5974. top: 0;
  5975. bottom: 0;
  5976. right: 16px;
  5977. width: 24px;
  5978. height: 24px;
  5979. margin: auto;
  5980. z-index: 1
  5981. }
  5982. .date-picker__input {
  5983. -webkit-appearance: none;
  5984. -moz-appearance: none;
  5985. appearance: none;
  5986. background-color: #f0f0f0;
  5987. border: 1px solid #f0f0f0;
  5988. border-radius: 0;
  5989. font-size: 1.125rem;
  5990. width: 100%;
  5991. padding: 14px 48px 13px 22px;
  5992. position: relative;
  5993. color: #000;
  5994. height: 56px
  5995. }
  5996. @media(min-width:64em) {
  5997. .date-picker__input {
  5998. height: 100%
  5999. }
  6000. }
  6001. .date-picker__input--error {
  6002. border: 1px solid #bb2620
  6003. }
  6004. .date-picker__input:invalid {
  6005. color: #8a8a8a
  6006. }
  6007. .date-picker__input:disabled {
  6008. color: #585858
  6009. }
  6010. .date-picker__input:disabled::-webkit-datetime-edit-year-field {
  6011. color: #585858
  6012. }
  6013. .date-picker__input:valid::-webkit-datetime-edit-year-field {
  6014. color: #000
  6015. }
  6016. .date-picker__input::-webkit-calendar-picker-indicator,
  6017. .date-picker__input::-webkit-inner-spin-button {
  6018. cursor: pointer;
  6019. position: absolute;
  6020. right: 12px;
  6021. top: 16px;
  6022. width: 24px;
  6023. height: 24px;
  6024. z-index: 1;
  6025. opacity: 0
  6026. }
  6027. .account-device-edit {
  6028. display: flex;
  6029. align-items: baseline;
  6030. width: 100%
  6031. }
  6032. .account-device-edit__form {
  6033. width: 100%
  6034. }
  6035. .account-device-edit__top-section {
  6036. padding: 20px;
  6037. display: flex
  6038. }
  6039. @media(min-width:48em) {
  6040. .account-device-edit__top-section {
  6041. padding: 20px 25px 20px 40px
  6042. }
  6043. }
  6044. @media(min-width:64em) {
  6045. .account-device-edit__top-section .sprite {
  6046. margin-right: 48px
  6047. }
  6048. }
  6049. @media(min-width:48em) {
  6050. .account-device-edit__top-section .account-device__nickname {
  6051. flex-basis: 250px;
  6052. margin-left: 48px
  6053. }
  6054. }
  6055. @media(min-width:64em) {
  6056. .account-device-edit__top-section .account-device__nickname {
  6057. margin-left: 0
  6058. }
  6059. }
  6060. .account-device-edit__top-section .account-device__last-four {
  6061. margin-right: 0;
  6062. color: #585858;
  6063. align-self: center
  6064. }
  6065. .account-device-edit__mid-section {
  6066. padding: 0 20px 24px;
  6067. justify-content: flex-start
  6068. }
  6069. @media(min-width:48em) {
  6070. .account-device-edit__mid-section {
  6071. display: flex;
  6072. flex-flow: row nowrap;
  6073. justify-content: space-between;
  6074. padding: 25px 0 20px 140px
  6075. }
  6076. }
  6077. @media(min-width:48em) {
  6078. .account-device-edit__nickname {
  6079. display: flex;
  6080. flex-flow: row wrap;
  6081. align-items: flex-start
  6082. }
  6083. }
  6084. .account-device-edit__card-state {
  6085. max-width: 350px;
  6086. margin: 15px 0 0
  6087. }
  6088. @media(min-width:48em) {
  6089. .account-device-edit__card-state:nth-of-type(2) {
  6090. margin-left: 20px
  6091. }
  6092. }
  6093. @media(min-width:48em) {
  6094. .account-device-edit__card-state {
  6095. margin-top: 0
  6096. }
  6097. }
  6098. @media(min-width:64em) {
  6099. .account-device-edit__card-state {
  6100. max-width: 280px
  6101. }
  6102. }
  6103. .account-device-edit__card-state .checkbox-group,
  6104. .account-device-edit__card-state .refine-search__services-radio-group-single {
  6105. margin: 0
  6106. }
  6107. .account-device-edit__card-state--note {
  6108. margin-top: 10px;
  6109. display: block
  6110. }
  6111. .account-device-edit__unlink {
  6112. cursor: pointer;
  6113. padding: 0 20px 24px
  6114. }
  6115. @media(min-width:48em) {
  6116. .account-device-edit__unlink {
  6117. padding: 0 0 20px 140px
  6118. }
  6119. }
  6120. .account-device-edit__actions {
  6121. text-align: center;
  6122. padding: 20px 20px 12px;
  6123. border-top: 1px solid #ddd
  6124. }
  6125. @media(min-width:48em) {
  6126. .account-device-edit__actions {
  6127. display: flex;
  6128. flex-flow: row nowrap;
  6129. align-items: baseline;
  6130. padding: 26px 48px 30px 140px;
  6131. margin-right: -68px
  6132. }
  6133. }
  6134. @media(min-width:48em) {
  6135. .account-device-edit__close-button,
  6136. .account-device-edit__submit-button {
  6137. display: inline-block;
  6138. width: auto
  6139. }
  6140. }
  6141. .account-device-edit__close-button {
  6142. margin-top: 6px;
  6143. padding: 10px 0
  6144. }
  6145. @media(min-width:48em) {
  6146. .account-device-edit__close-button {
  6147. padding: 0;
  6148. margin-top: 0;
  6149. margin-left: 30px
  6150. }
  6151. }
  6152. @media(min-width:48em) {
  6153. .account-device-edit__permissions {
  6154. flex-basis: 54%
  6155. }
  6156. }
  6157. .account-device-edit__input-field {
  6158. margin: 0
  6159. }
  6160. @media(min-width:48em) {
  6161. .account-device-edit__input-field {
  6162. flex-basis: 260px;
  6163. margin: 0 30px 0 0
  6164. }
  6165. }
  6166. .account-device-edit__assign-device {
  6167. margin-top: 14px
  6168. }
  6169. @media(min-width:48em) {
  6170. .account-device-edit__assign-device {
  6171. flex-basis: 100%;
  6172. margin-top: 20px;
  6173. display: flex;
  6174. justify-content: space-between
  6175. }
  6176. }
  6177. .account-device-edit__assign-device button {
  6178. text-align: left
  6179. }
  6180. .account-device-edit .checkbox-group__icon,
  6181. .account-device-edit .refine-search__services-radio-checkbox-icon {
  6182. background: #fff;
  6183. border: 1px solid #655c6c;
  6184. border-radius: 2px
  6185. }
  6186. .account-device-edit .checkbox-group__icon:active,
  6187. .account-device-edit .checkbox-group__icon:focus,
  6188. .account-device-edit .refine-search__services-radio-checkbox-icon:active,
  6189. .account-device-edit .refine-search__services-radio-checkbox-icon:focus {
  6190. border-color: #615395;
  6191. background-color: rgba(97, 83, 149, .0784313725)
  6192. }
  6193. .account-device-edit .checkbox-group__input:checked~.checkbox-group__icon,
  6194. .account-device-edit .checkbox-group__input:checked~.refine-search__services-radio-checkbox-icon,
  6195. .account-device-edit .refine-search__services-radio-input:checked~.checkbox-group__icon,
  6196. .account-device-edit .refine-search__services-radio-input:checked~.refine-search__services-radio-checkbox-icon {
  6197. border-color: #157a77;
  6198. background-color: #157a77
  6199. }
  6200. .account-device-edit .checkbox-group__input:checked~.checkbox-group__icon .sprite,
  6201. .account-device-edit .checkbox-group__input:checked~.refine-search__services-radio-checkbox-icon .sprite,
  6202. .account-device-edit .refine-search__services-radio-input:checked~.checkbox-group__icon .sprite,
  6203. .account-device-edit .refine-search__services-radio-input:checked~.refine-search__services-radio-checkbox-icon .sprite {
  6204. fill: #fff
  6205. }
  6206. .account-device-edit__phone-number {
  6207. white-space: nowrap
  6208. }
  6209. .communication-opt-in-form {
  6210. text-align: left
  6211. }
  6212. .communication-opt-in-form .checkbox-group__text,
  6213. .communication-opt-in-form .refine-search__services-radio-text {
  6214. display: flex;
  6215. margin-top: 0;
  6216. margin-bottom: 0
  6217. }
  6218. .communication-opt-in-form__email-checkbox {
  6219. margin: 0
  6220. }
  6221. .communication-opt-in-form__consent {
  6222. font-size: .875rem;
  6223. padding: 60px 0 0
  6224. }
  6225. @media(min-width:34.375em) {
  6226. .communication-opt-in-form__consent {
  6227. padding: 80px 60px 0
  6228. }
  6229. }
  6230. .communication-opt-in-form__consent-text-1>p {
  6231. margin-top: 0
  6232. }
  6233. .communication-opt-in-form__consent:before {
  6234. content: "";
  6235. display: block;
  6236. position: absolute;
  6237. height: 1px;
  6238. width: 100%;
  6239. left: 0;
  6240. margin-top: -30px;
  6241. background: #ddd
  6242. }
  6243. @media(min-width:48em) {
  6244. .communication-opt-in-form__consent:before {
  6245. margin-top: -40px
  6246. }
  6247. }
  6248. .communication-opt-in-form__affiliates {
  6249. color: #585858;
  6250. line-height: 2;
  6251. display: flex;
  6252. flex-flow: row wrap;
  6253. padding-left: 15px
  6254. }
  6255. .communication-opt-in-form__affiliates-item {
  6256. flex-basis: 100%
  6257. }
  6258. @media(min-width:48em) {
  6259. .communication-opt-in-form__affiliates-item {
  6260. flex-basis: 50%
  6261. }
  6262. }
  6263. .communication-opt-in-form__flow-form-submit {
  6264. text-align: center
  6265. }
  6266. @media(max-width:47.99em) {
  6267. .communication-opt-in-form__flow-form-submit {
  6268. margin-top: 40px
  6269. }
  6270. }
  6271. .settings-form--language-preferences .input-group {
  6272. margin-left: auto;
  6273. margin-right: auto
  6274. }
  6275. .settings-form .input-group,
  6276. .settings-form__title {
  6277. margin-top: 0
  6278. }
  6279. .settings-form__row-wrapper {
  6280. display: flex;
  6281. flex-direction: row
  6282. }
  6283. .settings-form__description {
  6284. margin-top: -10px;
  6285. margin-bottom: 10px;
  6286. color: #8a8a8a;
  6287. font-size: 14px
  6288. }
  6289. .settings-form__checkbox-container {
  6290. margin-top: 10px;
  6291. margin-bottom: 10px
  6292. }
  6293. .settings-form__checkbox-input {
  6294. margin-right: 10px
  6295. }
  6296. .settings-form__input-separator {
  6297. line-height: 4.6rem
  6298. }
  6299. .settings-form__email {
  6300. margin-bottom: 0;
  6301. text-align: left
  6302. }
  6303. .settings-form__email--cancel {
  6304. margin-top: 20px;
  6305. display: block
  6306. }
  6307. .pco-login-form__card-image {
  6308. display: block;
  6309. width: 237px;
  6310. max-width: 100%;
  6311. margin: auto auto 30px
  6312. }
  6313. .pco-login-form__card-field {
  6314. text-align: left;
  6315. margin: 0 auto 30px
  6316. }
  6317. @media(max-width:25em) {
  6318. .pco-login-form__card-field .flyers-header__input,
  6319. .pco-login-form__card-field .homepage-stores__input,
  6320. .pco-login-form__card-field .search-box__input,
  6321. .pco-login-form__card-field .text-group__input {
  6322. font-size: 4.5vw;
  6323. padding-left: calc(25% + 22px)
  6324. }
  6325. .pco-login-form__card-field .text-group__input--error {
  6326. padding-right: 40px
  6327. }
  6328. .pco-login-form__card-field .text-group__input-addon {
  6329. font-size: 4.5vw;
  6330. line-height: 1.4444444444
  6331. }
  6332. .pco-login-form__card-field .text-group__input-icon {
  6333. right: 10px
  6334. }
  6335. }
  6336. @media(max-width:19.99em) {
  6337. .pco-login-form__card-field .flyers-header__input,
  6338. .pco-login-form__card-field .homepage-stores__input,
  6339. .pco-login-form__card-field .search-box__input,
  6340. .pco-login-form__card-field .text-group__input {
  6341. font-size: .875rem;
  6342. padding-left: 78px
  6343. }
  6344. .pco-login-form__card-field .text-group__input-addon {
  6345. font-size: .875rem;
  6346. line-height: 1.4444444444
  6347. }
  6348. }
  6349. .pco-login-form .flow-tile {
  6350. padding-top: 50px;
  6351. padding-bottom: 60px
  6352. }
  6353. .pco-login-form .flow-form-submit__cancel,
  6354. .pco-login-form .flow-form-submit__content {
  6355. margin-top: 30px
  6356. }
  6357. .pco-login-form .flow-form-submit__submit {
  6358. padding-left: 40px;
  6359. padding-right: 40px
  6360. }
  6361. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__content {
  6362. margin: 0 auto
  6363. }
  6364. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__cancel {
  6365. margin-top: 24px
  6366. }
  6367. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__cancel a {
  6368. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  6369. }
  6370. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__submit {
  6371. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  6372. padding: 12px 24px
  6373. }
  6374. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__submit sup {
  6375. font-size: 10px
  6376. }
  6377. .assign-card-form__content {
  6378. display: flex;
  6379. flex-flow: row wrap;
  6380. margin: auto auto 20px;
  6381. max-width: 300px
  6382. }
  6383. @media(min-width:48em) {
  6384. .assign-card-form__content {
  6385. max-width: none
  6386. }
  6387. }
  6388. .assign-card-form__card-image {
  6389. display: none;
  6390. width: 50%
  6391. }
  6392. @media(min-width:48em) {
  6393. .assign-card-form__card-image {
  6394. display: inline-block;
  6395. margin-bottom: 40px
  6396. }
  6397. }
  6398. .assign-card-form__card-image .sprite {
  6399. width: 170px;
  6400. height: 112px
  6401. }
  6402. .assign-card-form__members-section {
  6403. width: 100%;
  6404. text-align: left
  6405. }
  6406. @media(min-width:48em) {
  6407. .assign-card-form__members-section {
  6408. width: 50%;
  6409. padding-left: 10px
  6410. }
  6411. }
  6412. .assign-card-form__member-title {
  6413. margin: 0 0 10px;
  6414. width: 100%;
  6415. float: none
  6416. }
  6417. .assign-card-form__member-select {
  6418. margin: 0 0 32px
  6419. }
  6420. .assign-card-form .radio-group__option {
  6421. margin-top: 0
  6422. }
  6423. .assign-card-form .flow-form-submit__cancel,
  6424. .assign-card-form .flow-form-submit__submit {
  6425. display: block;
  6426. margin-left: auto;
  6427. margin-right: auto
  6428. }
  6429. .assign-card__invitation {
  6430. margin-bottom: 0
  6431. }
  6432. .invitation-form {
  6433. width: 70vw
  6434. }
  6435. @media(min-width:48em) {
  6436. .invitation-form {
  6437. width: auto
  6438. }
  6439. }
  6440. .invitation-form__member-container {
  6441. padding: 30px 0
  6442. }
  6443. .invitation-form__member-container:first-child {
  6444. padding-top: 0
  6445. }
  6446. @media(min-width:48em) {
  6447. .invitation-form__member-container {
  6448. padding-top: 0
  6449. }
  6450. }
  6451. .invitation-form__member-form {
  6452. display: flex;
  6453. flex-flow: column;
  6454. text-align: left;
  6455. width: 100%
  6456. }
  6457. @media(min-width:48em) {
  6458. .invitation-form__member-form {
  6459. align-content: flex-start;
  6460. flex-flow: row
  6461. }
  6462. }
  6463. .invitation-form__member-form .error-text-input {
  6464. color: #970012
  6465. }
  6466. .invitation-form__name-field {
  6467. order: 2;
  6468. margin-top: 0;
  6469. margin-bottom: 0
  6470. }
  6471. @media(min-width:48em) {
  6472. .invitation-form__name-field {
  6473. order: 1;
  6474. flex-basis: 40%;
  6475. margin-right: 20px
  6476. }
  6477. }
  6478. .invitation-form__email-field {
  6479. order: 3;
  6480. margin-top: 20px;
  6481. margin-bottom: 0
  6482. }
  6483. @media(min-width:48em) {
  6484. .invitation-form__email-field {
  6485. order: 2;
  6486. margin-top: 0;
  6487. flex-basis: 60%
  6488. }
  6489. }
  6490. .invitation-form__remove-button-container {
  6491. order: 1;
  6492. text-align: right
  6493. }
  6494. @media(min-width:48em) {
  6495. .invitation-form__remove-button-container {
  6496. order: 3;
  6497. height: 32px;
  6498. width: 32px;
  6499. margin: 35px 0 0 10px
  6500. }
  6501. }
  6502. .invitation-form__remove-button .sprite {
  6503. fill: #bcbcbc
  6504. }
  6505. @media(min-width:48em) {
  6506. .invitation-form__remove-button {
  6507. min-width: 0;
  6508. padding: 0;
  6509. height: 32px;
  6510. width: 32px
  6511. }
  6512. }
  6513. .invitation-form__max-invite-notice {
  6514. margin-bottom: 20px
  6515. }
  6516. @media(min-width:48em) {
  6517. .invitation-form__max-invite-notice {
  6518. margin-bottom: 30px
  6519. }
  6520. }
  6521. @media(max-width:47.99em) {
  6522. .invitation-form .flow-form-submit__content {
  6523. margin-top: 35px
  6524. }
  6525. }
  6526. .invitation-form__rule {
  6527. display: block
  6528. }
  6529. @media(min-width:48em) {
  6530. .invitation-form__rule {
  6531. display: none
  6532. }
  6533. }
  6534. .invitation-form__error-message {
  6535. text-align: left
  6536. }
  6537. .invitation-form__submission {
  6538. margin-top: 18px
  6539. }
  6540. .invitation-form__submission .flow-form-submit__content {
  6541. margin-top: 0
  6542. }
  6543. .invitation-form__checkbox-container {
  6544. margin-top: 40px
  6545. }
  6546. @media(min-width:48em) {
  6547. .invitation-form__checkbox-container {
  6548. margin-top: 60px
  6549. }
  6550. }
  6551. .invitation-form-checkbox .checkbox-group-new-ds {
  6552. align-items: flex-start;
  6553. margin-left: -10px;
  6554. text-align: left
  6555. }
  6556. .invitation-form-checkbox .checkbox-group-new-ds__icon--error {
  6557. border-color: #6b6272;
  6558. margin-bottom: 0
  6559. }
  6560. .invitation-form-checkbox .checkbox-group-new-ds__text {
  6561. margin: 11px 0 0 4px
  6562. }
  6563. .invitation-form-checkbox .checkbox-group-new-ds__label {
  6564. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  6565. color: #191919
  6566. }
  6567. .invitation-form-checkbox .checkbox-group-new-ds__label .link {
  6568. color: #da291c
  6569. }
  6570. .invitation-form-checkbox .checkbox-group-new-ds__label .link:hover {
  6571. color: #982822
  6572. }
  6573. .invitation-form-checkbox .checkbox-group-new-ds__error {
  6574. margin-top: 4px
  6575. }
  6576. @media(min-width:48em) {
  6577. .invitation-form-checkbox .checkbox-group-new-ds__error {
  6578. margin-top: 8px
  6579. }
  6580. }
  6581. .invitation-form-checkbox .checkbox-group-new-ds .error-text-input {
  6582. color: #970012
  6583. }
  6584. .invitation-form-checkbox:not(:last-child) {
  6585. margin-bottom: 16px
  6586. }
  6587. .enrol-form {
  6588. text-align: left
  6589. }
  6590. .enrol-form__submit-button {
  6591. width: auto;
  6592. margin: 28px auto 0;
  6593. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  6594. padding: 12px 24px
  6595. }
  6596. @media(min-width:48em) {
  6597. .enrol-form__submit-button {
  6598. margin-top: 40px
  6599. }
  6600. }
  6601. .enrol-form__input-text-firstname {
  6602. margin-top: 0;
  6603. margin-bottom: 24px
  6604. }
  6605. .enrol-form .flyers-header__input:disabled,
  6606. .enrol-form .homepage-stores__input:disabled,
  6607. .enrol-form .search-box__input:disabled,
  6608. .enrol-form .text-group__input:disabled {
  6609. background: #f4f1f6;
  6610. border: 2px solid #655c6c
  6611. }
  6612. .enrol-form__input-checkbox {
  6613. margin-bottom: 14px;
  6614. margin-left: -10px
  6615. }
  6616. .enrol-form__expanded-legal-copy {
  6617. border-top: 1px solid rgba(158, 147, 166, .25)
  6618. }
  6619. .enrol-form__expanded-legal-copy a {
  6620. color: #157a77
  6621. }
  6622. .enrol-form__expanded-legal-copy a:hover {
  6623. color: #615395
  6624. }
  6625. .enrol-form__accept-communications {
  6626. border-top: 1px solid rgba(158, 147, 166, .25);
  6627. margin: 30px 0
  6628. }
  6629. .enrol-form__accept-communications>span {
  6630. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  6631. font-weight: 600;
  6632. font-size: 1.25rem;
  6633. line-height: 1.5rem;
  6634. display: block;
  6635. margin: 30px 0 5px
  6636. }
  6637. @media(min-width:48em) {
  6638. .enrol-form__accept-communications>span {
  6639. font-size: 1.5rem;
  6640. line-height: 2rem
  6641. }
  6642. }
  6643. .enrol-form__accept-communications sup {
  6644. font-size: 10px
  6645. }
  6646. .enrol-form__terms-and-conditions {
  6647. border-top: 1px solid rgba(158, 147, 166, .25);
  6648. padding-top: 24px
  6649. }
  6650. .enrol-form__terms-and-conditions sup {
  6651. font-size: 10px
  6652. }
  6653. .enrol-form .checkbox-group-new-ds {
  6654. align-items: flex-start
  6655. }
  6656. .enrol-form .checkbox-group-new-ds__text {
  6657. margin: 9px 0 0 4px
  6658. }
  6659. .enrol-form__privacy-copy {
  6660. color: #403840;
  6661. margin-left: 30px;
  6662. margin-bottom: 20px
  6663. }
  6664. .enrol-form__firstname-helper-text {
  6665. color: #6b6272;
  6666. margin-top: -15px
  6667. }
  6668. .claim-phone-number-form {
  6669. text-align: center
  6670. }
  6671. .claim-phone-number-form .text-group {
  6672. text-align: start
  6673. }
  6674. .claim-phone-number-form__input {
  6675. margin: 16px 0 12px
  6676. }
  6677. .claim-phone-number-form__input .text-group__label {
  6678. margin-bottom: 4px
  6679. }
  6680. .claim-phone-number-form__footer {
  6681. margin: 0;
  6682. display: flex;
  6683. justify-content: center;
  6684. text-align: center
  6685. }
  6686. .claim-phone-number-form__footer p {
  6687. margin: 0 2.5px
  6688. }
  6689. .claim-phone-number-form__submit-button {
  6690. margin: 24px 0 8px;
  6691. padding: 12px 24px;
  6692. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  6693. }
  6694. .base-form label {
  6695. display: block;
  6696. margin-bottom: 8px
  6697. }
  6698. .base-form label .link.primary {
  6699. color: #f9dada
  6700. }
  6701. .base-form input,
  6702. .base-form select {
  6703. color: #403840;
  6704. width: 100%;
  6705. padding: 16px;
  6706. background-color: #fff;
  6707. border-radius: 6px;
  6708. border: 1px solid #9e93a6;
  6709. -webkit-text-fill-color: #403840
  6710. }
  6711. .base-form input:focus,
  6712. .base-form select:focus {
  6713. outline: 0;
  6714. box-shadow: 0 0 0 2px #f9dada
  6715. }
  6716. .base-form select {
  6717. -moz-appearance: none;
  6718. -webkit-appearance: none;
  6719. appearance: none;
  6720. background-repeat: no-repeat;
  6721. background-position: right 17px top 50%
  6722. }
  6723. .base-form select,
  6724. .base-form select:active {
  6725. background-image: url(/static/images/pcoi/up-black.png)
  6726. }
  6727. .base-form select:active {
  6728. transform: rotate(180deg)
  6729. }
  6730. .base-form .checkbox-input,
  6731. .base-form .masked-input,
  6732. .base-form .select-input,
  6733. .base-form .text-input {
  6734. margin-bottom: 16px
  6735. }
  6736. .base-form .checkbox-input--error input,
  6737. .base-form .checkbox-input--error select,
  6738. .base-form .masked-input--error input,
  6739. .base-form .masked-input--error select,
  6740. .base-form .select-input--error input,
  6741. .base-form .select-input--error select,
  6742. .base-form .text-input--error input,
  6743. .base-form .text-input--error select {
  6744. box-shadow: 0 0 0 2px #ff6262
  6745. }
  6746. .base-form .checkbox-input--success input,
  6747. .base-form .checkbox-input--success select,
  6748. .base-form .masked-input--success input,
  6749. .base-form .masked-input--success select,
  6750. .base-form .select-input--success input,
  6751. .base-form .select-input--success select,
  6752. .base-form .text-input--success input,
  6753. .base-form .text-input--success select {
  6754. box-shadow: 0 0 0 1px #fff
  6755. }
  6756. .base-form .checkbox-input--error input:focus,
  6757. .base-form .checkbox-input--error select:focus,
  6758. .base-form .checkbox-input--success input:focus,
  6759. .base-form .checkbox-input--success select:focus,
  6760. .base-form .masked-input--error input:focus,
  6761. .base-form .masked-input--error select:focus,
  6762. .base-form .masked-input--success input:focus,
  6763. .base-form .masked-input--success select:focus,
  6764. .base-form .select-input--error input:focus,
  6765. .base-form .select-input--error select:focus,
  6766. .base-form .select-input--success input:focus,
  6767. .base-form .select-input--success select:focus,
  6768. .base-form .text-input--error input:focus,
  6769. .base-form .text-input--error select:focus,
  6770. .base-form .text-input--success input:focus,
  6771. .base-form .text-input--success select:focus {
  6772. outline: 0;
  6773. box-shadow: 0 0 0 2px #f9dada
  6774. }
  6775. .base-form .lds__button {
  6776. display: inline-block;
  6777. padding: 12px 30px;
  6778. margin: 0 16px 0 0
  6779. }
  6780. .base-form .lds__button:last-child {
  6781. margin: 0
  6782. }
  6783. .base-form .lds__button .circle-loader {
  6784. width: 15px;
  6785. height: 15px
  6786. }
  6787. .base-form input:-webkit-autofill,
  6788. .base-form input:-webkit-autofill:focus,
  6789. .base-form input:-webkit-autofill:hover,
  6790. .base-form option,
  6791. .base-form select:-webkit-autofill,
  6792. .base-form select:-webkit-autofill:focus,
  6793. .base-form select:-webkit-autofill:hover {
  6794. background-color: #fff;
  6795. color: #403840;
  6796. -webkit-text-fill-color: #403840;
  6797. -webkit-transition: background-color 5000s ease-in-out 0s;
  6798. transition: background-color 5000s ease-in-out 0s
  6799. }
  6800. .base-form .error-label,
  6801. .base-form .help-label,
  6802. .base-form .success-label {
  6803. color: #403840
  6804. }
  6805. .base-form .form-submit__loader {
  6806. width: 25px;
  6807. display: inline-block
  6808. }
  6809. @font-face {
  6810. font-family: NoirStd-Regular;
  6811. src: url(https://assets.beautyboutique.ca/bb-prod-marketing-image/site-fonts/NoirStd/NoirStd-Regular.woff) format("woff");
  6812. font-display: swap
  6813. }
  6814. .lds__radio-button-atom {
  6815. box-sizing: border-box;
  6816. width: 1.5rem;
  6817. height: 1.5rem;
  6818. border: 1px solid #000;
  6819. -webkit-appearance: none;
  6820. border-radius: 50%;
  6821. outline: none;
  6822. cursor: pointer
  6823. }
  6824. .lds__radio-button-atom[type=radio] {
  6825. padding: .125rem
  6826. }
  6827. .lds__radio-button-atom.lds__radio-button-atom:checked {
  6828. border: 1px solid #000
  6829. }
  6830. .lds__radio-button-atom.lds__radio-button-atom:checked.lds__radio-button-atom--error {
  6831. border-color: #bb192c
  6832. }
  6833. .lds__radio-button-atom.lds__radio-button-atom:checked:before {
  6834. background-color: #000
  6835. }
  6836. .lds__radio-button-atom.lds__radio-button-atom--error {
  6837. border-color: #bb192c;
  6838. background-color: #ffebea
  6839. }
  6840. .lds__radio-button-atom:disabled {
  6841. border-color: rgba(71, 71, 71, .8);
  6842. border-style: solid;
  6843. background-color: rgba(71, 71, 71, .2)
  6844. }
  6845. .lds__radio-button-atom:before {
  6846. content: "";
  6847. display: flex;
  6848. width: 100%;
  6849. height: 100%;
  6850. border-radius: 50%
  6851. }
  6852. .lds__radio-button-atom:focus {
  6853. box-shadow: 0 0 0 3px #5e9ed6
  6854. }
  6855. .lds__radio-button-atom:disabled {
  6856. cursor: auto
  6857. }
  6858. .lds__label {
  6859. box-sizing: border-box;
  6860. cursor: pointer;
  6861. display: inline-block
  6862. }
  6863. .lds__radio-button {
  6864. box-sizing: border-box;
  6865. display: flex;
  6866. justify-content: flex-start;
  6867. align-items: flex-start
  6868. }
  6869. .lds__radio-button input[type=radio].lds__radio-button-atom {
  6870. margin: 0 .5rem 0 0
  6871. }
  6872. .lds__radio-button .lds__label.disabled {
  6873. cursor: default
  6874. }
  6875. .lds__radio-group {
  6876. box-sizing: border-box
  6877. }
  6878. .lds__radio-group .lds__radio-button {
  6879. width: 100%;
  6880. padding: .25rem;
  6881. margin: .25rem
  6882. }
  6883. .lds__radio-group .lds__radio-button:last-of-type {
  6884. border-bottom: none
  6885. }
  6886. .lds__radio-group .lds__radio-group__radio-container {
  6887. display: flex;
  6888. align-items: flex-start;
  6889. justify-content: space-around
  6890. }
  6891. .expandable-form-wrapper .lds__radio-group__radio-container {
  6892. margin-bottom: 16px
  6893. }
  6894. .expandable-form-wrapper .lds__radio-button {
  6895. padding: 0;
  6896. margin: 0
  6897. }
  6898. .expandable-form-wrapper .lds__radio-button-atom[type=radio] {
  6899. border-radius: 50%;
  6900. border: 2px solid #6b6272;
  6901. padding: .1rem;
  6902. width: auto;
  6903. width: 1.25rem;
  6904. height: 1.25rem
  6905. }
  6906. .expandable-form-wrapper .lds__radio-button-atom[type=radio]:checked {
  6907. border: 2px solid #f86457;
  6908. box-shadow: none
  6909. }
  6910. .expandable-form-wrapper .lds__radio-button-atom.lds__radio-button-atom:checked:before {
  6911. background-color: #f86457
  6912. }
  6913. .expandable-form-wrapper .billing-info__summary {
  6914. margin: 0 0 0 30px
  6915. }
  6916. .expandable-form-wrapper .billing-info__summary:first-of-type {
  6917. font-weight: 700
  6918. }
  6919. .expandable-form-wrapper .billing-info__summary:nth-child(2n) {
  6920. margin-bottom: 4px
  6921. }
  6922. .shopping-list-form {
  6923. width: 100%;
  6924. margin: 0 auto
  6925. }
  6926. .shopping-list-form__input-wrapper {
  6927. position: relative;
  6928. width: 95%;
  6929. margin: 0 auto
  6930. }
  6931. .shopping-list-form input {
  6932. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  6933. font-size: .9375rem;
  6934. line-height: 1.25rem;
  6935. color: #403840;
  6936. flex: 1;
  6937. border-radius: 2px;
  6938. color: #655c6c;
  6939. padding: 8px 12px 8px 50px;
  6940. background-color: #fff
  6941. }
  6942. @media(min-width:48em) {
  6943. .shopping-list-form input {
  6944. font-size: 1rem;
  6945. line-height: 1.375rem
  6946. }
  6947. }
  6948. .shopping-list-form input:focus {
  6949. border: none
  6950. }
  6951. .shopping-list-form__input--list-size .flyers-header__input,
  6952. .shopping-list-form__input--list-size .homepage-stores__input,
  6953. .shopping-list-form__input--list-size .search-box__input,
  6954. .shopping-list-form__input--list-size .text-group__input,
  6955. .shopping-list-form__input--list-size .text-group__input-container {
  6956. display: none
  6957. }
  6958. .shopping-list-form .text-group__input--error:active,
  6959. .shopping-list-form .text-group__input--error:focus {
  6960. border-color: #bb2620
  6961. }
  6962. .shopping-list-form .list-size-error {
  6963. margin: 0 auto 24px;
  6964. padding: 24px;
  6965. border-radius: 8px;
  6966. background-color: #feeeeb;
  6967. border: 1px solid #c42d0c;
  6968. width: 95%
  6969. }
  6970. .shopping-list-form__add-button {
  6971. margin: 4px 4px 0;
  6972. position: absolute;
  6973. display: inline-block;
  6974. background-color: transparent;
  6975. border: 1px solid transparent;
  6976. border-radius: 50%;
  6977. padding: 4px;
  6978. z-index: 1;
  6979. cursor: pointer
  6980. }
  6981. .shopping-list-form .add-button-icon {
  6982. transform: translate(1px) rotate(45deg);
  6983. fill: #157a77;
  6984. width: 24px;
  6985. height: 24px;
  6986. border: none;
  6987. padding: 0;
  6988. background-color: transparent
  6989. }
  6990. .shopping-list-generic-item-form .text-group--block {
  6991. margin: 0
  6992. }
  6993. .shopping-list-generic-item-form .flyers-header__input,
  6994. .shopping-list-generic-item-form .homepage-stores__input,
  6995. .shopping-list-generic-item-form .search-box__input,
  6996. .shopping-list-generic-item-form .text-group__input {
  6997. background-color: transparent;
  6998. border: 2px solid #9e93a6;
  6999. padding: 6px 18px
  7000. }
  7001. .shopping-list-generic-item-form .invitation-form__error-message,
  7002. .shopping-list-generic-item-form .text-group__error,
  7003. .shopping-list-generic-item-form .toggleable-container .account-setting__error,
  7004. .toggleable-container .shopping-list-generic-item-form .account-setting__error {
  7005. word-break: break-word
  7006. }
  7007. .not-found {
  7008. flex-grow: 1;
  7009. background-position: 50%;
  7010. background-size: cover;
  7011. display: flex
  7012. }
  7013. .not-found__inner {
  7014. display: flex;
  7015. flex-flow: column wrap;
  7016. justify-content: center;
  7017. min-height: 420px;
  7018. text-align: center;
  7019. height: 100%
  7020. }
  7021. @media(min-width:48em) {
  7022. .not-found__inner {
  7023. min-height: 710px
  7024. }
  7025. }
  7026. .not-found__title {
  7027. margin-top: 0;
  7028. margin-bottom: 10px
  7029. }
  7030. .not-found__subtitle,
  7031. .not-found__title {
  7032. color: #fff;
  7033. text-shadow: 0 5px 10px rgba(0, 0, 0, .4)
  7034. }
  7035. .not-found__subtitle {
  7036. margin: 0
  7037. }
  7038. .not-found__home-link {
  7039. display: inline-block;
  7040. margin-top: 26px
  7041. }
  7042. @media(min-width:48em) {
  7043. .not-found__home-link {
  7044. width: 240px;
  7045. margin: 46px auto 0
  7046. }
  7047. }
  7048. .not-found--somethingWrong {
  7049. background-image: url(/static/images/404/blush.jpg)
  7050. }
  7051. .not-found--notYou {
  7052. background-image: url(/static/images/404/donut.jpg)
  7053. }
  7054. .link--theme-helios-primary {
  7055. font-weight: 600;
  7056. font-size: 16px;
  7057. min-width: 143px;
  7058. padding: 12px 50px;
  7059. border-radius: 32px;
  7060. background: #157a77;
  7061. border-color: #157a77;
  7062. color: #fff;
  7063. fill: #fff
  7064. }
  7065. .link--theme-helios-primary:hover {
  7066. border-color: #006665;
  7067. background: #006665
  7068. }
  7069. .link--theme-helios-primary:focus {
  7070. border-color: #157a77;
  7071. background: #157a77
  7072. }
  7073. .link--theme-helios-primary:active {
  7074. border-color: #004e4c;
  7075. background: #004e4c
  7076. }
  7077. .link--theme-helios-primary:disabled {
  7078. cursor: not-allowed
  7079. }
  7080. .link--theme-helios-primary--small {
  7081. padding: 9px 24px;
  7082. min-width: 90px
  7083. }
  7084. .link--theme-helios-secondary {
  7085. font-weight: 600;
  7086. font-size: 16px;
  7087. min-width: 143px;
  7088. padding: 12px 50px;
  7089. border-radius: 32px;
  7090. background: #fff;
  7091. border-color: #157a77;
  7092. color: #157a77;
  7093. fill: #157a77
  7094. }
  7095. .link--theme-helios-secondary:hover {
  7096. border-color: #006665;
  7097. color: #006665;
  7098. fill: #006665
  7099. }
  7100. .link--theme-helios-secondary:focus {
  7101. border-color: #157a77;
  7102. color: #157a77;
  7103. fill: #157a77
  7104. }
  7105. .link--theme-helios-secondary:active {
  7106. border-color: #004e4c;
  7107. color: #004e4c;
  7108. fill: #004e4c
  7109. }
  7110. .link--theme-helios-secondary:disabled {
  7111. cursor: not-allowed
  7112. }
  7113. .link--theme-helios-secondary--small {
  7114. padding: 9px 24px;
  7115. min-width: 90px
  7116. }
  7117. .link--theme-helios-flat {
  7118. font-weight: 600;
  7119. font-size: 16px;
  7120. min-width: 143px;
  7121. padding: 12px 50px;
  7122. border-radius: 32px;
  7123. background: #f3f3f3;
  7124. border-color: #f3f3f3;
  7125. color: #191919;
  7126. fill: #191919
  7127. }
  7128. .link--theme-helios-flat:hover {
  7129. border-color: #e1e1e1;
  7130. background: #e1e1e1;
  7131. color: #191919;
  7132. fill: #191919
  7133. }
  7134. .link--theme-helios-flat:focus {
  7135. border-color: #f3f3f3;
  7136. background: #f3f3f3;
  7137. color: #191919;
  7138. fill: #191919
  7139. }
  7140. .link--theme-helios-flat:active {
  7141. border-color: #c9c9c9;
  7142. background: #c9c9c9;
  7143. color: #191919;
  7144. fill: #191919
  7145. }
  7146. .link--theme-helios-flat:disabled {
  7147. cursor: not-allowed
  7148. }
  7149. .link--theme-helios-flat--small {
  7150. padding: 9px 24px;
  7151. min-width: 90px
  7152. }
  7153. .flow-faq--new-design-system .flow-faq__link,
  7154. .link--theme-link-primary,
  7155. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__cancel a {
  7156. color: #157a77
  7157. }
  7158. .flow-faq--new-design-system .flow-faq__link:hover,
  7159. .link--theme-link-primary:hover,
  7160. .pco-login-form .flow-form-submit__isNewDesignSystem .flow-form-submit__cancel a:hover {
  7161. color: #615395
  7162. }
  7163. .link--theme-helios-tertiary {
  7164. color: #157a77
  7165. }
  7166. .link--theme-helios-tertiary:hover {
  7167. color: #006665
  7168. }
  7169. .link--theme-helios-tertiary:active {
  7170. color: #004e4c
  7171. }
  7172. .link .sprite {
  7173. pointer-events: none
  7174. }
  7175. .locale-toggle {
  7176. cursor: default;
  7177. display: flex
  7178. }
  7179. .locale-toggle__link--clickable {
  7180. background: none;
  7181. border: none;
  7182. padding: 0;
  7183. color: #da291c;
  7184. font-weight: 400
  7185. }
  7186. .locale-toggle__link--clickable:hover {
  7187. font-weight: 400
  7188. }
  7189. .locale-toggle__bullet {
  7190. padding: 0 8px
  7191. }
  7192. .donate-banner__fake-cta,
  7193. .new-window-link,
  7194. .tile-item__fake-cta,
  7195. .video-tile__fake-cta {
  7196. display: inline-block
  7197. }
  7198. .new-window-link__icon {
  7199. width: 12px;
  7200. margin: 0 2px -7px 8px;
  7201. fill: currentColor
  7202. }
  7203. .toggleable-container {
  7204. display: flex;
  7205. align-items: flex-start;
  7206. flex-flow: row nowrap;
  7207. background-color: #fff;
  7208. margin-bottom: 10px
  7209. }
  7210. .toggleable-container .flyers-header__input,
  7211. .toggleable-container .homepage-stores__input,
  7212. .toggleable-container .search-box__input,
  7213. .toggleable-container .text-group__input {
  7214. height: 52px;
  7215. padding-top: 8px;
  7216. padding-bottom: 8px
  7217. }
  7218. .toggleable-container__toggle-button {
  7219. width: 48px;
  7220. height: 48px;
  7221. flex-shrink: 0;
  7222. z-index: 1;
  7223. order: 2;
  7224. margin-left: auto
  7225. }
  7226. .toggleable-container__toggle-button .sprite {
  7227. margin: auto;
  7228. fill: #585858
  7229. }
  7230. .toggleable-container__toggle-button:hover .sprite {
  7231. fill: #191919
  7232. }
  7233. @media(max-width:47.99em) {
  7234. .toggleable-container--toggled .toggleable-container__toggle-button {
  7235. display: none
  7236. }
  7237. }
  7238. .toggleable-drawer {
  7239. position: relative;
  7240. background: #f0f0f0;
  7241. text-align: center
  7242. }
  7243. .toggleable-drawer__close-button {
  7244. position: absolute;
  7245. right: 12px;
  7246. top: 12px;
  7247. font-size: 1.2rem;
  7248. padding: 0;
  7249. background: none;
  7250. border: none;
  7251. cursor: pointer;
  7252. color: #585858
  7253. }
  7254. @media(max-width:47.99em) {
  7255. .toggleable-drawer__close-button {
  7256. display: none
  7257. }
  7258. }
  7259. .toggleable-drawer__close-button .sprite {
  7260. width: 20px;
  7261. height: 20px
  7262. }
  7263. .toggleable-drawer__expand-button {
  7264. background: none;
  7265. border: none;
  7266. width: 100%;
  7267. padding: 8px 16px;
  7268. min-height: 50px;
  7269. transition: none
  7270. }
  7271. .toggleable-drawer--expanded {
  7272. padding: 24px
  7273. }
  7274. @media(min-width:48em) {
  7275. .toggleable-drawer--expanded {
  7276. padding: 50px
  7277. }
  7278. }
  7279. .toggleable-drawer--closed .toggleable-drawer-content {
  7280. color: #ee3124;
  7281. transition: color .1s
  7282. }
  7283. .toggleable-drawer--closed .toggleable-drawer-content__icon {
  7284. fill: #ee3124
  7285. }
  7286. .toggleable-drawer--closed:hover .toggleable-drawer-content {
  7287. color: #982822
  7288. }
  7289. .toggleable-drawer--closed:hover .toggleable-drawer-content__icon {
  7290. fill: #982822
  7291. }
  7292. .toggleable-drawer-content>:first-child {
  7293. margin-top: 0
  7294. }
  7295. .toggleable-drawer-content>:last-child {
  7296. margin-bottom: 0
  7297. }
  7298. .toggleable-drawer-content__title {
  7299. padding: 0 10px
  7300. }
  7301. .toggleable-drawer-content__subtitle {
  7302. text-transform: none;
  7303. padding: 0 10px
  7304. }
  7305. @media(min-width:48em) {
  7306. .toggleable-drawer-content__subtitle {
  7307. margin: 0 0 30px
  7308. }
  7309. }
  7310. .toggleable-drawer-content__icon {
  7311. width: 22px;
  7312. height: 22px;
  7313. vertical-align: middle;
  7314. margin-right: 8px
  7315. }
  7316. .progress-bar {
  7317. display: flex;
  7318. flex-flow: row nowrap;
  7319. justify-content: space-between;
  7320. align-items: baseline;
  7321. width: 100%
  7322. }
  7323. .progress-bar__parent {
  7324. flex-grow: 1;
  7325. height: 10px;
  7326. background-color: #efeef1;
  7327. overflow: hidden
  7328. }
  7329. .progress-bar__parent:not(:first-child) {
  7330. margin-left: 4px
  7331. }
  7332. @media(min-width:48em) {
  7333. .progress-bar__parent:not(:first-child) {
  7334. margin-left: 8px
  7335. }
  7336. }
  7337. .progress-bar__value {
  7338. height: 10px;
  7339. flex-grow: 1;
  7340. background-color: #007a7c
  7341. }
  7342. .progress-bar__ratio {
  7343. margin-left: 10px
  7344. }
  7345. @media(min-width:48em) {
  7346. .progress-bar__ratio {
  7347. margin-left: 24px
  7348. }
  7349. }
  7350. .progress-bar__current-value {
  7351. font-weight: 700;
  7352. color: #191919
  7353. }
  7354. .progress-bar--continuous .progress-bar__parent {
  7355. border-radius: 5px
  7356. }
  7357. .slider-holder-div {
  7358. display: flex;
  7359. flex-direction: column;
  7360. width: 100%;
  7361. justify-content: flex-start
  7362. }
  7363. .scroll-slider-shared {
  7364. overflow-x: visible;
  7365. display: flex;
  7366. flex-direction: row;
  7367. justify-content: center;
  7368. position: relative;
  7369. margin: 0 auto 25px
  7370. }
  7371. @media(min-width:48em) {
  7372. .scroll-slider-shared {
  7373. margin: 0 auto 100px;
  7374. flex-direction: row
  7375. }
  7376. }
  7377. .scroll-slider-shared:after,
  7378. .scroll-slider-shared:before {
  7379. position: absolute;
  7380. width: 20px;
  7381. height: 100%;
  7382. top: -7px;
  7383. content: " ";
  7384. z-index: 1;
  7385. visibility: hidden;
  7386. opacity: 0
  7387. }
  7388. @media(min-width:48em) {
  7389. .scroll-slider-shared:after,
  7390. .scroll-slider-shared:before {
  7391. top: -12px
  7392. }
  7393. }
  7394. .scroll-slider-shared:after {
  7395. right: 0
  7396. }
  7397. .scroll-slider-shared:before {
  7398. left: 0
  7399. }
  7400. .scroll-slider-shared-list--scroll {
  7401. scroll-behavior: smooth;
  7402. position: relative;
  7403. margin: 0;
  7404. overflow-x: auto;
  7405. overflow-y: hidden;
  7406. display: flex;
  7407. flex-direction: row;
  7408. cursor: grab;
  7409. justify-content: flex-start;
  7410. -webkit-overflow-scrolling: touch;
  7411. overflow: -moz-scrollbars-none;
  7412. z-index: 1
  7413. }
  7414. .scroll-slider-shared-list--scroll::-webkit-scrollbar {
  7415. height: 7px;
  7416. display: none
  7417. }
  7418. .scroll-slider-shared-list--scroll::-webkit-scrollbar-thumb {
  7419. border-radius: 12px;
  7420. background: #666b73
  7421. }
  7422. .scroll-slider-shared-list--scroll::-webkit-scrollbar-track {
  7423. border-radius: 12px;
  7424. background: #e0e1e3;
  7425. margin-right: 20px
  7426. }
  7427. @media(min-width:48em) {
  7428. .scroll-slider-shared-list--scroll::-webkit-scrollbar-track {
  7429. margin-left: 20px;
  7430. margin-right: 40px
  7431. }
  7432. }
  7433. .scroll-slider-shared-list--scroll.scroll-slider-shared-list--block-tile-list {
  7434. padding: 0 20px
  7435. }
  7436. .scroll-slider-shared-list--scroll.scroll-slider-shared-list--block-tile-list .element-tile {
  7437. display: block;
  7438. width: 130px;
  7439. margin-bottom: 0
  7440. }
  7441. .scroll-slider-shared-list--scroll.scroll-slider-shared-list--block-tile-list::-webkit-scrollbar-track {
  7442. background: #cacbcd;
  7443. margin: 0 20px
  7444. }
  7445. .scroll-slider-shared-list__item {
  7446. scroll-snap-align: none;
  7447. list-style: none
  7448. }
  7449. .scroll-slider-shared-list__item--scroll.scroll-slider-shared-list__item--block-tile-list {
  7450. margin-right: 20px
  7451. }
  7452. .scroll-slider-shared-list__item--scroll.scroll-slider-shared-list__item--block-tile-list:last-child {
  7453. margin-right: 0;
  7454. padding-right: 20px
  7455. }
  7456. .scroll-slider-shared-list__item:focus {
  7457. outline: 0
  7458. }
  7459. .scroll-slider-shared-list__item-tile {
  7460. position: relative
  7461. }
  7462. .scroll-slider-shared-list__item-tile--fade {
  7463. position: absolute;
  7464. width: 100%;
  7465. height: 100%;
  7466. background: hsla(0, 0%, 91.4%, .5);
  7467. z-index: 2;
  7468. border-radius: 8px
  7469. }
  7470. .scroll-slider-shared-list__button {
  7471. width: 40px;
  7472. height: 40px;
  7473. border-radius: 100%;
  7474. background: #fff;
  7475. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  7476. display: flex;
  7477. justify-content: center;
  7478. align-items: center;
  7479. cursor: pointer;
  7480. border: 2px solid transparent;
  7481. transition: all .1s
  7482. }
  7483. .scroll-slider-shared-list__button:focus:not([disabled]),
  7484. .scroll-slider-shared-list__button:hover:not([disabled]) {
  7485. border-color: #615395;
  7486. background: #f4f1f6;
  7487. fill: #615395
  7488. }
  7489. .scroll-slider-shared-list__button:focus:not([disabled]) .sprite,
  7490. .scroll-slider-shared-list__button:hover:not([disabled]) .sprite {
  7491. fill: #615395
  7492. }
  7493. .scroll-slider-shared-list__button:active:not([disabled]) {
  7494. background: #403840;
  7495. border-color: #403840
  7496. }
  7497. .scroll-slider-shared-list__button:active:not([disabled]) .sprite {
  7498. fill: #fff
  7499. }
  7500. .scroll-slider-shared-list__button-container {
  7501. position: unset;
  7502. z-index: unset;
  7503. display: flex
  7504. }
  7505. .scroll-slider-shared-list__button-left {
  7506. margin-right: 8px
  7507. }
  7508. .scroll-slider-shared-list__button-left .sprite {
  7509. margin-right: 2px
  7510. }
  7511. .scroll-slider-shared-list__button-right .sprite {
  7512. margin-left: 2px;
  7513. transform: rotate(180deg)
  7514. }
  7515. .scroll-slider-shared-list__button[disabled] {
  7516. cursor: default
  7517. }
  7518. .scroll-slider-shared-list__button[disabled] .sprite {
  7519. fill: #9e93a6
  7520. }
  7521. .scroll-slider-shared-list__button .sprite {
  7522. width: 10px;
  7523. fill: #157a77
  7524. }
  7525. .scroll-slider-shared--pan-active {
  7526. cursor: grabbing
  7527. }
  7528. .scroll-slider-shared--pan-drag .scroll-slider-shared-list__item-tile {
  7529. pointer-events: none
  7530. }
  7531. .scroll-slider-shared--scroll.scroll-slider-shared--block-tile-list {
  7532. margin-right: -20px;
  7533. margin-left: -20px
  7534. }
  7535. @media(min-width:48em) {
  7536. .scroll-slider-shared--scroll.scroll-slider-shared--block-tile-list {
  7537. margin-right: -40px;
  7538. margin-left: -40px
  7539. }
  7540. }
  7541. .scroll-slider-shared--scroll.scroll-slider-shared--block-tile-list:after,
  7542. .scroll-slider-shared--scroll.scroll-slider-shared--block-tile-list:before {
  7543. display: none
  7544. }
  7545. .sprite:only-child {
  7546. display: block
  7547. }
  7548. .sprite__symbol {
  7549. width: 54%;
  7550. height: 54%
  7551. }
  7552. .sprite--has-background {
  7553. display: flex;
  7554. align-items: center;
  7555. justify-content: center;
  7556. border-radius: 50%;
  7557. width: 80px;
  7558. height: 80px
  7559. }
  7560. @media(min-width:48em) {
  7561. .sprite--has-background {
  7562. width: 100px;
  7563. height: 100px
  7564. }
  7565. }
  7566. .sprite--background-red {
  7567. background-color: #ee3124
  7568. }
  7569. .sprite--background-pink {
  7570. background-color: #fbd2d3
  7571. }
  7572. .sprite--background-white {
  7573. background: #fff
  7574. }
  7575. .tab-bar {
  7576. overflow: hidden;
  7577. max-height: 55px;
  7578. background-color: #fff
  7579. }
  7580. .tab-bar__inner {
  7581. display: flex;
  7582. flex-flow: row nowrap;
  7583. align-items: stretch;
  7584. justify-content: space-between;
  7585. max-width: 560px;
  7586. padding-left: 20px;
  7587. padding-right: 20px;
  7588. margin: 0 auto;
  7589. list-style-type: none;
  7590. overflow: auto;
  7591. white-space: nowrap
  7592. }
  7593. @media(min-width:48em) {
  7594. .tab-bar__inner {
  7595. padding-left: 40px;
  7596. padding-right: 40px
  7597. }
  7598. }
  7599. .tab-bar__item {
  7600. margin: 0 6px
  7601. }
  7602. .tab-bar__item:first-child {
  7603. margin-left: 0
  7604. }
  7605. .tab-bar__item:last-child {
  7606. margin-right: 0
  7607. }
  7608. .tab-bar__button,
  7609. .tab-bar__link {
  7610. position: relative;
  7611. width: 100%;
  7612. height: 55px;
  7613. padding: 0 4px;
  7614. outline-offset: -2px;
  7615. color: #655c6c;
  7616. text-decoration: none
  7617. }
  7618. @media(max-width:34.375em) {
  7619. .tab-bar__button,
  7620. .tab-bar__link {
  7621. font-size: .9375rem
  7622. }
  7623. }
  7624. .tab-bar__button:hover,
  7625. .tab-bar__link:hover {
  7626. color: #982822
  7627. }
  7628. .tab-bar__button:after,
  7629. .tab-bar__link:after {
  7630. content: "";
  7631. position: absolute;
  7632. left: 0;
  7633. right: 0;
  7634. bottom: 0;
  7635. height: 0;
  7636. background-color: #ee3124
  7637. }
  7638. .tab-bar__button--active,
  7639. .tab-bar__link--active {
  7640. color: #191919
  7641. }
  7642. .tab-bar__button--active:after,
  7643. .tab-bar__link--active:after {
  7644. height: 6px
  7645. }
  7646. .tab-bar__link {
  7647. display: flex;
  7648. align-items: center;
  7649. justify-content: center
  7650. }
  7651. .tab-bar--overflows .tab-bar__item:last-child {
  7652. padding-right: 20px;
  7653. margin-right: -20px
  7654. }
  7655. @media(min-width:48em) {
  7656. .tab-bar--overflows .tab-bar__item:last-child {
  7657. padding-right: 40px;
  7658. margin-right: -40px
  7659. }
  7660. }
  7661. .pco-modal-container {
  7662. z-index: 999;
  7663. position: fixed;
  7664. top: 0;
  7665. left: 0;
  7666. width: 100vw;
  7667. height: 100vh;
  7668. display: flex;
  7669. justify-content: center;
  7670. align-items: center;
  7671. background-color: rgba(6, 17, 22, .65)
  7672. }
  7673. .pco-modal-container .pco-modal-content__back,
  7674. .pco-modal-container .pco-modal-content__close {
  7675. position: absolute;
  7676. top: 17px;
  7677. border-radius: 100%;
  7678. background: #fff;
  7679. padding: 6px;
  7680. border: 2px solid #fff
  7681. }
  7682. .pco-modal-container .pco-modal-content__back:focus,
  7683. .pco-modal-container .pco-modal-content__back:focus-within,
  7684. .pco-modal-container .pco-modal-content__back:hover,
  7685. .pco-modal-container .pco-modal-content__close:focus,
  7686. .pco-modal-container .pco-modal-content__close:focus-within,
  7687. .pco-modal-container .pco-modal-content__close:hover {
  7688. outline: none;
  7689. padding: 6px;
  7690. border: 2px solid #615395
  7691. }
  7692. .pco-modal-container .pco-modal-content__back:focus-within svg,
  7693. .pco-modal-container .pco-modal-content__back:focus svg,
  7694. .pco-modal-container .pco-modal-content__back:hover svg,
  7695. .pco-modal-container .pco-modal-content__close:focus-within svg,
  7696. .pco-modal-container .pco-modal-content__close:focus svg,
  7697. .pco-modal-container .pco-modal-content__close:hover svg {
  7698. fill: #615395;
  7699. stroke: #615395
  7700. }
  7701. .pco-modal-container .pco-modal-content__back:active,
  7702. .pco-modal-container .pco-modal-content__close:active {
  7703. background: #403840;
  7704. border: 2px solid #403840
  7705. }
  7706. .pco-modal-container .pco-modal-content__back:active svg,
  7707. .pco-modal-container .pco-modal-content__close:active svg {
  7708. fill: #fff;
  7709. stroke: #fff
  7710. }
  7711. .pco-modal-container .pco-modal-content__back svg,
  7712. .pco-modal-container .pco-modal-content__close svg {
  7713. width: 18px;
  7714. height: auto;
  7715. fill: #655c6c;
  7716. stroke: #655c6c;
  7717. stroke-width: 2px
  7718. }
  7719. .pco-modal-container .pco-modal-content__close {
  7720. right: 17px
  7721. }
  7722. .pco-modal-container .pco-modal-content__back {
  7723. left: 17px
  7724. }
  7725. .interaction-modal-content {
  7726. max-width: 400px;
  7727. position: relative;
  7728. border-radius: 16px;
  7729. background-color: #fff;
  7730. margin: 0 20px;
  7731. overflow: hidden
  7732. }
  7733. .interaction-modal-content__inner {
  7734. padding: 20px 24px 34px;
  7735. height: 62%
  7736. }
  7737. @media(max-height:672px) {
  7738. .interaction-modal-content__inner-text {
  7739. height: 65%
  7740. }
  7741. }
  7742. .interaction-modal-content p {
  7743. margin-bottom: 30px
  7744. }
  7745. .interaction-modal-content__cta-button--secondary {
  7746. margin-top: 24px
  7747. }
  7748. .interaction-modal-content__link-text {
  7749. display: block;
  7750. margin-top: 18px
  7751. }
  7752. .ada-chatbot-button {
  7753. display: none
  7754. }
  7755. @media(min-width:64em) {
  7756. .ada-chatbot-button {
  7757. width: 48px;
  7758. height: 48px;
  7759. min-width: 48px;
  7760. border-radius: 50%;
  7761. border: 0;
  7762. padding: 0;
  7763. background-color: #157a77;
  7764. display: flex;
  7765. justify-content: center;
  7766. align-items: center;
  7767. z-index: 4
  7768. }
  7769. }
  7770. .ada-chatbot-button:focus,
  7771. .ada-chatbot-button:hover {
  7772. background-color: #615395
  7773. }
  7774. .ada-chatbot-button__icon {
  7775. width: 32px;
  7776. height: 27px
  7777. }
  7778. .medallia-form-button {
  7779. margin: 10px 0 10px 16px;
  7780. white-space: nowrap;
  7781. text-decoration: none
  7782. }
  7783. .medallia-form-button span {
  7784. color: inherit
  7785. }
  7786. .household-instruction {
  7787. width: 100%
  7788. }
  7789. .household-instruction__section {
  7790. display: flex;
  7791. align-items: center;
  7792. flex-flow: column wrap
  7793. }
  7794. .household-instruction__title {
  7795. width: 100%;
  7796. margin: 0 0 8px
  7797. }
  7798. @media(min-width:34.375em) {
  7799. .household-instruction__title {
  7800. font-size: .875rem
  7801. }
  7802. }
  7803. .household-instruction__text {
  7804. width: 100%;
  7805. margin: 0
  7806. }
  7807. @media(min-width:34.375em)and (max-width:63.99em) {
  7808. .household-instruction__text {
  7809. font-size: 1.625rem
  7810. }
  7811. }
  7812. .household-empty {
  7813. display: flex;
  7814. flex-wrap: wrap
  7815. }
  7816. .household-empty__image {
  7817. flex: 1 0 auto;
  7818. width: 100%;
  7819. background-size: cover;
  7820. background-position: 50%;
  7821. height: 80vw;
  7822. min-height: 300px
  7823. }
  7824. @media(min-width:48em) {
  7825. .household-empty__image {
  7826. height: 50vw;
  7827. height: auto;
  7828. width: 50%
  7829. }
  7830. }
  7831. .household-empty__image--first {
  7832. background-image: url(/static/images/household/household-tile-1.jpg);
  7833. order: 2
  7834. }
  7835. @media(min-width:48em) {
  7836. .household-empty__image--first {
  7837. order: 1
  7838. }
  7839. }
  7840. .household-empty__image--second {
  7841. background-image: url(/static/images/household/household-tile-2.jpg);
  7842. order: 4
  7843. }
  7844. .household-empty__image--third {
  7845. background-image: url(/static/images/household/household-tile-3.jpg);
  7846. order: 6
  7847. }
  7848. @media(min-width:48em) {
  7849. .household-empty__image--third {
  7850. order: 5
  7851. }
  7852. }
  7853. .household-empty__text-group {
  7854. flex: 1 0 auto;
  7855. display: flex;
  7856. align-items: center;
  7857. width: 50%;
  7858. text-align: center;
  7859. height: 80vw;
  7860. max-height: 600px;
  7861. min-height: 300px;
  7862. padding: 0 18%
  7863. }
  7864. @media(min-width:34.375em) {
  7865. .household-empty__text-group {
  7866. padding: 0 18%
  7867. }
  7868. }
  7869. @media(min-width:48em) {
  7870. .household-empty__text-group {
  7871. height: 50vw;
  7872. padding: 0 10%
  7873. }
  7874. }
  7875. .household-empty__text-group--first {
  7876. background-color: #feece8;
  7877. order: 1
  7878. }
  7879. @media(min-width:48em) {
  7880. .household-empty__text-group--first {
  7881. order: 2
  7882. }
  7883. }
  7884. .household-empty__text-group--second {
  7885. background-color: #f47f72;
  7886. order: 3
  7887. }
  7888. .household-empty__text-group--third {
  7889. -webkit-font-smoothing: antialiased;
  7890. background-color: #982822;
  7891. order: 5
  7892. }
  7893. @media(min-width:48em) {
  7894. .household-empty__text-group--third {
  7895. order: 6
  7896. }
  7897. }
  7898. .household-empty__text-group--third * {
  7899. color: #fff
  7900. }
  7901. .household-empty__footer {
  7902. flex: 1 0 auto;
  7903. width: 100%;
  7904. order: 7;
  7905. display: flex;
  7906. justify-content: center;
  7907. align-items: center;
  7908. text-align: center;
  7909. padding: 20px;
  7910. min-height: 90px
  7911. }
  7912. @media(min-width:48em) {
  7913. .household-empty__footer {
  7914. min-height: 130px
  7915. }
  7916. }
  7917. .household-empty__footer-link {
  7918. display: inline-block
  7919. }
  7920. .household--placeholder .utility-content,
  7921. .household-container .utility-content {
  7922. margin: 0 auto
  7923. }
  7924. .household-link-account {
  7925. background-image: url(/static/images/household/household-hero-mobile.jpg);
  7926. background-size: cover;
  7927. background-position: top
  7928. }
  7929. @media(min-width:48em) {
  7930. .household-link-account {
  7931. background-image: url(/static/images/household/household-hero-desktop.jpg)
  7932. }
  7933. }
  7934. .household-link-account__inner {
  7935. display: flex;
  7936. justify-content: center
  7937. }
  7938. .household-link-account__card {
  7939. margin-top: 60px;
  7940. margin-bottom: 60px;
  7941. max-width: 440px;
  7942. background-color: #fff;
  7943. padding: 30px;
  7944. text-align: center
  7945. }
  7946. @media(min-width:48em) {
  7947. .household-link-account__card {
  7948. margin-top: 120px;
  7949. margin-bottom: 120px;
  7950. padding: 50px 40px 60px
  7951. }
  7952. }
  7953. .household-link-account__house-icon {
  7954. width: 80px;
  7955. height: 80px;
  7956. margin-right: auto;
  7957. margin-left: auto;
  7958. margin-bottom: 30px
  7959. }
  7960. @media(min-width:48em) {
  7961. .household-link-account__house-icon {
  7962. width: 100px;
  7963. height: 100px
  7964. }
  7965. }
  7966. @media(max-width:47.99em) {
  7967. .household-link-account__title {
  7968. font-size: .9375rem
  7969. }
  7970. }
  7971. .household-link-account__text {
  7972. margin-bottom: 0
  7973. }
  7974. .household-link-account__start-button {
  7975. display: inline-block;
  7976. margin: 20px auto 0
  7977. }
  7978. .household-member {
  7979. display: flex;
  7980. flex-grow: 1;
  7981. padding: 20px 0 20px 20px;
  7982. min-height: 90px;
  7983. position: relative;
  7984. align-items: center
  7985. }
  7986. @media(min-width:48em) {
  7987. .household-member {
  7988. padding: 20px
  7989. }
  7990. }
  7991. .household-member--editable {
  7992. align-items: flex-start;
  7993. padding: 20px
  7994. }
  7995. .household-member__value {
  7996. display: flex;
  7997. align-items: center;
  7998. width: calc(100% - 68px)
  7999. }
  8000. @media(min-width:48em) {
  8001. .household-member__value {
  8002. margin-left: 40px
  8003. }
  8004. }
  8005. .household-member__invitation-sprite,
  8006. .household-member__sprite {
  8007. width: 25px;
  8008. min-width: 25px;
  8009. margin-top: -5px
  8010. }
  8011. @media(min-width:48em) {
  8012. .household-member__invitation-sprite,
  8013. .household-member__sprite {
  8014. width: 30px;
  8015. min-width: 30px
  8016. }
  8017. }
  8018. .household-member__invitation-sprite {
  8019. opacity: .5
  8020. }
  8021. .household-member__inner {
  8022. flex-grow: 1
  8023. }
  8024. @media(min-width:48em) {
  8025. .household-member .flow-form-submit {
  8026. margin-left: 120px
  8027. }
  8028. }
  8029. .household-member .flow-form-submit__content {
  8030. padding-top: 20px;
  8031. margin-top: 20px
  8032. }
  8033. .household-member__details {
  8034. margin-left: 15px
  8035. }
  8036. @media(min-width:48em) {
  8037. .household-member__details {
  8038. display: flex;
  8039. align-items: center
  8040. }
  8041. }
  8042. .household-member__name {
  8043. font-weight: 400;
  8044. word-break: break-all
  8045. }
  8046. @media(min-width:48em) {
  8047. .household-member__name {
  8048. max-width: 400px;
  8049. margin-right: 40px
  8050. }
  8051. }
  8052. .household-member__expiry {
  8053. display: block
  8054. }
  8055. @media(min-width:48em) {
  8056. .household-member__expiry {
  8057. display: inline
  8058. }
  8059. }
  8060. .household-member__copy-link {
  8061. display: block
  8062. }
  8063. .household-member .toggleable-container__toggle-button {
  8064. position: absolute;
  8065. top: 20px;
  8066. right: 10px
  8067. }
  8068. @media(min-width:48em) {
  8069. .household-member .toggleable-container__toggle-button {
  8070. right: 20px
  8071. }
  8072. }
  8073. .copy-invite-link {
  8074. margin-top: 20px
  8075. }
  8076. @media(min-width:48em) {
  8077. .copy-invite-link {
  8078. margin-top: 3px
  8079. }
  8080. }
  8081. .household-grid__invite-button {
  8082. color: #da291c;
  8083. margin-top: 30px
  8084. }
  8085. .household-grid__invite-button--placeholder {
  8086. pointer-events: none
  8087. }
  8088. .point-event__header {
  8089. display: flex;
  8090. flex-flow: row wrap;
  8091. justify-content: space-between;
  8092. align-items: flex-start
  8093. }
  8094. @media(min-width:48em) {
  8095. .point-event__header {
  8096. align-items: center
  8097. }
  8098. .point-event__header--no-action {
  8099. margin-right: 52px
  8100. }
  8101. }
  8102. .point-event__detail-toggle-container {
  8103. order: 2;
  8104. flex-shrink: 0;
  8105. flex-basis: 52px;
  8106. align-self: stretch;
  8107. position: relative
  8108. }
  8109. @media(min-width:48em) {
  8110. .point-event__detail-toggle-container {
  8111. order: 3
  8112. }
  8113. }
  8114. .point-event__detail-toggle {
  8115. display: block;
  8116. width: 100%;
  8117. height: 52px
  8118. }
  8119. .point-event__detail-toggle-sprite {
  8120. position: absolute;
  8121. top: 0;
  8122. right: 0;
  8123. fill: #ee3124;
  8124. transform-origin: 12px 12px;
  8125. transform: rotate(90deg)
  8126. }
  8127. @media(min-width:48em) {
  8128. .point-event__detail-toggle-sprite {
  8129. left: 0;
  8130. bottom: 0;
  8131. margin: auto
  8132. }
  8133. }
  8134. .point-event__summary {
  8135. order: 1;
  8136. flex: 0 0 calc(100% - 52px)
  8137. }
  8138. @media(min-width:48em) {
  8139. .point-event__summary {
  8140. flex: 1 0 auto;
  8141. width: calc(68% - 26px)
  8142. }
  8143. }
  8144. .point-event__point-diff {
  8145. order: 4;
  8146. flex-grow: 1;
  8147. text-align: right
  8148. }
  8149. @media(max-width:47.99em) {
  8150. .point-event__point-diff {
  8151. align-self: baseline
  8152. }
  8153. }
  8154. @media(min-width:48em) {
  8155. .point-event__point-diff {
  8156. order: 2;
  8157. flex: 2 0 auto;
  8158. width: calc(32% - 26px)
  8159. }
  8160. }
  8161. .point-event__dollar-savings {
  8162. order: 5;
  8163. flex-basis: 100%;
  8164. text-align: right
  8165. }
  8166. @media(min-width:48em) {
  8167. .point-event__dollar-savings {
  8168. flex: 1 0 50%;
  8169. padding-right: 52px;
  8170. font-size: 1rem;
  8171. line-height: 1.75
  8172. }
  8173. }
  8174. .point-event__dollar-total {
  8175. order: 3;
  8176. flex-grow: 1;
  8177. line-height: 2
  8178. }
  8179. @media(max-width:47.99em) {
  8180. .point-event__dollar-total {
  8181. align-self: baseline
  8182. }
  8183. }
  8184. @media(min-width:48em) {
  8185. .point-event__dollar-total {
  8186. order: 4;
  8187. flex-basis: 50%
  8188. }
  8189. }
  8190. .point-event__diff-value--negative {
  8191. color: #585858
  8192. }
  8193. .point-event__pts-label {
  8194. color: #191919;
  8195. font-weight: 700;
  8196. margin-left: 2px
  8197. }
  8198. .point-event__pts-label--negative {
  8199. color: #585858
  8200. }
  8201. .point-event__expanded-content {
  8202. display: none;
  8203. padding-top: 26px;
  8204. margin-top: 26px;
  8205. border-top: 1px solid #ddd
  8206. }
  8207. @media(min-width:48em) {
  8208. .point-event__expanded-content {
  8209. padding-top: 46px;
  8210. margin-top: 46px
  8211. }
  8212. }
  8213. @media(min-width:64em) {
  8214. .point-event__expanded-content {
  8215. margin-top: 0;
  8216. border-top-width: 0
  8217. }
  8218. }
  8219. .point-event__transaction-inquiry {
  8220. text-align: center;
  8221. padding-top: 0;
  8222. margin: 0 auto
  8223. }
  8224. @media(min-width:48em) {
  8225. .point-event__transaction-inquiry {
  8226. width: 320px;
  8227. border-top: 1px solid #ddd;
  8228. padding-top: 20px;
  8229. margin-bottom: 0
  8230. }
  8231. }
  8232. @media(min-width:48em) {
  8233. .point-event__transaction-inquiry-conversion {
  8234. width: 630px
  8235. }
  8236. }
  8237. .point-event--expanded .point-event__expanded-content {
  8238. display: block
  8239. }
  8240. .point-event--expanded .point-event__detail-toggle-sprite {
  8241. transform: rotate(270deg)
  8242. }
  8243. .point-event-category {
  8244. display: flex;
  8245. padding-bottom: 28px
  8246. }
  8247. @media(min-width:48em) {
  8248. .point-event-category {
  8249. padding-bottom: 46px;
  8250. padding-right: 52px
  8251. }
  8252. }
  8253. .point-event-icon {
  8254. display: none;
  8255. text-align: center;
  8256. flex-basis: 13%
  8257. }
  8258. .point-event-icon .sprite {
  8259. width: 32px;
  8260. height: 32px
  8261. }
  8262. @media(min-width:48em) {
  8263. .point-event-icon {
  8264. display: inline-block
  8265. }
  8266. }
  8267. .point-event-category-details {
  8268. width: 100%
  8269. }
  8270. .point-event-category-details__header {
  8271. display: flex;
  8272. justify-content: space-between;
  8273. text-transform: uppercase;
  8274. padding-bottom: 8px
  8275. }
  8276. .point-event-category-details__header-category-name {
  8277. flex-grow: 3;
  8278. flex-basis: 0
  8279. }
  8280. @media(min-width:64em) {
  8281. .point-event-category-details__header-category-name {
  8282. order: 1
  8283. }
  8284. }
  8285. .point-event-category-details__header-points,
  8286. .point-event-category-details__header-savings,
  8287. .point-event-category-details__header-total {
  8288. flex-grow: 1;
  8289. flex-basis: 0;
  8290. text-align: right
  8291. }
  8292. @media(min-width:64em) {
  8293. .point-event-category-details__header-points,
  8294. .point-event-category-details__header-savings,
  8295. .point-event-category-details__header-total {
  8296. order: 3
  8297. }
  8298. }
  8299. .point-event-category-details__list {
  8300. display: flex;
  8301. flex-grow: 1;
  8302. flex-direction: column
  8303. }
  8304. .point-event-category-details__sub-header {
  8305. margin: 8px 0
  8306. }
  8307. .point-event-category-details__credit-card-message {
  8308. margin: 16px 0 24px;
  8309. padding: 16px 0;
  8310. border-top: 1px solid #ddd;
  8311. border-bottom: 1px solid #ddd
  8312. }
  8313. .point-event-offer {
  8314. display: flex;
  8315. margin-bottom: 8px
  8316. }
  8317. .point-event-offer__list-item {
  8318. display: flex;
  8319. justify-content: space-between
  8320. }
  8321. .point-event-offer__icon {
  8322. width: 24px;
  8323. height: 24px;
  8324. padding-right: 32px
  8325. }
  8326. .point-event-offer__icon .sprite {
  8327. width: 24px;
  8328. height: 24px
  8329. }
  8330. @media(min-width:48em) {
  8331. .point-event-offer__icon {
  8332. display: none
  8333. }
  8334. }
  8335. .point-event-offer__detail {
  8336. flex-grow: 3;
  8337. flex-basis: 0
  8338. }
  8339. @media(min-width:64em) {
  8340. .point-event-offer__detail {
  8341. order: 1
  8342. }
  8343. }
  8344. .point-event-offer__pcf-accelerator {
  8345. display: inline-block;
  8346. padding-left: 2em;
  8347. color: #8a8a8a
  8348. }
  8349. .point-event-offer__points {
  8350. flex-grow: 1;
  8351. flex-basis: 0;
  8352. text-align: right
  8353. }
  8354. @media(min-width:64em) {
  8355. .point-event-offer__points {
  8356. order: 3
  8357. }
  8358. }
  8359. .point-event-notification {
  8360. display: flex;
  8361. flex-flow: row nowrap;
  8362. align-items: center;
  8363. background: rgba(29, 166, 143, .3);
  8364. padding: 10px 15px;
  8365. margin-top: 20px
  8366. }
  8367. .point-event-notification__icon {
  8368. flex: 0 0 24px;
  8369. width: 24px;
  8370. height: 24px;
  8371. margin: 0 12px 0 0
  8372. }
  8373. .point-event-notification__message {
  8374. color: #191919
  8375. }
  8376. @media(max-width:47.99em) {
  8377. .point-event-notification__message {
  8378. font-size: .9375rem;
  8379. line-height: 1.4
  8380. }
  8381. }
  8382. .point-event-notification__message-body {
  8383. color: #191919
  8384. }
  8385. .confirm-assign-card .flow-tile__title-text {
  8386. margin-top: 0
  8387. }
  8388. .confirm-assign-card .flow-form-submit__cancel,
  8389. .confirm-assign-card .flow-form-submit__submit {
  8390. display: block;
  8391. margin-left: auto;
  8392. margin-right: auto
  8393. }
  8394. .communication-settings-status {
  8395. position: relative;
  8396. background: #fff;
  8397. padding: 40px 20px;
  8398. margin: 2px 0;
  8399. text-align: center
  8400. }
  8401. .communication-settings-status p {
  8402. margin-top: 0
  8403. }
  8404. @media(min-width:48em) {
  8405. .communication-settings-status {
  8406. padding: 40px
  8407. }
  8408. }
  8409. .pcid-profile-section {
  8410. background: #fff;
  8411. display: flex;
  8412. flex-direction: column;
  8413. justify-content: space-between;
  8414. padding: 20px
  8415. }
  8416. .pcid-profile-section__details {
  8417. flex: 1 1 auto
  8418. }
  8419. .pcid-profile-section__details .account-setting__inner:nth-child(2) {
  8420. margin: 1rem 0
  8421. }
  8422. .pcid-profile-section__details .account-setting__value.password {
  8423. vertical-align: middle
  8424. }
  8425. .pcid-profile-section__actions {
  8426. flex: 0 0 auto;
  8427. display: flex
  8428. }
  8429. .pcid-profile-section__actions .donate-banner__fake-cta,
  8430. .pcid-profile-section__actions .new-window-link,
  8431. .pcid-profile-section__actions .tile-item__fake-cta,
  8432. .pcid-profile-section__actions .video-tile__fake-cta {
  8433. margin-top: 1rem;
  8434. width: 100%;
  8435. display: block;
  8436. text-align: center
  8437. }
  8438. @media(min-width:48em) {
  8439. .pcid-profile-section {
  8440. flex-direction: row;
  8441. padding: 30px 40px
  8442. }
  8443. .pcid-profile-section__actions {
  8444. justify-content: flex-end;
  8445. align-items: center
  8446. }
  8447. .pcid-profile-section__actions .donate-banner__fake-cta,
  8448. .pcid-profile-section__actions .new-window-link,
  8449. .pcid-profile-section__actions .tile-item__fake-cta,
  8450. .pcid-profile-section__actions .video-tile__fake-cta {
  8451. width: auto;
  8452. margin-top: 0
  8453. }
  8454. }
  8455. .subscription-plan {
  8456. z-index: 1;
  8457. background: linear-gradient(#14151f, #2d2e39);
  8458. position: relative;
  8459. color: #fff;
  8460. overflow: hidden
  8461. }
  8462. .no-subscription-plan__header,
  8463. .subscription-plan__header {
  8464. margin-bottom: 32px;
  8465. z-index: 2
  8466. }
  8467. .no-subscription-plan__title,
  8468. .subscription-plan__title {
  8469. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8470. font-weight: 600;
  8471. font-size: 1.375rem;
  8472. line-height: 1.75rem;
  8473. margin: 24px 0 0
  8474. }
  8475. @media(min-width:48em) {
  8476. .no-subscription-plan__title,
  8477. .subscription-plan__title {
  8478. font-size: 2rem;
  8479. line-height: 2.25rem
  8480. }
  8481. }
  8482. .subscription-plan__subscription-status {
  8483. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8484. font-size: .8125rem;
  8485. line-height: 1.125rem;
  8486. color: #fff;
  8487. margin: 8px 0 0
  8488. }
  8489. @media(min-width:48em) {
  8490. .subscription-plan__subscription-status {
  8491. font-size: .875rem;
  8492. line-height: 1.25rem
  8493. }
  8494. }
  8495. @media(min-width:48em)and (min-width:48em) {
  8496. .subscription-plan__subscription-status {
  8497. font-size: 1rem;
  8498. line-height: 1.375rem
  8499. }
  8500. }
  8501. .no-subscription-plan__content h3,
  8502. .subscription-plan__content h3 {
  8503. margin: 8px 0
  8504. }
  8505. .no-subscription-plan__content h3 span,
  8506. .subscription-plan__content h3 span {
  8507. color: #fff
  8508. }
  8509. .no-subscription-plan__content h3 span:after,
  8510. .subscription-plan__content h3 span:after {
  8511. color: transparent
  8512. }
  8513. .subscription-plan--ring {
  8514. z-index: -1;
  8515. width: 165px;
  8516. height: auto;
  8517. position: absolute;
  8518. top: -55px;
  8519. right: -60px;
  8520. transform: rotate(225deg)
  8521. }
  8522. @media(min-width:48em) {
  8523. .subscription-plan--ring {
  8524. width: 310px;
  8525. top: -120px;
  8526. right: -120px
  8527. }
  8528. }
  8529. .subscription-plan__main-item {
  8530. border-bottom: 1px solid #fff;
  8531. margin-bottom: 24px
  8532. }
  8533. .subscription-plan__main-item-title {
  8534. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8535. font-weight: 600;
  8536. font-size: 1.375rem;
  8537. line-height: 1.75rem;
  8538. font-weight: 700
  8539. }
  8540. @media(min-width:48em) {
  8541. .subscription-plan__main-item-title {
  8542. font-size: 2rem;
  8543. line-height: 2.25rem
  8544. }
  8545. }
  8546. .subscription-plan__main-item-text {
  8547. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8548. font-size: .8125rem;
  8549. line-height: 1.125rem;
  8550. margin: 0 0 24px
  8551. }
  8552. @media(min-width:48em) {
  8553. .subscription-plan__main-item-text {
  8554. font-size: .875rem;
  8555. line-height: 1.25rem
  8556. }
  8557. }
  8558. .subscription-plan__item {
  8559. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8560. font-size: .8125rem;
  8561. line-height: 1.125rem;
  8562. display: flex;
  8563. align-items: center;
  8564. margin-bottom: 24px;
  8565. color: #fff
  8566. }
  8567. @media(min-width:48em) {
  8568. .subscription-plan__item {
  8569. font-size: .875rem;
  8570. line-height: 1.25rem
  8571. }
  8572. }
  8573. .subscription-plan__item p {
  8574. margin: 0
  8575. }
  8576. .subscription-plan__item-value {
  8577. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8578. font-weight: 600;
  8579. font-size: 1.375rem;
  8580. line-height: 1.75rem;
  8581. font-weight: 700
  8582. }
  8583. @media(min-width:48em) {
  8584. .subscription-plan__item-value {
  8585. font-size: 2rem;
  8586. line-height: 2.25rem;
  8587. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8588. font-weight: 600;
  8589. font-size: 1.25rem;
  8590. line-height: 1.5rem
  8591. }
  8592. }
  8593. @media(min-width:48em)and (min-width:48em) {
  8594. .subscription-plan__item-value {
  8595. font-size: 1.5rem;
  8596. line-height: 2rem
  8597. }
  8598. }
  8599. .subscription-plan__item-text {
  8600. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8601. font-size: .8125rem;
  8602. line-height: 1.125rem
  8603. }
  8604. @media(min-width:48em) {
  8605. .subscription-plan__item-text {
  8606. font-size: .875rem;
  8607. line-height: 1.25rem
  8608. }
  8609. }
  8610. .subscription-plan__item-badge,
  8611. .subscription-plan__item-badge--loading {
  8612. min-width: 46px;
  8613. height: 46px;
  8614. border-radius: 12px;
  8615. padding: 8px;
  8616. margin-right: 16px;
  8617. background-color: #2d2e39
  8618. }
  8619. @media(min-width:48em) {
  8620. .subscription-plan__item-badge,
  8621. .subscription-plan__item-badge--loading {
  8622. width: 56px;
  8623. height: 56px
  8624. }
  8625. }
  8626. .subscription-plan__item-badge--loading {
  8627. display: flex;
  8628. justify-content: center;
  8629. align-items: center
  8630. }
  8631. .subscription-plan__item-icon--points {
  8632. background: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/pc-optimum-insiders/pcoi_value_props_logo_points.png);
  8633. height: 100%;
  8634. background-size: contain;
  8635. background-position: 50%;
  8636. background-repeat: no-repeat
  8637. }
  8638. .subscription-plan__item-icon--shopping {
  8639. background: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/pc-optimum-insiders/pcoi_value_props_logo_shopping_list.png);
  8640. height: 100%;
  8641. background-size: contain;
  8642. background-position: 50%;
  8643. background-repeat: no-repeat
  8644. }
  8645. .subscription-plan a {
  8646. text-decoration: none
  8647. }
  8648. .subscription-plan--bold-text {
  8649. font-weight: 700
  8650. }
  8651. .subscription-plan .pcoi-subscription-logo {
  8652. max-width: 128px;
  8653. height: 36px
  8654. }
  8655. @media(min-width:48em) {
  8656. .subscription-plan .pcoi-subscription-logo {
  8657. max-width: 142px;
  8658. height: 40px
  8659. }
  8660. }
  8661. .subscription-plan .pcoi-error-tile {
  8662. margin: 24px 0
  8663. }
  8664. .tile__billing-history {
  8665. display: flex;
  8666. flex-direction: column;
  8667. flex: none;
  8668. order: 1;
  8669. flex-grow: 0;
  8670. margin: 24px 0;
  8671. background-color: #fff;
  8672. max-width: 100%
  8673. }
  8674. .billing-history__type {
  8675. margin: 8px 0
  8676. }
  8677. .billing-history__card--number p {
  8678. font-weight: 400;
  8679. margin: 4px 0 0
  8680. }
  8681. .billing-history__amount {
  8682. margin-top: 8px
  8683. }
  8684. .billing-history__amount p {
  8685. font-weight: 400;
  8686. margin: 4px 0 0
  8687. }
  8688. .tile__empty-state-billing-history {
  8689. display: flex;
  8690. flex-direction: column;
  8691. flex: none;
  8692. order: 1;
  8693. flex-grow: 0;
  8694. margin: 24px 0;
  8695. max-width: 100%;
  8696. background-color: #fff;
  8697. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/2021/happy-donut.png);
  8698. background-position: bottom;
  8699. background-repeat: no-repeat;
  8700. background-size: cover
  8701. }
  8702. .billing-history-empty-state__message {
  8703. text-align: center;
  8704. padding: 36px 23px 151px
  8705. }
  8706. @media(min-width:48em) {
  8707. .billing-history-empty-state__message {
  8708. padding: 72px 46px 200px
  8709. }
  8710. }
  8711. .billing-history-empty-state__message h4 {
  8712. margin-bottom: 8px
  8713. }
  8714. .billing-history-empty-state__message p {
  8715. margin: 0
  8716. }
  8717. .no-subscription-plan__header {
  8718. margin-bottom: 16px
  8719. }
  8720. @media(min-width:48em) {
  8721. .no-subscription-plan__header {
  8722. margin-bottom: 24px
  8723. }
  8724. }
  8725. .no-subscription-plan__content p {
  8726. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8727. font-size: .8125rem;
  8728. line-height: 1.125rem;
  8729. margin: 0
  8730. }
  8731. @media(min-width:48em) {
  8732. .no-subscription-plan__content p {
  8733. font-size: .875rem;
  8734. line-height: 1.25rem
  8735. }
  8736. }
  8737. .no-subscription-plan__button {
  8738. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  8739. font-size: 1.0625rem;
  8740. width: 100%;
  8741. background-color: #f9dada;
  8742. color: #191919;
  8743. padding: 15px 24px 12px;
  8744. border-radius: 50px;
  8745. border-color: transparent;
  8746. text-decoration: none;
  8747. margin-top: 24px;
  8748. font-weight: 600;
  8749. line-height: normal
  8750. }
  8751. .no-subscription-plan__button span {
  8752. margin: 0 auto
  8753. }
  8754. .no-subscription-plan__button:hover {
  8755. background-color: #fdf0f0;
  8756. color: #191919
  8757. }
  8758. @media(min-width:48em) {
  8759. .no-subscription-plan__button {
  8760. font-size: .875rem;
  8761. width: auto;
  8762. display: inline-block
  8763. }
  8764. }
  8765. .expandable-form-wrapper {
  8766. background-color: #fff;
  8767. padding: 16px;
  8768. border-radius: 4px;
  8769. position: relative;
  8770. margin-bottom: 16px;
  8771. color: #403840
  8772. }
  8773. @media(min-width:48em) {
  8774. .expandable-form-wrapper {
  8775. padding: 24px
  8776. }
  8777. }
  8778. .expandable-form-wrapper__title {
  8779. margin: 0 0 16px
  8780. }
  8781. .expandable-form-wrapper__toggle {
  8782. position: absolute;
  8783. top: 16px;
  8784. right: 16px
  8785. }
  8786. @media(min-width:48em) {
  8787. .expandable-form-wrapper__toggle {
  8788. top: 24px;
  8789. right: 24px
  8790. }
  8791. }
  8792. .expandable-form-wrapper__toggle svg {
  8793. fill: #403840;
  8794. width: 14px;
  8795. height: auto
  8796. }
  8797. .expandable-form-wrapper__toggle--close {
  8798. display: inline-block
  8799. }
  8800. .expandable-form-wrapper__collapsed p {
  8801. margin: 0;
  8802. word-wrap: break-word
  8803. }
  8804. .expandable-form-wrapper__collapsed p:first-of-type {
  8805. font-weight: 700
  8806. }
  8807. .expandable-form-wrapper__collapsed p:nth-child(2n) {
  8808. margin-top: 4px
  8809. }
  8810. .expandable-form-wrapper .lds__button {
  8811. font-size: 1rem;
  8812. line-height: 1.125rem
  8813. }
  8814. .expandable-form-wrapper .loading-placeholder {
  8815. margin-bottom: 4px
  8816. }
  8817. .expandable-form-wrapper__payment-info {
  8818. min-height: 160px
  8819. }
  8820. .expandable-form-wrapper__payment-info .payment-info-tile--bold {
  8821. margin-bottom: 4px
  8822. }
  8823. .expandable-form-wrapper__payment-info .payment-info-tile__card p {
  8824. font-weight: 400
  8825. }
  8826. .expandable-form-wrapper__payment-info .pcoi-error-tile {
  8827. margin-bottom: 0
  8828. }
  8829. .expandable-form-wrapper__payment-info .pcoi-error-tile span,
  8830. .expandable-form-wrapper__payment-info .zuora-payment-error span {
  8831. color: #fff
  8832. }
  8833. .expandable-form-wrapper__payment-info .loading-view {
  8834. margin: 0
  8835. }
  8836. .expandable-form-wrapper__payment-info .loading-view .circle-loader__indicator {
  8837. border-color: #f9dada #f0f0f0 #f0f0f0
  8838. }
  8839. .tile.subscription-support-tile {
  8840. background-color: #fff;
  8841. display: flex;
  8842. font-size: 1rem;
  8843. line-height: 1.5rem;
  8844. padding: 16px;
  8845. margin-bottom: 16px
  8846. }
  8847. .tile.subscription-support-tile .link {
  8848. text-decoration: none
  8849. }
  8850. .tile.subscription-support-tile .support-link {
  8851. display: flex;
  8852. flex-basis: 100%;
  8853. text-decoration: none
  8854. }
  8855. .tile.subscription-support-tile .support-link span {
  8856. color: #403840;
  8857. font-weight: 700;
  8858. margin-left: 8px
  8859. }
  8860. .tile.subscription-support-tile .support-link span:hover {
  8861. color: #ac342a
  8862. }
  8863. .tile.subscription-support-tile .support-link .manage-subscription__caret {
  8864. margin-left: auto;
  8865. fill: #ac342a;
  8866. width: 1rem
  8867. }
  8868. .tile {
  8869. padding: 16px;
  8870. border-radius: 16px
  8871. }
  8872. @media(min-width:48em) {
  8873. .tile {
  8874. padding: 24px
  8875. }
  8876. }
  8877. .page-section {
  8878. margin-bottom: 40px
  8879. }
  8880. .page-section__title {
  8881. margin: 0
  8882. }
  8883. .page-section__title span {
  8884. vertical-align: text-top
  8885. }
  8886. .page-section__header {
  8887. display: flex;
  8888. align-items: center;
  8889. margin: 0 0 16px
  8890. }
  8891. .page-section__link {
  8892. margin-right: 14px;
  8893. padding: 0 0 0 8px
  8894. }
  8895. .page-section__link svg {
  8896. height: 20px;
  8897. width: 12px
  8898. }
  8899. @media(min-width:48em) {
  8900. .page-section {
  8901. margin-bottom: 64px
  8902. }
  8903. .page-section__header {
  8904. margin: 0 0 32px
  8905. }
  8906. .page-section__link {
  8907. margin-right: 22px
  8908. }
  8909. }
  8910. .flows-background {
  8911. position: absolute;
  8912. overflow: hidden;
  8913. top: 0;
  8914. left: 0;
  8915. right: 0;
  8916. bottom: 0;
  8917. z-index: 0;
  8918. background: #feece8
  8919. }
  8920. .flows-background .sprite {
  8921. position: absolute
  8922. }
  8923. @media(max-width:63.99em) {
  8924. .flows-background__dot-1,
  8925. .flows-background__dot-2,
  8926. .flows-background__dot-3,
  8927. .flows-background__dot-5,
  8928. .flows-background__dot-6,
  8929. .flows-background__dot-8,
  8930. .flows-background__ring-5 {
  8931. display: none
  8932. }
  8933. }
  8934. @media(min-width:64em) {
  8935. .flows-background__dot-9,
  8936. .flows-background__dot-10,
  8937. .flows-background__dot-11 {
  8938. display: none
  8939. }
  8940. }
  8941. .flows-background__ring-1 {
  8942. width: 20px;
  8943. height: 20px;
  8944. top: 260px;
  8945. right: 1.8%;
  8946. transform: rotate(-45deg)
  8947. }
  8948. @media(min-width:48em) {
  8949. .flows-background__ring-1 {
  8950. width: 38px;
  8951. height: 38px;
  8952. right: 50%;
  8953. margin-right: -374px;
  8954. top: 430px;
  8955. transform: rotate(135deg)
  8956. }
  8957. }
  8958. @media(min-width:64em) {
  8959. .flows-background__ring-1 {
  8960. width: 450px;
  8961. height: 450px;
  8962. top: -150px;
  8963. margin-right: 0;
  8964. right: -185px;
  8965. transform: rotate(-45deg)
  8966. }
  8967. }
  8968. .flows-background__ring-2 {
  8969. width: 46px;
  8970. height: 46px;
  8971. top: -10px;
  8972. left: 9%;
  8973. transform: rotate(-45deg)
  8974. }
  8975. @media(min-width:48em) {
  8976. .flows-background__ring-2 {
  8977. width: 92px;
  8978. height: 92px;
  8979. top: -32px
  8980. }
  8981. }
  8982. @media(min-width:64em) {
  8983. .flows-background__ring-2 {
  8984. width: 110px;
  8985. height: 110px;
  8986. top: 270px;
  8987. left: -55px;
  8988. transform: none
  8989. }
  8990. }
  8991. .flows-background__ring-3 {
  8992. width: 18px;
  8993. height: 18px;
  8994. left: 2%;
  8995. top: 588px;
  8996. transform: rotate(-45deg)
  8997. }
  8998. @media(min-width:48em) {
  8999. .flows-background__ring-3 {
  9000. width: 36px;
  9001. height: 36px;
  9002. left: 50%;
  9003. margin-left: -346px
  9004. }
  9005. }
  9006. @media(min-width:64em) {
  9007. .flows-background__ring-3 {
  9008. width: 330px;
  9009. height: 330px;
  9010. top: 950px;
  9011. left: 50%;
  9012. margin-left: -540px;
  9013. transform: rotate(-90deg)
  9014. }
  9015. }
  9016. .flows-background__ring-4 {
  9017. width: 140px;
  9018. height: 140px;
  9019. bottom: -90px;
  9020. left: -58px
  9021. }
  9022. @media(min-width:64em) {
  9023. .flows-background__ring-4 {
  9024. width: 110px;
  9025. height: 110px;
  9026. top: 1780px;
  9027. right: 50%;
  9028. margin-right: -390px;
  9029. bottom: auto;
  9030. left: auto
  9031. }
  9032. }
  9033. @media(min-width:64em) {
  9034. .flows-background__ring-5 {
  9035. width: 330px;
  9036. height: 330px;
  9037. top: 2000px;
  9038. left: 50%;
  9039. margin-left: -516px;
  9040. transform: rotate(90deg)
  9041. }
  9042. }
  9043. @media(min-width:64em) {
  9044. .flows-background__dot-1 {
  9045. width: 14px;
  9046. height: 14px;
  9047. top: 538px;
  9048. left: 17%
  9049. }
  9050. }
  9051. @media(min-width:64em) {
  9052. .flows-background__dot-2 {
  9053. width: 42px;
  9054. height: 42px;
  9055. top: 600px;
  9056. left: 10%
  9057. }
  9058. }
  9059. @media(min-width:64em) {
  9060. .flows-background__dot-3 {
  9061. width: 22px;
  9062. height: 22px;
  9063. top: 756px;
  9064. right: 17%
  9065. }
  9066. }
  9067. .flows-background__dot-4 {
  9068. width: 28px;
  9069. height: 28px;
  9070. top: -7px;
  9071. right: 5.3%
  9072. }
  9073. @media(min-width:48em) {
  9074. .flows-background__dot-4 {
  9075. width: 54px;
  9076. height: 54px;
  9077. top: -24px
  9078. }
  9079. }
  9080. @media(min-width:64em) {
  9081. .flows-background__dot-4 {
  9082. top: 792px;
  9083. right: 8.5%
  9084. }
  9085. }
  9086. @media(min-width:64em) {
  9087. .flows-background__dot-5 {
  9088. width: 14px;
  9089. height: 14px;
  9090. top: 1286px;
  9091. right: 7.5%
  9092. }
  9093. }
  9094. @media(min-width:64em) {
  9095. .flows-background__dot-6 {
  9096. width: 44px;
  9097. height: 44px;
  9098. top: 1350px;
  9099. right: 12.5%
  9100. }
  9101. }
  9102. .flows-background__dot-7 {
  9103. width: 24px;
  9104. height: 24px;
  9105. top: 190px;
  9106. left: -11px
  9107. }
  9108. @media(min-width:48em) {
  9109. .flows-background__dot-7 {
  9110. width: 44px;
  9111. height: 44px;
  9112. left: -16px;
  9113. top: 300px
  9114. }
  9115. }
  9116. @media(min-width:64em) {
  9117. .flows-background__dot-7 {
  9118. width: 54px;
  9119. height: 54px;
  9120. top: 1600px;
  9121. left: 17.5%
  9122. }
  9123. }
  9124. @media(min-width:64em) {
  9125. .flows-background__dot-8 {
  9126. width: 22px;
  9127. height: 22px;
  9128. top: 1708px;
  9129. left: 13%
  9130. }
  9131. }
  9132. .flows-background__dot-9 {
  9133. width: 16px;
  9134. height: 16px;
  9135. right: -8px;
  9136. top: 430px
  9137. }
  9138. @media(min-width:48em) {
  9139. .flows-background__dot-9 {
  9140. top: 230px
  9141. }
  9142. }
  9143. .flows-background__dot-10 {
  9144. width: 66px;
  9145. height: 66px;
  9146. right: -54px;
  9147. top: 770px
  9148. }
  9149. .flows-background__dot-11 {
  9150. width: 16px;
  9151. height: 16px;
  9152. bottom: -2px;
  9153. right: 12%
  9154. }
  9155. .homepage-join-background * {
  9156. position: absolute
  9157. }
  9158. @media(max-width:47.99em) {
  9159. .homepage-join-background * {
  9160. display: none
  9161. }
  9162. }
  9163. .homepage-join-background__circle-left {
  9164. position: absolute;
  9165. width: 120px;
  9166. height: 120px;
  9167. top: 40px;
  9168. left: -55px
  9169. }
  9170. .homepage-join-background__circle-right {
  9171. position: absolute;
  9172. width: 650px;
  9173. height: 650px;
  9174. bottom: -442px;
  9175. right: -268px;
  9176. transform: rotate(45deg)
  9177. }
  9178. .homepage-join-background__dot {
  9179. position: absolute;
  9180. width: 70px;
  9181. height: 70px;
  9182. bottom: -35px;
  9183. left: 14%
  9184. }
  9185. .homepage-offers-extended-background {
  9186. position: relative;
  9187. right: 50%;
  9188. height: 0;
  9189. font-size: 0
  9190. }
  9191. @media(max-width:79.99em) {
  9192. .homepage-offers-extended-background {
  9193. display: none
  9194. }
  9195. }
  9196. .homepage-offers-extended-background__inner {
  9197. position: relative;
  9198. display: inline-block;
  9199. width: 100%;
  9200. height: 0;
  9201. min-width: 1700px;
  9202. margin-right: -100%
  9203. }
  9204. .homepage-offers-extended-background__ring-left {
  9205. position: absolute;
  9206. transform: rotate(45deg);
  9207. width: 180px;
  9208. height: 180px;
  9209. top: -90px;
  9210. left: -90px
  9211. }
  9212. .homepage-offers-extended-background__ring-right {
  9213. position: absolute;
  9214. transform: rotate(135deg);
  9215. height: 200px;
  9216. width: 200px;
  9217. top: 150px;
  9218. right: -120px
  9219. }
  9220. .homepage-offers-header-background__ring {
  9221. position: absolute;
  9222. transform: rotate(-45deg);
  9223. height: 320px;
  9224. width: 320px;
  9225. bottom: -210px;
  9226. left: -135px
  9227. }
  9228. @media(max-width:47.99em) {
  9229. .homepage-offers-header-background__ring {
  9230. display: none
  9231. }
  9232. }
  9233. @media(min-width:64em) {
  9234. .homepage-offers-header-background__ring {
  9235. height: 520px;
  9236. width: 520px;
  9237. bottom: -340px;
  9238. left: -215px
  9239. }
  9240. }
  9241. .homepage-offers-header-background__dot {
  9242. position: absolute;
  9243. width: 40px;
  9244. height: 40px;
  9245. top: 46px;
  9246. right: 9%
  9247. }
  9248. @media(max-width:47.99em) {
  9249. .homepage-offers-header-background__dot {
  9250. display: none
  9251. }
  9252. }
  9253. @media(min-width:64em) {
  9254. .homepage-offers-header-background__dot {
  9255. width: 60px;
  9256. height: 60px;
  9257. top: 100px;
  9258. right: 13%
  9259. }
  9260. }
  9261. .utility-header-bg {
  9262. position: absolute;
  9263. top: 0;
  9264. left: 0;
  9265. right: 0;
  9266. bottom: 0;
  9267. overflow: hidden;
  9268. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/2021/pco-rings-header-background.png);
  9269. background-color: #f9dada;
  9270. background-size: cover
  9271. }
  9272. @media(min-width:48em) {
  9273. .utility-header-bg {
  9274. min-height: 300px
  9275. }
  9276. }
  9277. .utility-header-bg__insiders {
  9278. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/2021/pcoi-rings-header-background.png);
  9279. background-color: #2d2e39
  9280. }
  9281. @media(min-width:48em) {
  9282. .utility-header .utility-header-bg {
  9283. min-height: 220px
  9284. }
  9285. }
  9286. .checklist-polling {
  9287. display: flex;
  9288. justify-content: center;
  9289. background: #fbf1f1;
  9290. border-radius: 6px;
  9291. margin-bottom: 17px
  9292. }
  9293. .checklist-polling__not-answered-message {
  9294. display: flex;
  9295. flex-wrap: wrap;
  9296. justify-content: center;
  9297. margin: 0;
  9298. padding: 1rem 1rem .5rem;
  9299. font-size: .875rem;
  9300. text-align: center
  9301. }
  9302. .checklist-polling__not-answered-buttonGroup {
  9303. display: flex;
  9304. justify-content: center;
  9305. padding-bottom: .75rem
  9306. }
  9307. .checklist-polling__not-answered-dash {
  9308. padding-left: 1rem;
  9309. padding-right: 1rem;
  9310. color: #655c6c;
  9311. padding-top: .188rem
  9312. }
  9313. .checklist-polling__answered-message {
  9314. display: flex;
  9315. justify-content: center;
  9316. margin: 0;
  9317. padding: 1rem;
  9318. font-size: .875rem;
  9319. text-align: center
  9320. }
  9321. .checklist-sdm__logo {
  9322. display: flex;
  9323. justify-content: center;
  9324. margin-top: 24px;
  9325. margin-bottom: 16px;
  9326. border-top: 1px solid #9e93a6
  9327. }
  9328. .checklist-sdm__logo .sprite {
  9329. width: 125px;
  9330. height: 37px;
  9331. margin-top: 24px
  9332. }
  9333. .checklist-sdm__name {
  9334. display: flex;
  9335. font-weight: 700;
  9336. word-break: break-word
  9337. }
  9338. .checklist-sdm__name .sprite {
  9339. margin: 0 11px 0 0;
  9340. width: 18px;
  9341. height: 18px
  9342. }
  9343. .checklist-sdm__description {
  9344. display: flex;
  9345. margin-bottom: 17px;
  9346. margin-left: 29px
  9347. }
  9348. .checklist-sdm__description span {
  9349. font-size: .875rem;
  9350. line-height: 1.43;
  9351. margin-top: 4px;
  9352. color: #655c6c;
  9353. word-break: break-word
  9354. }
  9355. .account-setting--security .checklist-sdm .account-setting__turn-off-button,
  9356. .account-setting--security .checklist-sdm .account-setting__turn-on-button,
  9357. .checklist-sdm .account-setting--security .account-setting__turn-off-button,
  9358. .checklist-sdm .account-setting--security .account-setting__turn-on-button,
  9359. .checklist-sdm .button,
  9360. .checklist-sdm .household-grid__invite-button,
  9361. .checklist-sdm .link--theme-button,
  9362. .checklist-sdm .link--theme-button--large-primary,
  9363. .checklist-sdm .link--theme-button--large-secondary,
  9364. .checklist-sdm .link--theme-button--small-primary,
  9365. .checklist-sdm .link--theme-button--small-secondary,
  9366. .checklist-sdm .link--theme-button-gray,
  9367. .checklist-sdm .link--theme-button-red,
  9368. .checklist-sdm .link--theme-button-transparent,
  9369. .checklist-sdm .link--theme-button-transparent-white,
  9370. .checklist-sdm .link--theme-button-white,
  9371. .checklist-sdm .load-shop-pay-header__link,
  9372. .checklist-sdm .load-shop-pay-module__link,
  9373. .checklist-sdm .marketing-page-header__link,
  9374. .checklist-sdm .marketing-page-module__link,
  9375. .checklist-sdm .partnership-perk-details__cta,
  9376. .checklist-sdm .partnership-perk-redeemed-success__cta,
  9377. .checklist-sdm .points-days-cta-section__content .cta-section__link,
  9378. .checklist-sdm .points-days__cta,
  9379. .points-days-cta-section__content .checklist-sdm .cta-section__link {
  9380. width: 100%;
  9381. justify-content: center
  9382. }
  9383. .checklist-how-points-work {
  9384. padding: 32px;
  9385. border-bottom: 1px solid rgba(158, 147, 166, .4)
  9386. }
  9387. .checklist-how-points-work__header {
  9388. color: #403840;
  9389. font-weight: 600;
  9390. margin: 0
  9391. }
  9392. .checklist-how-points-work__illustration {
  9393. display: block;
  9394. max-height: 128px;
  9395. margin: 16px 0;
  9396. max-width: 100%
  9397. }
  9398. @media(min-width:64em) {
  9399. .checklist-how-points-work__illustration {
  9400. margin: 24px 0
  9401. }
  9402. }
  9403. .checklist-how-points-work .link {
  9404. color: #403840;
  9405. font-weight: 700;
  9406. display: inline-block;
  9407. text-decoration: none
  9408. }
  9409. .checklist-how-points-work .link:hover {
  9410. color: #ee3124;
  9411. text-decoration: underline
  9412. }
  9413. .checklist-item {
  9414. display: flex
  9415. }
  9416. .checklist-item--placeholder .checklist-item__icon {
  9417. width: 60px;
  9418. margin-right: 16px
  9419. }
  9420. .checklist-item--placeholder .loading-placeholder:last-child>.loading-placeholder__inner {
  9421. margin-bottom: 0
  9422. }
  9423. .checklist-item--placeholder .checklist-item__item-actions {
  9424. flex: 1 0 auto
  9425. }
  9426. .checklist-item .link {
  9427. color: #403840;
  9428. font-weight: 700;
  9429. display: inline-block;
  9430. text-decoration: none;
  9431. font-size: 1rem;
  9432. line-height: 1.5
  9433. }
  9434. .checklist-item .link:hover {
  9435. color: #ee3124;
  9436. text-decoration: underline
  9437. }
  9438. .checklist-how-points-work__subcopy,
  9439. .checklist-item__subcopy {
  9440. color: #655c6c;
  9441. margin: 8px 0 0
  9442. }
  9443. .checklist-item__icon {
  9444. margin-right: 10px;
  9445. min-width: 48px;
  9446. height: 48px;
  9447. position: relative
  9448. }
  9449. .checklist-item__icon svg {
  9450. width: 48px
  9451. }
  9452. .checklist-item__icon--pcocard {
  9453. position: absolute;
  9454. left: -2px;
  9455. width: 52px
  9456. }
  9457. .checklist-item__icon .placeholder {
  9458. margin-top: 0
  9459. }
  9460. .checklist-item__ignore-sprite {
  9461. align-items: center;
  9462. align-self: flex-start;
  9463. display: flex;
  9464. flex-shrink: 0;
  9465. fill: #191919;
  9466. flex-direction: column;
  9467. height: 40px;
  9468. justify-content: center;
  9469. margin: -10px -10px 0 auto;
  9470. width: 40px
  9471. }
  9472. .checklist-item__ignore-sprite:hover {
  9473. fill: #191919
  9474. }
  9475. .checklist-item__ignore-sprite .sprite {
  9476. height: 24px;
  9477. width: 24px
  9478. }
  9479. .checklist-item__watch-how-link {
  9480. color: #da291c
  9481. }
  9482. .checklist-how-points-work__right-arrow,
  9483. .checklist-item__right-arrow {
  9484. margin-top: -3px;
  9485. vertical-align: middle;
  9486. fill: #da291c;
  9487. height: 14px
  9488. }
  9489. .account-device {
  9490. flex-grow: 1;
  9491. padding: 20px 0 20px 20px;
  9492. margin-bottom: 10px;
  9493. background: #fff;
  9494. display: flex;
  9495. flex-flow: row nowrap;
  9496. justify-content: flex-start
  9497. }
  9498. @media(min-width:48em) {
  9499. .account-device {
  9500. padding: 20px 0 20px 40px
  9501. }
  9502. }
  9503. .account-device:last-child {
  9504. margin-bottom: 0
  9505. }
  9506. .account-device-container {
  9507. display: flex;
  9508. align-items: center;
  9509. width: 100%
  9510. }
  9511. .account-device-container>.account-device {
  9512. margin-bottom: 0
  9513. }
  9514. @media(min-width:48em) {
  9515. .account-device-toggle-button {
  9516. margin-right: 20px
  9517. }
  9518. }
  9519. .account-device__icon-container {
  9520. flex-basis: 46px;
  9521. flex-shrink: 0;
  9522. display: flex;
  9523. align-items: flex-start
  9524. }
  9525. @media(min-width:48em) {
  9526. .account-device__icon-container {
  9527. flex-basis: 52px;
  9528. margin-right: 48px
  9529. }
  9530. }
  9531. .account-device__icon {
  9532. display: block
  9533. }
  9534. .account-device__icon--type-card,
  9535. .account-device__icon--type-pcf,
  9536. .account-device__icon--type-pcfbnkgcard,
  9537. .account-device__icon--type-pcfconvenience,
  9538. .account-device__icon--type-pcfcreditcard,
  9539. .account-device__icon--type-pcfdebitcard,
  9540. .account-device__icon--type-pcfproduct,
  9541. .account-device__icon--type-pcsproduct {
  9542. width: 52px;
  9543. height: 40px
  9544. }
  9545. @media(min-width:48em) {
  9546. .account-device__icon--type-card,
  9547. .account-device__icon--type-pcf,
  9548. .account-device__icon--type-pcfbnkgcard,
  9549. .account-device__icon--type-pcfconvenience,
  9550. .account-device__icon--type-pcfcreditcard,
  9551. .account-device__icon--type-pcfdebitcard,
  9552. .account-device__icon--type-pcfproduct,
  9553. .account-device__icon--type-pcsproduct {
  9554. width: 52px;
  9555. height: 34px
  9556. }
  9557. }
  9558. .account-device__icon--type-fob {
  9559. width: 46px;
  9560. height: 25px
  9561. }
  9562. @media(min-width:48em) {
  9563. .account-device__icon--type-fob {
  9564. width: 52px;
  9565. height: 28px
  9566. }
  9567. }
  9568. .account-device__icon--type-app {
  9569. width: 50px;
  9570. height: 40px
  9571. }
  9572. @media(min-width:48em) {
  9573. .account-device__icon--type-app {
  9574. width: 52px;
  9575. height: 52px
  9576. }
  9577. }
  9578. .account-device__icon--type-mobilewallet,
  9579. .account-device__icon--type-phonenumber {
  9580. opacity: 0
  9581. }
  9582. .account-device__content {
  9583. margin-left: 20px
  9584. }
  9585. @media(min-width:48em) {
  9586. .account-device__content {
  9587. display: flex;
  9588. flex-direction: row;
  9589. flex-grow: 1;
  9590. justify-content: space-between;
  9591. align-items: center;
  9592. margin-left: 0
  9593. }
  9594. }
  9595. .account-device__content--expanded {
  9596. margin-left: 20px;
  9597. justify-content: flex-start
  9598. }
  9599. @media(min-width:48em) {
  9600. .account-device__content--expanded {
  9601. margin-left: 0
  9602. }
  9603. }
  9604. .account-device__legacy-type,
  9605. .account-device__nickname {
  9606. color: #191919
  9607. }
  9608. @media(min-width:48em) {
  9609. .account-device__legacy-type,
  9610. .account-device__nickname {
  9611. margin-right: 20px;
  9612. font-size: 1.125rem;
  9613. flex-basis: 195px
  9614. }
  9615. }
  9616. @media(min-width:64em) {
  9617. .account-device__legacy-type,
  9618. .account-device__nickname {
  9619. margin-right: 40px;
  9620. flex-basis: 250px
  9621. }
  9622. }
  9623. .account-device__nickname {
  9624. min-width: 80px;
  9625. margin-bottom: 6px
  9626. }
  9627. .account-device__nickname:lang(fr-CA) sup {
  9628. font-size: .6rem
  9629. }
  9630. .account-device__secondary-info {
  9631. margin-bottom: 6px
  9632. }
  9633. @media(min-width:48em) {
  9634. .account-device__secondary-info {
  9635. margin-bottom: 0;
  9636. display: flex;
  9637. flex-flow: row nowrap;
  9638. align-items: center;
  9639. justify-content: flex-start
  9640. }
  9641. }
  9642. @media(min-width:64em) {
  9643. .account-device__secondary-info {
  9644. margin-right: 20px
  9645. }
  9646. }
  9647. .account-device__last-four {
  9648. white-space: nowrap
  9649. }
  9650. @media(min-width:48em) {
  9651. .account-device__last-four {
  9652. margin-right: 20px
  9653. }
  9654. }
  9655. .account-device__state {
  9656. color: #191919;
  9657. display: flex;
  9658. flex-basis: 180px
  9659. }
  9660. @media(min-width:48em) {
  9661. .account-device__state {
  9662. margin-top: 0
  9663. }
  9664. }
  9665. @media(min-width:64em) {
  9666. .account-device__state {
  9667. align-items: center
  9668. }
  9669. }
  9670. .account-device__state-icon {
  9671. vertical-align: text-bottom;
  9672. height: 18px;
  9673. width: 18px;
  9674. fill: #585858;
  9675. margin-right: 4px
  9676. }
  9677. @media(min-width:48em) {
  9678. .account-device__state-icon {
  9679. margin-top: -5px;
  9680. height: 24px;
  9681. width: 24px
  9682. }
  9683. }
  9684. .account-device__checkmark {
  9685. flex-shrink: 0;
  9686. width: 15px;
  9687. height: 15px;
  9688. margin-right: 8px;
  9689. position: relative
  9690. }
  9691. @media(min-width:64em) {
  9692. .account-device__checkmark {
  9693. bottom: 2px
  9694. }
  9695. }
  9696. .error-screen {
  9697. max-width: 794px;
  9698. margin: 60px auto;
  9699. padding: 0 16px;
  9700. text-align: center
  9701. }
  9702. @media(min-width:48em) {
  9703. .error-screen {
  9704. margin: 100px auto
  9705. }
  9706. }
  9707. .error-screen__image-container {
  9708. width: 100%;
  9709. margin-bottom: 40px
  9710. }
  9711. .error-screen__image-container img {
  9712. width: 200px
  9713. }
  9714. @media(min-width:48em) {
  9715. .error-screen__image-container img {
  9716. width: 300px
  9717. }
  9718. }
  9719. .error-screen__title {
  9720. margin-bottom: 16px
  9721. }
  9722. .error-screen__content {
  9723. max-width: 480px
  9724. }
  9725. @font-face {
  9726. font-display: swap;
  9727. font-family: Inter;
  9728. font-weight: 600;
  9729. src: url(/static/fonts/inter-semibold.woff2) format("woff2"), url(/static/fonts/inter-semibold.woff) format("woff")
  9730. }
  9731. @font-face {
  9732. font-display: swap;
  9733. font-family: Inter;
  9734. font-weight: 400;
  9735. src: url(/static/fonts/inter-regular.woff2) format("woff2"), url(/static/fonts/inter-regular.woff) format("woff")
  9736. }
  9737. .cancel-subscription__wrapper {
  9738. background-color: #fff;
  9739. border-radius: 16px;
  9740. color: #403840
  9741. }
  9742. .cancel-subscription__wrapper__active-member>span {
  9743. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  9744. font-size: .8125rem;
  9745. line-height: 1.125rem;
  9746. display: inline-block;
  9747. font-size: 1.125rem;
  9748. margin-bottom: 24px
  9749. }
  9750. @media(min-width:48em) {
  9751. .cancel-subscription__wrapper__active-member>span {
  9752. font-size: .875rem;
  9753. line-height: 1.25rem
  9754. }
  9755. }
  9756. .cancel-subscription__wrapper__cancelled-member>span:first-child {
  9757. display: block;
  9758. margin-bottom: 24px
  9759. }
  9760. .cancel-subscription__wrapper__text__bold {
  9761. font-weight: 700
  9762. }
  9763. .cancel-subscription__btn {
  9764. background: #fff;
  9765. border-radius: 24px;
  9766. display: flex;
  9767. padding: 12px 16px
  9768. }
  9769. .cancel-subscription__btn:hover {
  9770. background-color: #403840
  9771. }
  9772. .cancel-subscription__btn:hover span {
  9773. color: #fff
  9774. }
  9775. .cancel-subscription__btn span {
  9776. color: #403840;
  9777. font-weight: 600;
  9778. font-size: 16px;
  9779. margin: 0;
  9780. align-self: center
  9781. }
  9782. .cancel-subscription__modal__bold {
  9783. font-weight: 700
  9784. }
  9785. .cancel-subscription__modal-container {
  9786. z-index: 999;
  9787. position: fixed;
  9788. top: 0;
  9789. left: 0;
  9790. width: 100vw;
  9791. height: 100vh;
  9792. display: flex;
  9793. justify-content: center;
  9794. align-items: center;
  9795. background-color: rgba(6, 17, 22, .65)
  9796. }
  9797. .cancel-subscription__modal-content {
  9798. display: flex;
  9799. flex-direction: column;
  9800. position: relative;
  9801. background-color: #fff;
  9802. padding: 24px;
  9803. border-radius: 24px;
  9804. width: 90%;
  9805. max-width: 561px
  9806. }
  9807. .cancel-subscription__modal-content--close {
  9808. position: absolute;
  9809. top: 24px;
  9810. right: 24px
  9811. }
  9812. .cancel-subscription__modal-content--close svg {
  9813. fill: #403840
  9814. }
  9815. .cancel-subscription__modal-content .pcoi-error-tile {
  9816. margin: 16px 0 0
  9817. }
  9818. .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type {
  9819. color: #fff
  9820. }
  9821. .cancel-subscription__modal-content .loading-view {
  9822. margin: 0
  9823. }
  9824. .cancel-subscription__modal-content .loading-view .circle-loader__indicator {
  9825. border-color: #f9dada #f0f0f0 #f0f0f0
  9826. }
  9827. .cancel-subscription__modal--title {
  9828. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  9829. font-size: 1.25rem;
  9830. line-height: 1.5rem;
  9831. font-weight: 600;
  9832. margin: 0 0 16px;
  9833. padding-right: 16px
  9834. }
  9835. @media(min-width:48em) {
  9836. .cancel-subscription__modal--title {
  9837. font-size: 1.5rem;
  9838. line-height: 2rem
  9839. }
  9840. }
  9841. .cancel-subscription__modal--description {
  9842. font-family: Inter, sans-serif;
  9843. font-size: 1rem;
  9844. margin: 0;
  9845. color: #fff;
  9846. -webkit-font-smoothing: antialiased;
  9847. font-size: .938rem;
  9848. line-height: 1.25rem;
  9849. color: #403840
  9850. }
  9851. @media(min-width:768px) {
  9852. .cancel-subscription__modal--description {
  9853. font-size: 1rem;
  9854. line-height: 1.5rem
  9855. }
  9856. }
  9857. .cancel-subscription__modal--description>span:first-child {
  9858. display: block;
  9859. margin-bottom: 16px
  9860. }
  9861. .cancel-subscription__modal-btn-wrapper {
  9862. display: flex;
  9863. flex-flow: row;
  9864. margin-top: 24px;
  9865. flex-direction: column-reverse
  9866. }
  9867. @media(min-width:48em) {
  9868. .cancel-subscription__modal-btn-wrapper {
  9869. flex-direction: row-reverse
  9870. }
  9871. }
  9872. .account-setting--security .cancel-subscription__modal-btn-wrapper .account-setting__turn-off-button,
  9873. .account-setting--security .cancel-subscription__modal-btn-wrapper .account-setting__turn-on-button,
  9874. .cancel-subscription__modal-btn-wrapper .account-setting--security .account-setting__turn-off-button,
  9875. .cancel-subscription__modal-btn-wrapper .account-setting--security .account-setting__turn-on-button,
  9876. .cancel-subscription__modal-btn-wrapper .button,
  9877. .cancel-subscription__modal-btn-wrapper .household-grid__invite-button,
  9878. .cancel-subscription__modal-btn-wrapper .link--theme-button,
  9879. .cancel-subscription__modal-btn-wrapper .link--theme-button--large-primary,
  9880. .cancel-subscription__modal-btn-wrapper .link--theme-button--large-secondary,
  9881. .cancel-subscription__modal-btn-wrapper .link--theme-button--small-primary,
  9882. .cancel-subscription__modal-btn-wrapper .link--theme-button--small-secondary,
  9883. .cancel-subscription__modal-btn-wrapper .link--theme-button-gray,
  9884. .cancel-subscription__modal-btn-wrapper .link--theme-button-red,
  9885. .cancel-subscription__modal-btn-wrapper .link--theme-button-transparent,
  9886. .cancel-subscription__modal-btn-wrapper .link--theme-button-transparent-white,
  9887. .cancel-subscription__modal-btn-wrapper .link--theme-button-white,
  9888. .cancel-subscription__modal-btn-wrapper .load-shop-pay-header__link,
  9889. .cancel-subscription__modal-btn-wrapper .load-shop-pay-module__link,
  9890. .cancel-subscription__modal-btn-wrapper .marketing-page-header__link,
  9891. .cancel-subscription__modal-btn-wrapper .marketing-page-module__link,
  9892. .cancel-subscription__modal-btn-wrapper .partnership-perk-details__cta,
  9893. .cancel-subscription__modal-btn-wrapper .partnership-perk-redeemed-success__cta,
  9894. .cancel-subscription__modal-btn-wrapper .points-days-cta-section__content .cta-section__link,
  9895. .cancel-subscription__modal-btn-wrapper .points-days__cta,
  9896. .points-days-cta-section__content .cancel-subscription__modal-btn-wrapper .cta-section__link {
  9897. border-radius: 24px;
  9898. height: auto;
  9899. padding: 12px 16px;
  9900. min-height: 46px;
  9901. white-space: normal;
  9902. margin-bottom: 24px
  9903. }
  9904. @media(min-width:20em) {
  9905. .account-setting--security .cancel-subscription__modal-btn-wrapper .account-setting__turn-off-button,
  9906. .account-setting--security .cancel-subscription__modal-btn-wrapper .account-setting__turn-on-button,
  9907. .cancel-subscription__modal-btn-wrapper .account-setting--security .account-setting__turn-off-button,
  9908. .cancel-subscription__modal-btn-wrapper .account-setting--security .account-setting__turn-on-button,
  9909. .cancel-subscription__modal-btn-wrapper .button,
  9910. .cancel-subscription__modal-btn-wrapper .household-grid__invite-button,
  9911. .cancel-subscription__modal-btn-wrapper .link--theme-button,
  9912. .cancel-subscription__modal-btn-wrapper .link--theme-button--large-primary,
  9913. .cancel-subscription__modal-btn-wrapper .link--theme-button--large-secondary,
  9914. .cancel-subscription__modal-btn-wrapper .link--theme-button--small-primary,
  9915. .cancel-subscription__modal-btn-wrapper .link--theme-button--small-secondary,
  9916. .cancel-subscription__modal-btn-wrapper .link--theme-button-gray,
  9917. .cancel-subscription__modal-btn-wrapper .link--theme-button-red,
  9918. .cancel-subscription__modal-btn-wrapper .link--theme-button-transparent,
  9919. .cancel-subscription__modal-btn-wrapper .link--theme-button-transparent-white,
  9920. .cancel-subscription__modal-btn-wrapper .link--theme-button-white,
  9921. .cancel-subscription__modal-btn-wrapper .load-shop-pay-header__link,
  9922. .cancel-subscription__modal-btn-wrapper .load-shop-pay-module__link,
  9923. .cancel-subscription__modal-btn-wrapper .marketing-page-header__link,
  9924. .cancel-subscription__modal-btn-wrapper .marketing-page-module__link,
  9925. .cancel-subscription__modal-btn-wrapper .partnership-perk-details__cta,
  9926. .cancel-subscription__modal-btn-wrapper .partnership-perk-redeemed-success__cta,
  9927. .cancel-subscription__modal-btn-wrapper .points-days-cta-section__content .cta-section__link,
  9928. .cancel-subscription__modal-btn-wrapper .points-days__cta,
  9929. .points-days-cta-section__content .cancel-subscription__modal-btn-wrapper .cta-section__link {
  9930. width: 100%
  9931. }
  9932. }
  9933. @media(min-width:48em) {
  9934. .cancel-subscription__modal-btn-wrapper .button--theme-white-gray {
  9935. margin-right: 16px
  9936. }
  9937. }
  9938. .header-points {
  9939. display: flex;
  9940. flex-direction: column;
  9941. color: #ac342a
  9942. }
  9943. @media(min-width:64em) {
  9944. .header-points {
  9945. flex-direction: row;
  9946. flex-grow: 1;
  9947. justify-content: flex-end;
  9948. margin-bottom: 3px
  9949. }
  9950. }
  9951. .header-points--loading-indicator-available .header-points__points-description {
  9952. display: none
  9953. }
  9954. @media(min-width:64em) {
  9955. .header-points--loading-indicator-available .header-points__points-description {
  9956. display: block
  9957. }
  9958. }
  9959. .header-points strong {
  9960. color: #ac342a
  9961. }
  9962. .header-points--insider strong {
  9963. color: #f9dada
  9964. }
  9965. .header-points__points-redeem {
  9966. display: none
  9967. }
  9968. @media(min-width:64em) {
  9969. .header-points__points-redeem {
  9970. display: block;
  9971. line-height: 24px
  9972. }
  9973. }
  9974. .header-points__points-combined-points-redeem {
  9975. display: block
  9976. }
  9977. @media(min-width:64em) {
  9978. .header-points__points-combined-points-redeem {
  9979. display: none
  9980. }
  9981. }
  9982. .header-points__empty-state p,
  9983. .header-points__points-balance p,
  9984. .header-points__redeemable p {
  9985. margin: 0
  9986. }
  9987. .header-points__points-balance,
  9988. .header-points__redeemable {
  9989. display: flex;
  9990. text-align: center
  9991. }
  9992. .header-points__points-balance .loading-placeholder,
  9993. .header-points__redeemable .loading-placeholder {
  9994. margin-bottom: 16px
  9995. }
  9996. @media(min-width:64em) {
  9997. .header-points__points-balance .loading-placeholder,
  9998. .header-points__redeemable .loading-placeholder {
  9999. margin-bottom: 8px
  10000. }
  10001. }
  10002. .header-points__points-balance {
  10003. flex-direction: column
  10004. }
  10005. .header-points__points-balance .loading-placeholder__inner {
  10006. line-height: 28px
  10007. }
  10008. @media(min-width:64em) {
  10009. .header-points__points-balance .loading-placeholder__inner {
  10010. line-height: 32px
  10011. }
  10012. }
  10013. @media(min-width:64em) {
  10014. .header-points__points-balance-placeholder-bottom {
  10015. display: none
  10016. }
  10017. }
  10018. .header-points__points-balance-placeholder-middle .loading-placeholder__inner {
  10019. line-height: 32px
  10020. }
  10021. @media(min-width:64em) {
  10022. .header-points__points-balance-placeholder-middle .loading-placeholder__inner {
  10023. line-height: 28px
  10024. }
  10025. }
  10026. .header-points__points-balance p:first-of-type {
  10027. order: 1;
  10028. font-size: 3.125rem;
  10029. margin: 0;
  10030. line-height: 1.5
  10031. }
  10032. @media(min-width:64em) {
  10033. .header-points__points-balance p:first-of-type {
  10034. order: 0;
  10035. text-align: center;
  10036. margin: 0;
  10037. font-size: 2.625rem;
  10038. line-height: 1.5
  10039. }
  10040. }
  10041. .header-points__redeemable {
  10042. order: 1;
  10043. justify-content: center;
  10044. font-weight: 400
  10045. }
  10046. @media(min-width:64em) {
  10047. .header-points__redeemable {
  10048. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  10049. flex-direction: column;
  10050. margin-left: 20%;
  10051. align-items: center
  10052. }
  10053. }
  10054. .header-points__redeemable p:first-of-type {
  10055. order: 1;
  10056. margin-left: 5px;
  10057. line-height: 1.5
  10058. }
  10059. @media(min-width:64em) {
  10060. .header-points__redeemable p:first-of-type {
  10061. font-weight: 700;
  10062. order: 0;
  10063. margin-left: 0;
  10064. font-size: 2.625rem;
  10065. line-height: 1.5
  10066. }
  10067. }
  10068. .header-points__redeemable .loading-placeholder {
  10069. display: none
  10070. }
  10071. @media(min-width:64em) {
  10072. .header-points__redeemable .loading-placeholder {
  10073. display: block
  10074. }
  10075. }
  10076. .header-points__redeemable .loading-placeholder__inner {
  10077. line-height: 28px
  10078. }
  10079. @media(min-width:64em) {
  10080. .header-points__redeemable .loading-placeholder__inner {
  10081. line-height: 32px
  10082. }
  10083. }
  10084. .header-points__redeemable-placeholder-bottom .loading-placeholder__inner {
  10085. line-height: 32px
  10086. }
  10087. @media(min-width:64em) {
  10088. .header-points__redeemable-placeholder-bottom .loading-placeholder__inner {
  10089. line-height: 28px
  10090. }
  10091. }
  10092. .header-greeting {
  10093. height: 1px;
  10094. width: 1px;
  10095. overflow: hidden;
  10096. display: block;
  10097. margin-bottom: 8px
  10098. }
  10099. @media(min-width:64em) {
  10100. .header-greeting {
  10101. height: -moz-fit-content;
  10102. height: fit-content;
  10103. width: auto;
  10104. margin-bottom: 0
  10105. }
  10106. }
  10107. .header-greeting__placeholder-name {
  10108. display: none
  10109. }
  10110. .header-greeting__placeholder-name .loading-placeholder__inner {
  10111. line-height: 16px
  10112. }
  10113. @media(min-width:64em) {
  10114. .header-greeting__placeholder-name {
  10115. display: block
  10116. }
  10117. }
  10118. .header-greeting__placeholder-message .loading-placeholder__inner {
  10119. line-height: 28px
  10120. }
  10121. .header-greeting h1,
  10122. .header-greeting p {
  10123. line-height: 1
  10124. }
  10125. .header-greeting h1 {
  10126. font-size: 2rem;
  10127. margin: 0
  10128. }
  10129. @media(min-width:64em) {
  10130. .header-greeting h1 {
  10131. font-size: 2.625rem
  10132. }
  10133. }
  10134. .header-greeting p {
  10135. margin: 0 0 8px
  10136. }
  10137. .header-member-text {
  10138. height: 1px;
  10139. width: 1px;
  10140. overflow: hidden;
  10141. margin-bottom: 8px
  10142. }
  10143. @media(min-width:64em) {
  10144. .header-member-text {
  10145. height: -moz-fit-content;
  10146. height: fit-content;
  10147. width: auto
  10148. }
  10149. }
  10150. @media(min-width:64em) {
  10151. .header-message__loading-indicator-on {
  10152. width: 400px
  10153. }
  10154. }
  10155. .header-message__loading-indicator-off {
  10156. color: #ac342a
  10157. }
  10158. .header-message__loading-indicator-off.header-message--insider {
  10159. color: #f9dada
  10160. }
  10161. .header-offer-loading-indicator-error,
  10162. .header-offer-loading-indicator-loaded,
  10163. .header-offer-loading-indicator-loading {
  10164. display: flex;
  10165. align-items: center;
  10166. font-weight: 600;
  10167. padding: 4px 8px;
  10168. margin: 0 -8px
  10169. }
  10170. @media(min-width:64em) {
  10171. .header-offer-loading-indicator-error,
  10172. .header-offer-loading-indicator-loaded,
  10173. .header-offer-loading-indicator-loading {
  10174. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  10175. font-weight: 600;
  10176. font-size: 1.375rem;
  10177. line-height: 1.75rem;
  10178. display: inline-block;
  10179. padding: 8px 16px;
  10180. margin: 0 -16px;
  10181. height: 52px
  10182. }
  10183. }
  10184. @media(min-width:64em)and (min-width:48em) {
  10185. .header-offer-loading-indicator-error,
  10186. .header-offer-loading-indicator-loaded,
  10187. .header-offer-loading-indicator-loading {
  10188. font-size: 2rem;
  10189. line-height: 2.25rem
  10190. }
  10191. }
  10192. .header-offer-loading-indicator-error span,
  10193. .header-offer-loading-indicator-loaded span,
  10194. .header-offer-loading-indicator-loading span {
  10195. vertical-align: text-top;
  10196. color: #ac342a;
  10197. line-height: 36px
  10198. }
  10199. @media(min-width:64em) {
  10200. .header-offer-loading-indicator-error span,
  10201. .header-offer-loading-indicator-loaded span,
  10202. .header-offer-loading-indicator-loading span {
  10203. height: 28px;
  10204. font-size: 28px
  10205. }
  10206. }
  10207. .header-offer-loading-indicator-error .lottieAnimation,
  10208. .header-offer-loading-indicator-loaded .lottieAnimation,
  10209. .header-offer-loading-indicator-loading .lottieAnimation {
  10210. display: inline-block;
  10211. vertical-align: top;
  10212. margin-left: 6px;
  10213. width: 16px;
  10214. height: 16px
  10215. }
  10216. @media(min-width:64em) {
  10217. .header-offer-loading-indicator-error .lottieAnimation,
  10218. .header-offer-loading-indicator-loaded .lottieAnimation,
  10219. .header-offer-loading-indicator-loading .lottieAnimation {
  10220. width: 32px;
  10221. height: 32px
  10222. }
  10223. }
  10224. .header-offer-loading-indicator-error .lottieAnimation div,
  10225. .header-offer-loading-indicator-loaded .lottieAnimation div,
  10226. .header-offer-loading-indicator-loading .lottieAnimation div {
  10227. display: flex
  10228. }
  10229. .header-offer-loading-indicator-error .lottieAnimation div svg path,
  10230. .header-offer-loading-indicator-loaded .lottieAnimation div svg path,
  10231. .header-offer-loading-indicator-loading .lottieAnimation div svg path {
  10232. stroke: #ac342a
  10233. }
  10234. .header-offer-loading-indicator-error .lottieAnimation img,
  10235. .header-offer-loading-indicator-loaded .lottieAnimation img,
  10236. .header-offer-loading-indicator-loading .lottieAnimation img {
  10237. width: 100%
  10238. }
  10239. .header-offer-loading-indicator-loaded {
  10240. display: flex;
  10241. border-radius: 100px;
  10242. background-color: hsla(0, 0%, 100%, 0);
  10243. animation: backgroundFadeout 3.3s linear
  10244. }
  10245. .header-offer-loading-indicator--insider.header-offer-loading-indicator-loaded span,
  10246. .header-offer-loading-indicator--insider.header-offer-loading-indicator-loading span {
  10247. color: #f9dada;
  10248. animation: pcoiFontFade 3.3s linear
  10249. }
  10250. .header-offer-loading-indicator--insider.header-offer-loading-indicator-loaded .lottieAnimation svg path,
  10251. .header-offer-loading-indicator--insider.header-offer-loading-indicator-loading .lottieAnimation svg path {
  10252. stroke: #f9dada;
  10253. animation: pcoiFontFade 3.3s linear
  10254. }
  10255. @keyframes backgroundFadeout {
  10256. 0% {
  10257. background-color: hsla(0, 0%, 100%, 0)
  10258. }
  10259. 45.5% {
  10260. background-color: #fff
  10261. }
  10262. 91% {
  10263. background-color: #fff
  10264. }
  10265. to {
  10266. background-color: hsla(0, 0%, 100%, 0)
  10267. }
  10268. }
  10269. .header-error-empty-state--right {
  10270. text-align: center;
  10271. max-width: 320px
  10272. }
  10273. @media(min-width:64em) {
  10274. .header-error-empty-state--right {
  10275. text-align: right
  10276. }
  10277. }
  10278. .site-footer {
  10279. margin-top: auto;
  10280. border-top: 1px solid #ddd;
  10281. background: #fff;
  10282. z-index: 3
  10283. }
  10284. .site-footer__top {
  10285. padding: 35px 22px;
  10286. display: flex;
  10287. flex-wrap: wrap;
  10288. align-items: flex-start;
  10289. justify-content: space-between
  10290. }
  10291. @media(min-width:48em) {
  10292. .site-footer__top {
  10293. padding: 70px 40px 40px
  10294. }
  10295. }
  10296. .site-footer__tagline {
  10297. color: #403840;
  10298. margin: 16px 0
  10299. }
  10300. @media(min-width:48em) {
  10301. .site-footer__tagline {
  10302. margin: 18px 0
  10303. }
  10304. }
  10305. .site-footer__tagline--bold {
  10306. font-weight: 700
  10307. }
  10308. .site-footer__links {
  10309. flex: 1 0 auto;
  10310. width: 50%;
  10311. padding-right: 24px
  10312. }
  10313. @media(min-width:48em) {
  10314. .site-footer__links {
  10315. flex: 1 0 auto;
  10316. width: 25%
  10317. }
  10318. }
  10319. @media(min-width:64em) {
  10320. .site-footer__links {
  10321. flex: 1 0 auto;
  10322. width: 25%
  10323. }
  10324. }
  10325. .site-footer__links-title {
  10326. margin-top: .8rem;
  10327. margin-bottom: 1.5rem
  10328. }
  10329. .site-footer__links-list {
  10330. margin: 0;
  10331. padding: 0;
  10332. list-style: none
  10333. }
  10334. .site-footer__links-list-item {
  10335. margin-bottom: 1rem
  10336. }
  10337. .site-footer__links-social {
  10338. flex: 1 0 auto;
  10339. width: 100%;
  10340. padding-bottom: 35px
  10341. }
  10342. @media(min-width:64em) {
  10343. .site-footer__links-social {
  10344. width: 25%
  10345. }
  10346. }
  10347. .site-footer__ada-chatbot {
  10348. text-align: left
  10349. }
  10350. .site-footer__logo svg {
  10351. width: 92px;
  10352. height: 40px
  10353. }
  10354. .site-footer__social-media {
  10355. padding: 0;
  10356. margin: 0;
  10357. list-style: none
  10358. }
  10359. .site-footer__social-media,
  10360. .site-footer__social-media-link-icon {
  10361. display: flex;
  10362. align-items: center
  10363. }
  10364. .site-footer__social-media-link-icon .sprite {
  10365. margin-right: 24px;
  10366. height: 16px
  10367. }
  10368. @media(min-width:64em) {
  10369. .site-footer__app-links {
  10370. padding-left: 50px
  10371. }
  10372. }
  10373. .site-footer__app-links-title {
  10374. margin-top: 0
  10375. }
  10376. .site-footer__app-links-link {
  10377. font-size: 16px
  10378. }
  10379. .site-footer__badges {
  10380. display: flex;
  10381. flex-direction: row;
  10382. justify-content: flex-start;
  10383. padding-top: 10px
  10384. }
  10385. .site-footer__badge-app {
  10386. flex-basis: 110px
  10387. }
  10388. .site-footer__badge-app:first-child {
  10389. margin-right: 20px
  10390. }
  10391. .site-footer__badge-app-svg {
  10392. pointer-events: none;
  10393. width: 100%;
  10394. height: 40px
  10395. }
  10396. .site-footer__bottom {
  10397. color: #ee3124;
  10398. -webkit-font-smoothing: antialiased;
  10399. padding: 0 20px
  10400. }
  10401. @media(min-width:48em) {
  10402. .site-footer__bottom {
  10403. padding: 0 40px
  10404. }
  10405. }
  10406. .site-footer__bottom-inner {
  10407. border-top: 1px solid rgba(248, 100, 87, .4);
  10408. display: flex;
  10409. flex-direction: column;
  10410. padding: 16px 0 32px
  10411. }
  10412. .site-footer__copyright {
  10413. color: #da291c
  10414. }
  10415. @media(min-width:48em) {
  10416. .site-footer__copyright {
  10417. display: flex;
  10418. justify-content: flex-start
  10419. }
  10420. }
  10421. .site-footer .locale-toggle {
  10422. margin-top: 8px;
  10423. color: #da291c;
  10424. align-items: flex-start
  10425. }
  10426. .site-footer .locale-toggle__link--clickable:hover {
  10427. opacity: .8
  10428. }
  10429. .accept-household-invitation-page .flow-tile {
  10430. margin-bottom: 60px
  10431. }
  10432. .accept-household-invitation-page__error {
  10433. margin-top: 60px
  10434. }
  10435. @media(min-width:48em) {
  10436. .accept-household-invitation-page__error {
  10437. margin-top: 120px
  10438. }
  10439. }
  10440. .accept-invitation-info {
  10441. max-width: none
  10442. }
  10443. @media(min-width:48em) {
  10444. .accept-invitation-info {
  10445. padding: 0 30px
  10446. }
  10447. }
  10448. .accept-invitation-info__title {
  10449. margin-top: 0
  10450. }
  10451. .accept-invitation-info__member {
  10452. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  10453. display: flex;
  10454. align-items: center;
  10455. min-height: 80px;
  10456. font-weight: 400;
  10457. padding: 24px;
  10458. background: #f0f0f0;
  10459. text-align: left;
  10460. margin-top: 8px
  10461. }
  10462. @media(min-width:48em) {
  10463. .accept-invitation-info__member {
  10464. min-height: 90px;
  10465. padding: 34px 34px 34px 60px
  10466. }
  10467. }
  10468. .accept-invitation-info__member .sprite {
  10469. min-width: 20px;
  10470. width: 20px;
  10471. height: 20px;
  10472. margin-right: 20px
  10473. }
  10474. @media(min-width:48em) {
  10475. .accept-invitation-info__member .sprite {
  10476. width: 24px;
  10477. height: 24px
  10478. }
  10479. }
  10480. .accept-invitation-info__member-placeholder-image {
  10481. min-width: 20px;
  10482. width: 20px;
  10483. height: 20px;
  10484. margin-right: 20px
  10485. }
  10486. @media(min-width:48em) {
  10487. .accept-invitation-info__member-placeholder-image {
  10488. width: 28px;
  10489. height: 28px
  10490. }
  10491. }
  10492. .accept-invitation-info__join-button,
  10493. .accept-invitation-info__skip-button {
  10494. display: block;
  10495. margin-left: auto;
  10496. margin-right: auto;
  10497. margin-top: 16px;
  10498. border: none;
  10499. cursor: pointer
  10500. }
  10501. .accept-invitation-info__join-button {
  10502. padding: 16px;
  10503. background: #191919;
  10504. color: #fff
  10505. }
  10506. .accept-invitation-info__skip-button {
  10507. background: none;
  10508. color: #ee3124
  10509. }
  10510. .accept-invitation-info__drawer {
  10511. margin: 30px auto 100px;
  10512. max-width: none
  10513. }
  10514. .accept-invitation-info__drawer .toggleable-drawer__close-button {
  10515. display: block
  10516. }
  10517. .accept-invitation-info__drawer .toggleable-drawer-content__title {
  10518. padding: 0 10px
  10519. }
  10520. .accept-invitation-info__drawer .toggleable-drawer--placeholder {
  10521. min-height: 40px;
  10522. padding: 10px
  10523. }
  10524. .accept-invitation-info__drawer:after {
  10525. content: "";
  10526. display: block;
  10527. height: 1px;
  10528. width: 100%;
  10529. background: #ddd;
  10530. margin-top: 50px;
  10531. position: absolute;
  10532. left: 0
  10533. }
  10534. .accept-invitation-info__placeholder-paragraph {
  10535. line-height: 1.9
  10536. }
  10537. .points-summary__container {
  10538. max-width: 450px;
  10539. margin: 0 auto
  10540. }
  10541. .points-summary__container:first-child {
  10542. margin-top: 50px
  10543. }
  10544. .points-summary__container:nth-child(2) {
  10545. margin-top: 30px
  10546. }
  10547. .points-summary__container--precombined .points-summary__inner:nth-child(2) {
  10548. font-weight: 700
  10549. }
  10550. .points-summary__container--precombined:after {
  10551. margin-top: 30px
  10552. }
  10553. .points-summary__inner {
  10554. display: flex;
  10555. flex-flow: row nowrap;
  10556. flex-wrap: wrap;
  10557. align-items: flex-start;
  10558. justify-content: space-between;
  10559. margin: 5px 0
  10560. }
  10561. .points-summary__title {
  10562. text-align: left
  10563. }
  10564. .points-summary__balance {
  10565. text-align: right
  10566. }
  10567. .points-summary__redeemable {
  10568. text-align: right;
  10569. flex-basis: 100%;
  10570. margin-top: 5px
  10571. }
  10572. .points-summary__container--precombined:after,
  10573. .points-summary__separator {
  10574. display: block;
  10575. content: "";
  10576. width: 100%;
  10577. height: 1px;
  10578. background: #ddd;
  10579. left: 0
  10580. }
  10581. .points-summary-tile__drawer {
  10582. margin-top: 30px;
  10583. max-width: none
  10584. }
  10585. @media(min-width:48em) {
  10586. .points-summary-tile__drawer {
  10587. margin: 30px 30px 10px
  10588. }
  10589. }
  10590. .points-summary-tile__drawer .toggleable-drawer__close-button {
  10591. display: block
  10592. }
  10593. .points-summary-tile__drawer .toggleable-drawer-content__title {
  10594. padding: 0 10px
  10595. }
  10596. .points-summary-tile__drawer:after {
  10597. display: none
  10598. }
  10599. .legal-page {
  10600. margin: 38px 0 80px
  10601. }
  10602. @media(min-width:48em) {
  10603. .legal-page {
  10604. margin-top: 70px
  10605. }
  10606. }
  10607. .legal-page__header {
  10608. margin-bottom: 35px
  10609. }
  10610. @media(min-width:48em) {
  10611. .legal-page__header {
  10612. display: flex
  10613. }
  10614. }
  10615. .legal-page__icon {
  10616. display: block;
  10617. margin: 0 auto 30px;
  10618. width: 130px;
  10619. height: 62px
  10620. }
  10621. @media(min-width:48em) {
  10622. .legal-page__icon {
  10623. margin: 0 0 0 auto;
  10624. width: 154px;
  10625. height: 74px;
  10626. order: 2;
  10627. flex-shrink: 0
  10628. }
  10629. }
  10630. @media(min-width:48em) {
  10631. .legal-page__header-content {
  10632. order: 1
  10633. }
  10634. }
  10635. .legal-page__header-content .loading-placeholder {
  10636. text-align: center
  10637. }
  10638. .legal-page__heading {
  10639. margin-top: 0;
  10640. text-align: center
  10641. }
  10642. .legal-page__subheading {
  10643. text-align: center
  10644. }
  10645. .legal-page__section {
  10646. background-color: #fff;
  10647. padding: 30px 18px;
  10648. margin-bottom: 10px
  10649. }
  10650. @media(min-width:48em) {
  10651. .legal-page__section {
  10652. padding: 40px;
  10653. margin-bottom: 20px
  10654. }
  10655. }
  10656. .legal-page__section-title {
  10657. margin-top: 0
  10658. }
  10659. .legal-page__body {
  10660. font-size: .875rem;
  10661. line-height: 1.571428571
  10662. }
  10663. @media(min-width:48em) {
  10664. .legal-page__body {
  10665. line-height: 1.857142857
  10666. }
  10667. }
  10668. .legal-page__alpha-list {
  10669. list-style-type: lower-alpha
  10670. }
  10671. .legal-page__custom-ol {
  10672. list-style-type: none;
  10673. position: relative
  10674. }
  10675. .legal-page__custom-ol li:before {
  10676. content: attr(data-section-number);
  10677. position: absolute;
  10678. left: 0;
  10679. width: 40px;
  10680. padding-right: 8px;
  10681. text-align: right
  10682. }
  10683. .legal-page h3 {
  10684. text-decoration: underline
  10685. }
  10686. .legal-page__indented-paragraph {
  10687. margin-right: 20px;
  10688. margin-left: 20px
  10689. }
  10690. @media(min-width:48em) {
  10691. .legal-page__indented-paragraph {
  10692. margin-right: 40px;
  10693. margin-left: 40px
  10694. }
  10695. }
  10696. @media(max-width:34.365em) {
  10697. .social-legal__en .utility-header__title {
  10698. font-size: 1.6rem
  10699. }
  10700. }
  10701. .social-legal__fr .utility-header__title {
  10702. font-size: 1.6rem
  10703. }
  10704. @media(min-width:34.375em) {
  10705. .social-legal__fr .utility-header__title {
  10706. font-size: 2rem
  10707. }
  10708. }
  10709. @media(min-width:48em) {
  10710. .social-legal__fr .utility-header__title {
  10711. font-size: 2.5rem
  10712. }
  10713. }
  10714. .error-tile {
  10715. display: flex;
  10716. justify-content: flex-start;
  10717. align-items: flex-start;
  10718. text-align: left;
  10719. color: #191919;
  10720. fill: #191919
  10721. }
  10722. .error-tile__sprite {
  10723. flex-shrink: 0;
  10724. width: 24px;
  10725. height: 24px;
  10726. margin-right: 14px
  10727. }
  10728. .error-tile--light {
  10729. color: #fff;
  10730. fill: #fff
  10731. }
  10732. .error-tile--light .error-tile__reload-button,
  10733. .error-tile--light .error-tile__reload-button:hover {
  10734. color: #fff
  10735. }
  10736. .error-offer-tile {
  10737. text-align: left;
  10738. background: #f4f1f6;
  10739. padding: 30px 40px 20px;
  10740. border: 1px solid #f4f1f6;
  10741. box-sizing: border-box;
  10742. border-radius: 8px
  10743. }
  10744. @media(min-width:64em) {
  10745. .error-offer-tile {
  10746. max-width: 780px;
  10747. margin: 0 auto
  10748. }
  10749. }
  10750. @media(min-width:48em) {
  10751. .error-offer-tile {
  10752. max-width: 688px;
  10753. margin: 0 auto
  10754. }
  10755. }
  10756. @media(min-width:20em) {
  10757. .error-offer-tile {
  10758. padding: 18px
  10759. }
  10760. }
  10761. @media(min-width:64em) {
  10762. .error-offer-tile {
  10763. min-width: 780px
  10764. }
  10765. }
  10766. .error-offer-tile__heart-broken-icon {
  10767. margin-left: 7.78px;
  10768. margin-bottom: 27px
  10769. }
  10770. .error-offer-tile__content-header {
  10771. color: #655c6c;
  10772. margin-bottom: 16px
  10773. }
  10774. .error-offer-tile__content-body {
  10775. white-space: pre-line;
  10776. color: #403840
  10777. }
  10778. .loading-bar__container {
  10779. flex: 1;
  10780. display: flex;
  10781. align-items: center;
  10782. flex-direction: column;
  10783. justify-content: center;
  10784. min-height: 300px
  10785. }
  10786. @keyframes shine-lines {
  10787. 0% {
  10788. background-position: 0
  10789. }
  10790. to {
  10791. background-position: 275px
  10792. }
  10793. }
  10794. .loading-placeholder {
  10795. cursor: default;
  10796. margin-bottom: 1rem
  10797. }
  10798. .loading-placeholder:last-child {
  10799. margin-bottom: 0
  10800. }
  10801. .loading-placeholder-image,
  10802. .loading-placeholder__inner {
  10803. background-image: linear-gradient(90deg, #f4f1f6, #ebe5ee 40px, #f4f1f6 80px);
  10804. background-size: 275px;
  10805. display: inline-block;
  10806. max-width: 100%;
  10807. color: transparent;
  10808. animation: shine-lines 1.6s linear infinite;
  10809. line-height: 1rem
  10810. }
  10811. @media(min-width:48em) {
  10812. .loading-placeholder-image,
  10813. .loading-placeholder__inner {
  10814. line-height: 1.25rem
  10815. }
  10816. }
  10817. .loading-placeholder-image--black,
  10818. .loading-placeholder__inner--black {
  10819. background-image: linear-gradient(90deg, #d8d4db, #cecbd1 40px, #d8d4db 80px)
  10820. }
  10821. .loading-placeholder-image--red,
  10822. .loading-placeholder__inner--red {
  10823. background-image: linear-gradient(90deg, #fc827a, #fc8e87 40px, #fc827a 80px)
  10824. }
  10825. .loading-placeholder__text {
  10826. -webkit-user-select: none;
  10827. -moz-user-select: none;
  10828. user-select: none;
  10829. color: transparent
  10830. }
  10831. .loading-placeholder__text:after {
  10832. content: "x"
  10833. }
  10834. .loading-placeholder__text::-moz-selection {
  10835. pointer-events: none;
  10836. color: transparent
  10837. }
  10838. .loading-placeholder__text::selection {
  10839. pointer-events: none;
  10840. color: transparent
  10841. }
  10842. .circle-loader {
  10843. width: 70px;
  10844. height: 70px;
  10845. border-radius: 50%;
  10846. overflow: hidden
  10847. }
  10848. .circle-loader__indicator {
  10849. position: relative;
  10850. top: 0;
  10851. left: 0;
  10852. width: 100%;
  10853. height: 100%;
  10854. border-radius: 50%;
  10855. border: 7px solid #fbf1f1;
  10856. border-top-color: #f9dada;
  10857. animation: spin 1.3s linear infinite
  10858. }
  10859. .circle-loader__indicator--left,
  10860. .circle-loader__indicator--right {
  10861. height: 10px;
  10862. width: 7px;
  10863. background-color: #f9dada;
  10864. border-radius: 40px;
  10865. position: absolute
  10866. }
  10867. .circle-loader__indicator--right {
  10868. top: 0;
  10869. right: 3px;
  10870. transform: rotate(-45deg)
  10871. }
  10872. .circle-loader__indicator--left {
  10873. top: 0;
  10874. left: 3px;
  10875. transform: rotate(45deg)
  10876. }
  10877. .loading-screen {
  10878. min-height: calc(100vh - 80px);
  10879. display: flex;
  10880. flex-direction: column;
  10881. justify-content: center;
  10882. align-items: center
  10883. }
  10884. @keyframes spin {
  10885. 0% {
  10886. transform: rotate(0deg)
  10887. }
  10888. to {
  10889. transform: rotate(1turn)
  10890. }
  10891. }
  10892. .login-error {
  10893. display: flex;
  10894. min-height: calc(100vh - 84px);
  10895. flex-direction: column;
  10896. background: #ffcee1;
  10897. padding: 20px
  10898. }
  10899. .login-error__information {
  10900. flex: 1
  10901. }
  10902. .login-error__image {
  10903. flex: 0 0 auto;
  10904. margin-bottom: 40px
  10905. }
  10906. .login-error__image img {
  10907. max-width: 50%
  10908. }
  10909. @media(min-width:34.375em) {
  10910. .login-error__image img {
  10911. max-width: 100%
  10912. }
  10913. }
  10914. .login-error__title {
  10915. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  10916. font-size: 3.125rem;
  10917. line-height: 1.1;
  10918. color: #191919;
  10919. margin-bottom: 30px;
  10920. margin-top: 0
  10921. }
  10922. .login-error__paragraph {
  10923. font-size: 1.1rem;
  10924. line-height: 1.5;
  10925. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  10926. font-weight: 400;
  10927. color: #191919
  10928. }
  10929. .login-error__button {
  10930. display: block;
  10931. max-width: 220px
  10932. }
  10933. @media(min-width:34.375em) {
  10934. .login-error {
  10935. flex-direction: row;
  10936. align-items: center;
  10937. justify-content: center
  10938. }
  10939. .login-error__information {
  10940. padding: 0 50px
  10941. }
  10942. .login-error__image {
  10943. display: flex;
  10944. justify-content: center;
  10945. flex: 1
  10946. }
  10947. }
  10948. .maximize-points {
  10949. background-color: #f0f0f0;
  10950. padding: 0 0 20px
  10951. }
  10952. @media(min-width:48em) {
  10953. .maximize-points {
  10954. padding: 80px 0
  10955. }
  10956. }
  10957. .maximize-points .checklist-container {
  10958. display: block;
  10959. border-left: none;
  10960. padding-bottom: 0
  10961. }
  10962. @media(min-width:48em) {
  10963. .maximize-points .checklist-container {
  10964. margin: 0 auto;
  10965. max-width: 640px
  10966. }
  10967. }
  10968. .maximize-points .checklist-subscription {
  10969. padding: 24px 20px
  10970. }
  10971. .maximize-points .checklist__item-wrapper {
  10972. background: #fff
  10973. }
  10974. .maximize-points .checklist__item-wrapper:last-child {
  10975. border-bottom: none
  10976. }
  10977. .maximize-points .checklist-complete {
  10978. margin: 40px 0 0;
  10979. border-bottom: none
  10980. }
  10981. .maximize-points .checklist-complete:before {
  10982. width: 100%;
  10983. margin: -40px 0 0;
  10984. position: absolute;
  10985. left: 0
  10986. }
  10987. .maximize-points .checklist-complete__inner {
  10988. padding: 40px 20px;
  10989. margin: 0 auto;
  10990. max-width: 450px
  10991. }
  10992. .menu {
  10993. position: fixed;
  10994. top: 0;
  10995. left: 0;
  10996. right: 0;
  10997. z-index: 100;
  10998. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14)
  10999. }
  11000. .menu-mobile {
  11001. align-items: center
  11002. }
  11003. @media(min-width:80em) {
  11004. .menu-mobile {
  11005. max-width: none
  11006. }
  11007. }
  11008. @media(min-width:48em) {
  11009. body {
  11010. overflow: visible !important
  11011. }
  11012. }
  11013. .menu-desktop {
  11014. height: 80px;
  11015. padding: 20px 40px;
  11016. display: flex;
  11017. align-items: center;
  11018. justify-content: space-between;
  11019. font-weight: 700;
  11020. background-color: #fff
  11021. }
  11022. .menu-desktop__logo.sprite,
  11023. .menu-desktop__logo .sprite {
  11024. max-width: 94px;
  11025. height: 40px
  11026. }
  11027. .menu-desktop ul {
  11028. list-style: none;
  11029. padding: 0
  11030. }
  11031. .menu-desktop__account-list-item,
  11032. .menu-desktop__list,
  11033. .menu-desktop__list-item,
  11034. .menu-desktop__submenu,
  11035. .menu-desktop__submenu .link {
  11036. -webkit-font-smoothing: antialiased;
  11037. text-decoration: none;
  11038. display: flex;
  11039. padding: 0;
  11040. align-items: center;
  11041. color: #157a77
  11042. }
  11043. .menu-desktop__account-list-item:hover,
  11044. .menu-desktop__list-item:hover,
  11045. .menu-desktop__list:hover,
  11046. .menu-desktop__submenu .link:hover,
  11047. .menu-desktop__submenu:hover {
  11048. cursor: pointer
  11049. }
  11050. .menu-desktop__list,
  11051. .menu-desktop__list-item,
  11052. .menu-desktop__submenu,
  11053. .menu-desktop__submenu .link {
  11054. color: #157a77
  11055. }
  11056. .menu-desktop__account-list-item {
  11057. color: #403840
  11058. }
  11059. .menu-desktop__logo-container {
  11060. width: 228px
  11061. }
  11062. .menu-desktop__account-list-item,
  11063. .menu-desktop__list-item {
  11064. padding: 10px 16px 9px;
  11065. border: 2px solid #fff;
  11066. border-radius: 24px;
  11067. text-decoration: none
  11068. }
  11069. .menu-desktop__list-item {
  11070. margin: 0 8px;
  11071. transition: border-color .1s, color .1s;
  11072. white-space: nowrap
  11073. }
  11074. .menu-desktop__list-item--small {
  11075. font-size: 14px
  11076. }
  11077. .menu-desktop__list-item:focus:not(.menu-desktop__list-item--selected),
  11078. .menu-desktop__list-item:hover {
  11079. border-color: #615395;
  11080. color: #615395;
  11081. background: #f4f1f6
  11082. }
  11083. .menu-desktop__list-item:active {
  11084. border-color: #403840;
  11085. color: #403840
  11086. }
  11087. .menu-desktop__list-item--selected,
  11088. .menu-desktop__list-item--selected:hover {
  11089. background: #157a77;
  11090. border: 1px solid #157a77;
  11091. color: #fff
  11092. }
  11093. .menu-desktop__list {
  11094. justify-content: flex-end
  11095. }
  11096. .menu-desktop__list--anonymous {
  11097. flex-basis: 228px
  11098. }
  11099. .menu-desktop__list--authenticated {
  11100. flex-basis: 165px
  11101. }
  11102. .menu-desktop__account-list-item {
  11103. position: relative;
  11104. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  11105. transition: box-shadow .3s;
  11106. background: #fff
  11107. }
  11108. .menu-desktop__account-list-item .sprite {
  11109. width: 14px;
  11110. height: 14px;
  11111. transform: rotate(90deg);
  11112. fill: #157a77;
  11113. margin-left: 9px
  11114. }
  11115. .menu-desktop__account-list-item--expanded {
  11116. box-shadow: 0 4px 5px rgba(158, 147, 166, .2), 0 3px 14px rgba(158, 147, 166, .12), 0 8px 10px rgba(158, 147, 166, .14)
  11117. }
  11118. .menu-desktop__account-list-item--expanded .sprite {
  11119. transform: rotate(270deg)
  11120. }
  11121. .menu-desktop__account-list-item:hover {
  11122. box-shadow: 0 4px 5px rgba(158, 147, 166, .2), 0 3px 14px rgba(158, 147, 166, .12), 0 8px 10px rgba(158, 147, 166, .14)
  11123. }
  11124. .menu-desktop__account-list-item--anonymous {
  11125. margin-left: 16px
  11126. }
  11127. .menu-desktop__account-list-item--anonymous:hover {
  11128. color: #403840
  11129. }
  11130. .menu-desktop__submenu {
  11131. position: absolute;
  11132. flex-direction: column;
  11133. top: 75px;
  11134. right: 40px;
  11135. min-width: 210px;
  11136. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  11137. background-color: #fff;
  11138. align-items: flex-start;
  11139. border-radius: 4px
  11140. }
  11141. .menu-desktop__submenu li {
  11142. width: 100%
  11143. }
  11144. .menu-desktop__submenu--logout {
  11145. border-top: 1px solid #9e93a6
  11146. }
  11147. .menu-desktop__submenu .link {
  11148. display: flex;
  11149. align-items: center;
  11150. padding: 15px 22px;
  11151. transition: background-color .1s, color .1s
  11152. }
  11153. .menu-desktop__submenu .link .sprite {
  11154. margin-right: 22px;
  11155. max-width: 22px;
  11156. fill: #403840;
  11157. transition: fill .1s
  11158. }
  11159. .menu-desktop__submenu .link:focus,
  11160. .menu-desktop__submenu .link:hover {
  11161. background-color: #f4f1f6;
  11162. color: #615395
  11163. }
  11164. .menu-desktop__submenu .link:focus .sprite,
  11165. .menu-desktop__submenu .link:hover .sprite {
  11166. fill: #615395
  11167. }
  11168. .menu-desktop__submenu .link:active {
  11169. color: #403840
  11170. }
  11171. .menu-desktop__submenu .link:active .sprite {
  11172. fill: #403840
  11173. }
  11174. @media(max-width:64.0525em) {
  11175. .menu-desktop {
  11176. display: none;
  11177. visibility: hidden
  11178. }
  11179. }
  11180. .menu-mobile {
  11181. max-width: 1280px;
  11182. margin-left: auto;
  11183. margin-right: auto;
  11184. padding-left: 20px;
  11185. padding-right: 20px;
  11186. height: 55px;
  11187. display: flex;
  11188. align-items: stretch;
  11189. justify-content: space-between;
  11190. flex-flow: row nowrap;
  11191. background: #fff
  11192. }
  11193. @media(min-width:48em) {
  11194. .menu-mobile {
  11195. padding-left: 40px;
  11196. padding-right: 40px
  11197. }
  11198. }
  11199. @media(min-width:64.0625em) {
  11200. .menu-mobile {
  11201. display: none;
  11202. visibility: hidden
  11203. }
  11204. }
  11205. .menu-mobile__open {
  11206. background: transparent;
  11207. border: 0;
  11208. padding: 0 20px;
  11209. margin-left: -20px
  11210. }
  11211. .menu-mobile__open .sprite {
  11212. width: 18px;
  11213. height: 14px;
  11214. fill: #157a77
  11215. }
  11216. .menu-mobile__logo-wrapper {
  11217. flex-grow: 1;
  11218. display: flex;
  11219. justify-content: center;
  11220. align-items: center;
  11221. margin-right: 40px
  11222. }
  11223. .menu-mobile__logo {
  11224. padding: 12px
  11225. }
  11226. .menu-mobile__logo .sprite {
  11227. width: 72px;
  11228. height: 30px
  11229. }
  11230. @media(min-width:64.0625em) {
  11231. .menu-panel {
  11232. display: none;
  11233. visibility: hidden
  11234. }
  11235. }
  11236. .menu-panel ul {
  11237. list-style: none
  11238. }
  11239. .menu-panel__link-group {
  11240. border-bottom: 1px solid #ddd;
  11241. margin: 0 0 24px;
  11242. padding: 16px 0 24px
  11243. }
  11244. .menu-panel__link-group--logout {
  11245. margin: 0;
  11246. padding: 0
  11247. }
  11248. .menu-panel__safari-iphonex {
  11249. margin-bottom: 100px
  11250. }
  11251. .menu-panel__safari {
  11252. margin-bottom: 175px
  11253. }
  11254. .menu-panel__chrome-android {
  11255. margin-bottom: 48px
  11256. }
  11257. .menu-panel__mask {
  11258. position: fixed;
  11259. background-color: rgba(0, 0, 0, .7);
  11260. top: 0;
  11261. right: 0;
  11262. bottom: 0;
  11263. left: 0;
  11264. visibility: hidden;
  11265. opacity: 0;
  11266. transition: .15s ease
  11267. }
  11268. .menu-panel__inner {
  11269. display: none;
  11270. position: absolute;
  11271. width: 300px;
  11272. height: 100vh;
  11273. background: #f0f0f0;
  11274. top: 0;
  11275. left: 0;
  11276. transition: transform .3s cubic-bezier(.4, 0, .2, 1)
  11277. }
  11278. .menu-panel__header {
  11279. display: flex;
  11280. justify-content: space-between;
  11281. align-items: stretch;
  11282. height: 56px;
  11283. border-bottom: 1px solid #ddd;
  11284. background: #fff
  11285. }
  11286. .menu-panel__logo {
  11287. display: flex;
  11288. align-items: center;
  11289. padding: 0 18px
  11290. }
  11291. .menu-panel__logo .sprite {
  11292. width: 72px;
  11293. height: 30px
  11294. }
  11295. .menu-panel__close {
  11296. padding: 0 18px;
  11297. border: 0;
  11298. background: transparent
  11299. }
  11300. .menu-panel__close .sprite {
  11301. margin: auto;
  11302. fill: #585858
  11303. }
  11304. .menu-panel__main-content-wrapper {
  11305. height: calc(100vh - 56px);
  11306. overflow: auto;
  11307. padding-bottom: 20px
  11308. }
  11309. .menu-panel__main-content--maximize-points {
  11310. border-bottom: 1px solid #ddd;
  11311. padding: 24px 20px
  11312. }
  11313. .menu-panel__main-content--maximize-points p {
  11314. margin: 8px 0 0
  11315. }
  11316. .menu-panel__section-title {
  11317. padding: 0 20px;
  11318. margin: 0
  11319. }
  11320. .menu-panel__section-title--loadToCard {
  11321. margin-top: 24px
  11322. }
  11323. .menu-panel__main-link {
  11324. width: 100%;
  11325. display: flex;
  11326. justify-content: flex-start;
  11327. align-items: center;
  11328. text-align: left;
  11329. height: 40px;
  11330. padding: 0 20px;
  11331. color: #191919;
  11332. text-decoration: none;
  11333. transition: color .1s, border-left-color .2s
  11334. }
  11335. .menu-panel__main-link .sprite {
  11336. margin-right: 12px;
  11337. fill: #191919;
  11338. transition: fill .1s
  11339. }
  11340. .menu-panel__main-link:focus,
  11341. .menu-panel__main-link:hover {
  11342. background-color: #fff;
  11343. border-left: 4px solid #ee3124;
  11344. color: #ee3124;
  11345. outline: 0
  11346. }
  11347. .menu-panel__main-link:focus .sprite,
  11348. .menu-panel__main-link:hover .sprite {
  11349. fill: #ee3124
  11350. }
  11351. .menu-panel__secondary-content {
  11352. padding: 0 20px;
  11353. margin: 24px 0
  11354. }
  11355. .menu-panel__secondary-content .locale-toggle {
  11356. font-size: .875rem
  11357. }
  11358. .menu-panel__secondary-link-wrapper {
  11359. margin-bottom: 16px
  11360. }
  11361. .menu-panel__secondary-link-wrapper:last-child {
  11362. margin-bottom: 24px
  11363. }
  11364. .menu-panel__pill-counter {
  11365. display: inline-block;
  11366. margin-left: auto;
  11367. width: 20px;
  11368. height: 20px;
  11369. border-radius: 50%;
  11370. font-size: .75rem;
  11371. line-height: 22px;
  11372. color: #fff;
  11373. background: #ee3124;
  11374. text-align: center
  11375. }
  11376. .menu-panel--anonymous .menu-panel__menu-buttons {
  11377. padding: 30px 20px;
  11378. border-bottom: 1px solid #ddd
  11379. }
  11380. .menu-panel--anonymous .menu-panel__login {
  11381. display: block;
  11382. margin-bottom: 20px
  11383. }
  11384. .menu-panel--anonymous .menu-panel__register {
  11385. display: block
  11386. }
  11387. .menu-panel--open {
  11388. position: absolute;
  11389. top: 0;
  11390. left: 0;
  11391. right: 0;
  11392. height: 100vh;
  11393. overflow: hidden
  11394. }
  11395. .menu-panel--open .menu-panel__inner {
  11396. display: block;
  11397. transition: transform .3s cubic-bezier(.4, 0, .2, 1);
  11398. transform: translateZ(0)
  11399. }
  11400. .menu-panel--open .menu-panel__mask {
  11401. transition: .3s ease;
  11402. visibility: visible;
  11403. opacity: 1
  11404. }
  11405. .menu-panel--opening .menu-panel__inner {
  11406. transform: translateZ(0)
  11407. }
  11408. .menu-panel--closed .menu-panel__inner {
  11409. transform: translate3d(-300px, 0, 0)
  11410. }
  11411. .menu-panel--closing .menu-panel__inner {
  11412. transition: transform .15s ease-in;
  11413. transform: translate3d(-300px, 0, 0)
  11414. }
  11415. .menu-panel .menu-panel__inner,
  11416. .menu-panel .menu-panel__mask {
  11417. will-change: auto
  11418. }
  11419. .menu-panel--will-change .menu-panel__inner {
  11420. display: block;
  11421. will-change: transform
  11422. }
  11423. .menu-panel--will-change .menu-panel__mask {
  11424. will-change: opacity
  11425. }
  11426. .promoted-action {
  11427. background-color: #f0f0f0
  11428. }
  11429. .promoted-action__inner {
  11430. display: flex;
  11431. align-items: center;
  11432. min-height: 100px;
  11433. padding-top: 10px;
  11434. padding-bottom: 10px
  11435. }
  11436. @media(min-width:48em) {
  11437. .promoted-action__inner {
  11438. padding-top: 20px;
  11439. padding-bottom: 20px
  11440. }
  11441. }
  11442. .promoted-action__icon {
  11443. flex-shrink: 0;
  11444. margin-right: 20px
  11445. }
  11446. @media(min-width:48em) {
  11447. .promoted-action__icon {
  11448. margin-right: 30px
  11449. }
  11450. }
  11451. @media(min-width:64em) {
  11452. .promoted-action__icon {
  11453. margin-left: 60px;
  11454. margin-right: 48px
  11455. }
  11456. }
  11457. .promoted-action__text-group {
  11458. flex-grow: 1
  11459. }
  11460. @media(min-width:48em) {
  11461. .promoted-action__text-group {
  11462. margin-right: 30px
  11463. }
  11464. }
  11465. .promoted-action__text-group-decline {
  11466. position: relative;
  11467. padding: 0
  11468. }
  11469. @media(min-width:48em) {
  11470. .promoted-action__text-group-decline {
  11471. display: none
  11472. }
  11473. }
  11474. .promoted-action__title {
  11475. margin: 0
  11476. }
  11477. .promoted-action__title a {
  11478. color: inherit;
  11479. text-decoration: none
  11480. }
  11481. .promoted-action__message {
  11482. display: none
  11483. }
  11484. @media(min-width:48em) {
  11485. .promoted-action__message {
  11486. display: block
  11487. }
  11488. }
  11489. .promoted-action__link-group {
  11490. display: none;
  11491. text-align: center
  11492. }
  11493. @media(min-width:48em) {
  11494. .promoted-action__link-group {
  11495. display: block
  11496. }
  11497. }
  11498. @media(min-width:64em) {
  11499. .promoted-action__link-group {
  11500. margin-right: 60px
  11501. }
  11502. }
  11503. .promoted-action__link {
  11504. display: block;
  11505. margin-bottom: 10px
  11506. }
  11507. .promoted-action__decline {
  11508. background: transparent;
  11509. border: 0;
  11510. padding: 0
  11511. }
  11512. .promoted-action__caret {
  11513. padding: 10px;
  11514. margin-right: -10px;
  11515. line-height: 0
  11516. }
  11517. @media(min-width:48em) {
  11518. .promoted-action__caret {
  11519. display: none
  11520. }
  11521. }
  11522. .promoted-action__caret .sprite {
  11523. fill: #ee3124;
  11524. width: 24px;
  11525. height: 24px
  11526. }
  11527. .promoted-action--casl-opt-in .promoted-action__icon {
  11528. width: 40px;
  11529. height: 40px;
  11530. margin-right: 20px
  11531. }
  11532. @media(min-width:48em) {
  11533. .promoted-action--casl-opt-in .promoted-action__icon {
  11534. width: 50px;
  11535. height: 50px;
  11536. margin-right: 40px
  11537. }
  11538. }
  11539. .promoted-action--link-pcf .promoted-action__link,
  11540. .promoted-action--link-pcf .type-brandname {
  11541. white-space: normal
  11542. }
  11543. .promoted-action--esso-rewards .promoted-action__icon {
  11544. width: 120px;
  11545. height: 70px
  11546. }
  11547. @media(min-width:48em) {
  11548. .promoted-action--esso-rewards .promoted-action__icon {
  11549. width: 160px;
  11550. height: 80px;
  11551. margin-right: 20px
  11552. }
  11553. }
  11554. .system-message {
  11555. position: fixed;
  11556. top: 55px;
  11557. right: 0;
  11558. left: 0;
  11559. z-index: 99;
  11560. background: #f0f0f0
  11561. }
  11562. @media(min-width:64.0625em) {
  11563. .system-message {
  11564. top: 80px
  11565. }
  11566. }
  11567. .system-message--offers-expiring {
  11568. top: auto;
  11569. position: relative
  11570. }
  11571. .system-message:after {
  11572. content: "";
  11573. position: absolute;
  11574. left: 0;
  11575. right: 0;
  11576. bottom: -1px;
  11577. height: 1px;
  11578. background: rgba(0, 0, 0, .15)
  11579. }
  11580. .system-message__inner {
  11581. display: flex;
  11582. align-items: center;
  11583. padding-top: 24px;
  11584. padding-bottom: 24px;
  11585. width: 100%;
  11586. max-width: 792px;
  11587. position: relative;
  11588. margin: 0 auto
  11589. }
  11590. @media(min-width:48em) {
  11591. .system-message__inner {
  11592. padding-top: 32px;
  11593. padding-bottom: 32px
  11594. }
  11595. }
  11596. .system-message__icon-container {
  11597. display: flex;
  11598. align-items: center;
  11599. justify-content: center;
  11600. padding: 8px;
  11601. border-radius: 50%;
  11602. background-color: #fff
  11603. }
  11604. @media(min-width:48em) {
  11605. .system-message__icon-container {
  11606. padding: 0;
  11607. width: 60px;
  11608. height: 60px
  11609. }
  11610. }
  11611. .system-message__icon {
  11612. flex-shrink: 0;
  11613. width: 25px;
  11614. height: 25px
  11615. }
  11616. @media(min-width:48em) {
  11617. .system-message__icon {
  11618. width: 37px;
  11619. height: 37px
  11620. }
  11621. }
  11622. .system-message__message {
  11623. flex-grow: 1;
  11624. padding: 0 24px
  11625. }
  11626. .system-message__message p {
  11627. margin: 0
  11628. }
  11629. .system-message__error-reload-button {
  11630. margin-top: 8px;
  11631. color: #157a77
  11632. }
  11633. .system-message__close-button {
  11634. position: absolute;
  11635. right: 0;
  11636. top: 18px;
  11637. cursor: pointer;
  11638. border: 0;
  11639. opacity: .6;
  11640. margin-left: 18px
  11641. }
  11642. @media(min-width:48em) {
  11643. .system-message__close-button {
  11644. align-self: center;
  11645. margin-left: 0
  11646. }
  11647. }
  11648. .system-message__close-button:hover {
  11649. opacity: 1
  11650. }
  11651. .system-message__close-button .sprite {
  11652. width: 16px;
  11653. height: 16px;
  11654. fill: #191919
  11655. }
  11656. .system-message--link {
  11657. background: #fdf0f0
  11658. }
  11659. .flyer-result,
  11660. .offer {
  11661. position: relative;
  11662. background: #fff;
  11663. margin-bottom: 18px;
  11664. border-radius: 8px;
  11665. border: 1px solid #efeef1;
  11666. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  11667. transition: box-shadow .3s ease-in-out
  11668. }
  11669. .flyer-result:focus-within:not(.offer--shadow-disabled):not(.offer-savedempty):not(.offer--carousel--upcoming),
  11670. .flyer-result:focus:not(.offer--shadow-disabled):not(.offer-savedempty):not(.offer--carousel--upcoming),
  11671. .flyer-result:hover:not(.offer--shadow-disabled):not(.offer-savedempty):not(.offer--carousel--upcoming),
  11672. .offer:focus-within:not(.offer--shadow-disabled):not(.offer-savedempty):not(.offer--carousel--upcoming),
  11673. .offer:focus:not(.offer--shadow-disabled):not(.offer-savedempty):not(.offer--carousel--upcoming),
  11674. .offer:hover:not(.offer--shadow-disabled):not(.offer-savedempty):not(.offer--carousel--upcoming) {
  11675. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  11676. cursor: pointer
  11677. }
  11678. @media(min-width:48em) {
  11679. .flyer-result,
  11680. .offer {
  11681. margin-bottom: 26px
  11682. }
  11683. }
  11684. .offer--carousel {
  11685. margin: 0;
  11686. padding-bottom: 0;
  11687. overflow: hidden;
  11688. height: 100%;
  11689. border-radius: 16px
  11690. }
  11691. .offer--carousel .offer-description-container {
  11692. width: 100%;
  11693. display: flex;
  11694. flex-direction: column;
  11695. flex-grow: 1;
  11696. margin: 0 auto 8px;
  11697. overflow: hidden
  11698. }
  11699. .offer--carousel .offer-description-container .offer-description {
  11700. color: #655c6c;
  11701. display: -webkit-box;
  11702. -webkit-line-clamp: 4;
  11703. -webkit-box-orient: vertical;
  11704. overflow: hidden;
  11705. margin: 0
  11706. }
  11707. @media(min-width:48em) {
  11708. .offer--carousel .offer-description-container .offer-description {
  11709. -webkit-line-clamp: 2
  11710. }
  11711. }
  11712. .offer--carousel .offer-footer-date {
  11713. color: #655c6c;
  11714. display: flex;
  11715. flex-direction: column;
  11716. text-align: left;
  11717. font-style: normal;
  11718. margin: auto auto 15px 15px
  11719. }
  11720. @media(min-width:48em) {
  11721. .offer--carousel .offer-footer-date {
  11722. margin-bottom: 16px
  11723. }
  11724. }
  11725. @media(min-width:64em) {
  11726. .offer--carousel .offer-footer-date {
  11727. margin-bottom: 13px
  11728. }
  11729. }
  11730. .offer--carousel--upcoming,
  11731. .offer--carousel--upcoming .offer-section {
  11732. cursor: auto
  11733. }
  11734. .offer--carousel--upcoming .offer-footer-date {
  11735. margin-bottom: 21px
  11736. }
  11737. .offer--carousel--upcoming .offer__reward--carousel {
  11738. color: #655c6c
  11739. }
  11740. .offer-standalone {
  11741. margin-bottom: 52px
  11742. }
  11743. .offer-standalone .offer__reward {
  11744. color: #ac342a
  11745. }
  11746. .offer-standalone__heading {
  11747. margin: 0 auto 16px;
  11748. max-width: 688px
  11749. }
  11750. @media(min-width:48em) {
  11751. .offer-standalone__heading {
  11752. margin: 0 auto 23.5px
  11753. }
  11754. }
  11755. @media(min-width:64em) {
  11756. .offer-standalone__heading {
  11757. max-width: 780px
  11758. }
  11759. }
  11760. .offer-standalone .offer-description-container {
  11761. color: #403840
  11762. }
  11763. .offer__top {
  11764. cursor: pointer;
  11765. width: 100%
  11766. }
  11767. .offer__top--placeholder {
  11768. cursor: default
  11769. }
  11770. .offer__image--hero {
  11771. width: 100%;
  11772. max-width: 100%;
  11773. max-height: 160px;
  11774. display: flex;
  11775. justify-content: center;
  11776. align-items: center
  11777. }
  11778. .offer__image-element {
  11779. display: block;
  11780. width: 100%;
  11781. max-width: 100%
  11782. }
  11783. .offer__image--carousel {
  11784. display: flex;
  11785. max-width: 100%;
  11786. margin: 0;
  11787. justify-content: center
  11788. }
  11789. .offer__image--carousel img {
  11790. width: 100%;
  11791. max-width: 100%;
  11792. position: absolute;
  11793. left: 50%;
  11794. transform: translate(-50%)
  11795. }
  11796. .offer__image--faded {
  11797. opacity: .5
  11798. }
  11799. .offer__reward {
  11800. color: #f86457
  11801. }
  11802. .flyer-result--disabled .offer__reward,
  11803. .offer--disabled .offer__reward,
  11804. .offers-preview .offer--invalid .offer__reward {
  11805. color: #403840
  11806. }
  11807. .offer--faded .offer__reward {
  11808. color: #655c6c
  11809. }
  11810. .offer__reward--earned {
  11811. color: #615395
  11812. }
  11813. .offer__reward--carousel {
  11814. color: #ac342a;
  11815. margin-bottom: 8px;
  11816. display: -webkit-box;
  11817. overflow: hidden;
  11818. -webkit-line-clamp: 2;
  11819. -webkit-box-orient: vertical
  11820. }
  11821. .offer__accelerator-container .sprite {
  11822. height: 1em;
  11823. width: 1.541666667em;
  11824. margin-right: 8px;
  11825. position: relative;
  11826. bottom: -4px
  11827. }
  11828. @media(min-width:48em) {
  11829. .offer__accelerator-container .sprite {
  11830. bottom: -5px
  11831. }
  11832. }
  11833. .offer__text {
  11834. margin-top: 8px;
  11835. width: 100%
  11836. }
  11837. .offer--unearnable .continuity-offer__top-inner {
  11838. padding: 20px 30px
  11839. }
  11840. .offer--unearnable .hero-continuity-offer__content-group {
  11841. min-height: auto
  11842. }
  11843. .offer-savedempty {
  11844. display: flex;
  11845. flex-direction: column;
  11846. justify-content: center;
  11847. padding: 25px 18px 18px;
  11848. box-shadow: none
  11849. }
  11850. @media(min-width:48em) {
  11851. .offer-savedempty {
  11852. padding: 30px 40px 18px
  11853. }
  11854. }
  11855. .offer-savedempty__icon {
  11856. margin-bottom: 14px
  11857. }
  11858. @media(min-width:48em) {
  11859. .offer-savedempty__icon {
  11860. margin-bottom: 16px
  11861. }
  11862. }
  11863. .offer-savedempty__icon>svg {
  11864. width: 64px;
  11865. height: 64px
  11866. }
  11867. .offer-savedempty__title {
  11868. color: #655c6c;
  11869. margin-bottom: 1rem
  11870. }
  11871. .offer-savedempty__copy {
  11872. color: #403840
  11873. }
  11874. @media(min-width:48em) {
  11875. .offer-savedempty__copy {
  11876. width: 67%
  11877. }
  11878. }
  11879. .offer-banner {
  11880. width: 100%;
  11881. display: flex;
  11882. flex-flow: row nowrap;
  11883. justify-content: flex-start;
  11884. align-items: center;
  11885. min-height: 24px;
  11886. padding: 3px 70px 3px 10px;
  11887. overflow: hidden;
  11888. border-radius: 8px 8px 0 0
  11889. }
  11890. @media(min-width:48em) {
  11891. .offer-banner {
  11892. min-height: 30px;
  11893. padding: 3px 90px 3px 20px
  11894. }
  11895. }
  11896. .offer-banner--placeholder {
  11897. background-color: #bcbcbc
  11898. }
  11899. .offer-banner--division-market {
  11900. background-color: #000
  11901. }
  11902. .offer-banner--division-discount {
  11903. background-color: #003da5
  11904. }
  11905. .offer-banner--division-shoppers {
  11906. background-color: #c4262e
  11907. }
  11908. .offer-banner--division-beauty_boutique {
  11909. background-color: #8fcae7
  11910. }
  11911. .offer-banner--division-joe_fresh {
  11912. background-color: #ff4713
  11913. }
  11914. .offer-banner--division-murale {
  11915. background-color: #8977ba
  11916. }
  11917. .offer-banner__sprite {
  11918. flex-shrink: 0;
  11919. width: 14px;
  11920. height: 14px;
  11921. margin-right: 8px
  11922. }
  11923. @media(min-width:48em) {
  11924. .offer-banner__sprite {
  11925. width: 18px;
  11926. height: 18px;
  11927. margin-right: 12px
  11928. }
  11929. }
  11930. .offer-banner__sprite--atl-save-easy {
  11931. width: 63px
  11932. }
  11933. @media(min-width:48em) {
  11934. .offer-banner__sprite--atl-save-easy {
  11935. width: 74px
  11936. }
  11937. }
  11938. .offer-banner__sprite--atlantic-superstore {
  11939. width: 64px
  11940. }
  11941. @media(min-width:48em) {
  11942. .offer-banner__sprite--atlantic-superstore {
  11943. width: 76px
  11944. }
  11945. }
  11946. .offer-banner__sprite--beauty-boutique {
  11947. width: 126px
  11948. }
  11949. @media(min-width:48em) {
  11950. .offer-banner__sprite--beauty-boutique {
  11951. width: 138px
  11952. }
  11953. }
  11954. .offer-banner__sprite--dominion {
  11955. width: 60px
  11956. }
  11957. @media(min-width:48em) {
  11958. .offer-banner__sprite--dominion {
  11959. width: 71px
  11960. }
  11961. }
  11962. .offer-banner__sprite--extra-foods {
  11963. width: 98px
  11964. }
  11965. @media(min-width:48em) {
  11966. .offer-banner__sprite--extra-foods {
  11967. width: 108px
  11968. }
  11969. }
  11970. .offer-banner__sprite--fortinos {
  11971. width: 59px
  11972. }
  11973. @media(min-width:48em) {
  11974. .offer-banner__sprite--fortinos {
  11975. width: 72px
  11976. }
  11977. }
  11978. .offer-banner__sprite--gas-bar {
  11979. width: 58px
  11980. }
  11981. @media(min-width:48em) {
  11982. .offer-banner__sprite--gas-bar {
  11983. width: 69px
  11984. }
  11985. }
  11986. .offer-banner__sprite--independent {
  11987. width: 54px
  11988. }
  11989. @media(min-width:48em) {
  11990. .offer-banner__sprite--independent {
  11991. width: 68px
  11992. }
  11993. }
  11994. .offer-banner__sprite--joe-fresh {
  11995. width: 72px
  11996. }
  11997. @media(min-width:48em) {
  11998. .offer-banner__sprite--joe-fresh {
  11999. width: 86px
  12000. }
  12001. }
  12002. .offer-banner__sprite--loblaws {
  12003. width: 63px
  12004. }
  12005. @media(min-width:48em) {
  12006. .offer-banner__sprite--loblaws {
  12007. width: 80px
  12008. }
  12009. }
  12010. .offer-banner__sprite--maxi {
  12011. width: 34px;
  12012. height: 16px
  12013. }
  12014. @media(min-width:48em) {
  12015. .offer-banner__sprite--maxi {
  12016. width: 42px;
  12017. height: 20px
  12018. }
  12019. }
  12020. .offer-banner__sprite--murale {
  12021. width: 35px;
  12022. height: 16px
  12023. }
  12024. @media(min-width:48em) {
  12025. .offer-banner__sprite--murale {
  12026. width: 43px;
  12027. height: 20px
  12028. }
  12029. }
  12030. .offer-banner__sprite--no-frills {
  12031. width: 70px
  12032. }
  12033. @media(min-width:48em) {
  12034. .offer-banner__sprite--no-frills {
  12035. width: 86px
  12036. }
  12037. }
  12038. .offer-banner__sprite--pci-subscription_en,
  12039. .offer-banner__sprite--pci-subscription_fr {
  12040. width: 60px;
  12041. height: 24px
  12042. }
  12043. .offer-banner__sprite--pharmaprix {
  12044. width: 96px
  12045. }
  12046. @media(min-width:48em) {
  12047. .offer-banner__sprite--pharmaprix {
  12048. width: 124px
  12049. }
  12050. }
  12051. .offer-banner__sprite--provigo {
  12052. width: 60px
  12053. }
  12054. @media(min-width:48em) {
  12055. .offer-banner__sprite--provigo {
  12056. width: 74px
  12057. }
  12058. }
  12059. .offer-banner__sprite--shoppers-drug-mart {
  12060. width: 80px
  12061. }
  12062. @media(min-width:48em) {
  12063. .offer-banner__sprite--shoppers-drug-mart {
  12064. width: 104px
  12065. }
  12066. }
  12067. .offer-banner__sprite--superstore {
  12068. width: 63px
  12069. }
  12070. @media(min-width:48em) {
  12071. .offer-banner__sprite--superstore {
  12072. width: 80px
  12073. }
  12074. }
  12075. .offer-banner__sprite--valu-mart {
  12076. width: 45px
  12077. }
  12078. @media(min-width:48em) {
  12079. .offer-banner__sprite--valu-mart {
  12080. width: 58px
  12081. }
  12082. }
  12083. .offer-banner__sprite--wholesale-club {
  12084. width: 56px
  12085. }
  12086. @media(min-width:48em) {
  12087. .offer-banner__sprite--wholesale-club {
  12088. width: 72px
  12089. }
  12090. }
  12091. .offer-banner__sprite--yig {
  12092. width: 78px
  12093. }
  12094. @media(min-width:48em) {
  12095. .offer-banner__sprite--yig {
  12096. width: 98px
  12097. }
  12098. }
  12099. .offer-banner__sprite--zehrs {
  12100. width: 48px
  12101. }
  12102. @media(min-width:48em) {
  12103. .offer-banner__sprite--zehrs {
  12104. width: 56px
  12105. }
  12106. }
  12107. .offer-banner__text {
  12108. line-height: 1;
  12109. color: #fff;
  12110. -webkit-font-smoothing: antialiased;
  12111. position: relative;
  12112. bottom: -1px
  12113. }
  12114. @media(min-width:48em) {
  12115. .offer-banner__text {
  12116. bottom: -2px
  12117. }
  12118. }
  12119. .offer-hero-banner {
  12120. position: relative;
  12121. overflow: hidden;
  12122. border-radius: 8px 8px 0 0
  12123. }
  12124. .offer-hero-banner__inner {
  12125. display: flex;
  12126. flex-direction: column;
  12127. align-items: center;
  12128. justify-content: center;
  12129. position: absolute;
  12130. z-index: 1;
  12131. height: 100%;
  12132. width: 100px
  12133. }
  12134. @media(min-width:48em) {
  12135. .offer-hero-banner__inner {
  12136. width: 150px
  12137. }
  12138. }
  12139. @media(min-width:64em) {
  12140. .offer-hero-banner__inner {
  12141. width: 200px
  12142. }
  12143. }
  12144. .offer-hero-banner__no-image {
  12145. height: 75px;
  12146. background: #bcbcbc
  12147. }
  12148. @media(min-width:48em) {
  12149. .offer-hero-banner__no-image {
  12150. height: 84px
  12151. }
  12152. }
  12153. @media(min-width:64em) {
  12154. .offer-hero-banner__no-image {
  12155. height: 118px
  12156. }
  12157. }
  12158. @media(min-width:80em) {
  12159. .offer-hero-banner__no-image {
  12160. height: 160px
  12161. }
  12162. }
  12163. .offer-hero-banner.offer-banner__text {
  12164. border-radius: 0;
  12165. margin-bottom: 0;
  12166. margin-top: .6rem;
  12167. height: auto
  12168. }
  12169. @media(min-width:48em) {
  12170. .offer-hero-banner.offer-banner__text {
  12171. margin-top: 1.4rem;
  12172. font-weight: 700
  12173. }
  12174. }
  12175. .offer-hero-banner__sprite {
  12176. flex-shrink: 0;
  12177. width: 85px;
  12178. height: 20px;
  12179. max-width: 85px
  12180. }
  12181. @media(min-width:48em) {
  12182. .offer-hero-banner__sprite {
  12183. width: 150px;
  12184. height: 30px;
  12185. max-width: 120px
  12186. }
  12187. }
  12188. @media(min-width:64em) {
  12189. .offer-hero-banner__sprite {
  12190. max-width: 150px;
  12191. height: 40px
  12192. }
  12193. }
  12194. .offer-hero-banner__sprite--pci-subscription_en+.offer-banner__text,
  12195. .offer-hero-banner__sprite--pci-subscription_fr+.offer-banner__text {
  12196. display: none
  12197. }
  12198. .offer-hero-banner img {
  12199. position: relative;
  12200. left: 50px
  12201. }
  12202. @media(min-width:48em) {
  12203. .offer-hero-banner img {
  12204. left: 75px
  12205. }
  12206. }
  12207. @media(min-width:64em) {
  12208. .offer-hero-banner img {
  12209. left: 100px
  12210. }
  12211. }
  12212. .offer-checkmark__label {
  12213. z-index: 1;
  12214. position: absolute;
  12215. top: 0;
  12216. right: 0;
  12217. width: 60px;
  12218. height: 60px;
  12219. cursor: pointer;
  12220. border: none;
  12221. padding: 0
  12222. }
  12223. @media(min-width:48em) {
  12224. .offer-checkmark__label {
  12225. width: 70px;
  12226. height: 70px
  12227. }
  12228. }
  12229. .offer-checkmark__label:before {
  12230. content: "";
  12231. position: absolute;
  12232. height: 0;
  12233. width: 0;
  12234. top: 0;
  12235. right: 0;
  12236. transition: border-color .1s;
  12237. border-color: #ddd #ddd transparent transparent;
  12238. border-style: solid;
  12239. border-width: 30px
  12240. }
  12241. @media(min-width:48em) {
  12242. .offer-checkmark__label:before {
  12243. border-width: 35px
  12244. }
  12245. }
  12246. .offer-checkmark__label:focus:before,
  12247. .offer-checkmark__label:hover:before {
  12248. border-right-color: #bcbcbc;
  12249. border-top-color: #bcbcbc
  12250. }
  12251. .offer-checkmark__label--checked:before {
  12252. border-right-color: #fbd2d3;
  12253. border-top-color: #fbd2d3
  12254. }
  12255. .offer-checkmark__label--checked:focus:before,
  12256. .offer-checkmark__label--checked:hover:before {
  12257. border-right-color: #f9bbbc;
  12258. border-top-color: #f9bbbc
  12259. }
  12260. .offer-checkmark__label--checked .offer-checkmark__icon {
  12261. fill: #ee3124
  12262. }
  12263. .offer-checkmark__icon {
  12264. position: absolute;
  12265. top: 6px;
  12266. right: 6px
  12267. }
  12268. @media(min-width:48em) {
  12269. .offer-checkmark__icon {
  12270. top: 8px;
  12271. right: 8px
  12272. }
  12273. }
  12274. .offer-checkmark__input {
  12275. position: absolute;
  12276. top: 5px;
  12277. right: 5px
  12278. }
  12279. .offer-checkmark__input:focus+.offer-checkmark__label:before {
  12280. border-right-color: #bcbcbc;
  12281. border-top-color: #bcbcbc
  12282. }
  12283. .offer-checkmark__input:focus+.offer-checkmark__label--checked:before {
  12284. border-right-color: #f9bbbc;
  12285. border-top-color: #f9bbbc
  12286. }
  12287. .hero-continuity-offer .offer__image,
  12288. .hero-product-offer .offer__image,
  12289. .product-offer .offer__image {
  12290. overflow: hidden
  12291. }
  12292. .hero-continuity-offer .offer__image--hero,
  12293. .hero-product-offer .offer__image--hero,
  12294. .product-offer .offer__image--hero {
  12295. border-radius: 8px 8px 0 0
  12296. }
  12297. .hero-continuity-offer__top-inner,
  12298. .hero-product-offer__top-inner,
  12299. .product-offer__top-inner {
  12300. position: relative
  12301. }
  12302. .hero-continuity-offer__top-inner .offer__image--carousel,
  12303. .hero-product-offer__top-inner .offer__image--carousel,
  12304. .product-offer__top-inner .offer__image--carousel {
  12305. flex: 0 0 110px;
  12306. margin: 0;
  12307. width: 100%;
  12308. border-radius: 0
  12309. }
  12310. .hero-continuity-offer__top-inner .offer__image--carousel .offer__image-element--hero,
  12311. .hero-product-offer__top-inner .offer__image--carousel .offer__image-element--hero,
  12312. .product-offer__top-inner .offer__image--carousel .offer__image-element--hero {
  12313. position: absolute;
  12314. max-width: none;
  12315. width: auto;
  12316. height: 110px;
  12317. left: 50%;
  12318. transform: translate(-50%)
  12319. }
  12320. .hero-continuity-offer__top-inner .offer__image--carousel .offer__image--loadToCard,
  12321. .hero-product-offer__top-inner .offer__image--carousel .offer__image--loadToCard,
  12322. .product-offer__top-inner .offer__image--carousel .offer__image--loadToCard {
  12323. height: 134px
  12324. }
  12325. .hero-continuity-offer__top-inner .offer__image--loadToCard-image-container,
  12326. .hero-product-offer__top-inner .offer__image--loadToCard-image-container,
  12327. .product-offer__top-inner .offer__image--loadToCard-image-container {
  12328. flex: 0 0 134px
  12329. }
  12330. .hero-continuity-offer .offer__image-element--default,
  12331. .hero-product-offer .offer__image-element--default,
  12332. .product-offer .offer__image-element--default {
  12333. max-width: 80px
  12334. }
  12335. @media(min-width:48em) {
  12336. .hero-continuity-offer .offer__image-element--default,
  12337. .hero-product-offer .offer__image-element--default,
  12338. .product-offer .offer__image-element--default {
  12339. max-width: 110px
  12340. }
  12341. }
  12342. .hero-continuity-offer .offer__image-element--carousel,
  12343. .hero-product-offer .offer__image-element--carousel,
  12344. .product-offer .offer__image-element--carousel {
  12345. position: absolute;
  12346. max-width: none;
  12347. width: auto;
  12348. height: 113px;
  12349. left: 50%;
  12350. transform: translate(-50%)
  12351. }
  12352. .product-offer__top-inner {
  12353. display: flex;
  12354. flex-flow: row nowrap;
  12355. align-items: center;
  12356. justify-content: space-between;
  12357. padding: 20px 30px
  12358. }
  12359. @media(min-width:48em) {
  12360. .product-offer__top-inner {
  12361. padding: 20px 30px
  12362. }
  12363. }
  12364. .product-offer__top-inner .offer__image {
  12365. flex: 0 0 80px;
  12366. margin-right: 18px
  12367. }
  12368. @media(min-width:48em) {
  12369. .product-offer__top-inner .offer__image {
  12370. flex: 0 0 110px;
  12371. margin-right: 30px
  12372. }
  12373. }
  12374. .product-offer__top-inner .offer__image--carousel {
  12375. flex: 0 0 112px;
  12376. margin: 0;
  12377. width: 100%
  12378. }
  12379. .product-offer__content-group {
  12380. flex-grow: 1
  12381. }
  12382. .hero-product-offer__content-group {
  12383. padding: 20px 30px;
  12384. position: relative
  12385. }
  12386. @media(min-width:48em) {
  12387. .hero-product-offer__content-group {
  12388. padding: 20px 30px
  12389. }
  12390. }
  12391. .continuity-offer__top-inner,
  12392. .hero-continuity-offer__top-inner {
  12393. position: relative
  12394. }
  12395. .continuity-offer__top-inner .offer__image,
  12396. .hero-continuity-offer__top-inner .offer__image {
  12397. overflow: hidden
  12398. }
  12399. .continuity-offer__top-inner .offer__image--faded,
  12400. .hero-continuity-offer__top-inner .offer__image--faded {
  12401. opacity: .5
  12402. }
  12403. .continuity-offer__top-inner .progress-bar,
  12404. .hero-continuity-offer__top-inner .progress-bar {
  12405. margin-top: 14px
  12406. }
  12407. .continuity-offer__top-inner .progress-bar__parent:not(:first-child),
  12408. .hero-continuity-offer__top-inner .progress-bar__parent:not(:first-child) {
  12409. margin-left: 8px
  12410. }
  12411. .continuity-offer__top-inner .progress-bar__ratio,
  12412. .hero-continuity-offer__top-inner .progress-bar__ratio {
  12413. color: #000
  12414. }
  12415. .continuity-offer__top-inner .progress-bar__current-value,
  12416. .hero-continuity-offer__top-inner .progress-bar__current-value {
  12417. font-weight: 400
  12418. }
  12419. .continuity-offer__top-inner {
  12420. display: flex;
  12421. flex-flow: row nowrap;
  12422. align-items: center;
  12423. justify-content: space-between;
  12424. padding: 18px
  12425. }
  12426. @media(max-width:34.365em) {
  12427. .continuity-offer__top-inner {
  12428. padding-bottom: 54px
  12429. }
  12430. }
  12431. @media(min-width:48em) {
  12432. .continuity-offer__top-inner {
  12433. padding: 20px 30px
  12434. }
  12435. }
  12436. .continuity-offer__top-inner .offer__image {
  12437. flex: 0 0 80px;
  12438. margin-right: 18px
  12439. }
  12440. @media(min-width:48em) {
  12441. .continuity-offer__top-inner .offer__image {
  12442. flex: 0 0 110px;
  12443. margin-right: 30px
  12444. }
  12445. }
  12446. .continuity-offer__content-group {
  12447. flex-grow: 1
  12448. }
  12449. .continuity-offer__content-group .progress-bar {
  12450. width: auto
  12451. }
  12452. @media(max-width:34.365em) {
  12453. .continuity-offer__content-group .progress-bar {
  12454. position: absolute;
  12455. width: auto;
  12456. bottom: 18px;
  12457. left: 18px;
  12458. right: 18px
  12459. }
  12460. }
  12461. .hero-continuity-offer__content-group {
  12462. min-height: 110px;
  12463. padding: 18px;
  12464. position: relative
  12465. }
  12466. @media(min-width:48em) {
  12467. .hero-continuity-offer__content-group {
  12468. min-height: 150px;
  12469. padding: 20px 30px
  12470. }
  12471. }
  12472. .offer-content {
  12473. position: relative
  12474. }
  12475. .offer-content .sprite {
  12476. margin-left: 7px;
  12477. width: 15px
  12478. }
  12479. .offer-content-carousel {
  12480. display: flex;
  12481. flex-flow: row nowrap;
  12482. align-items: center;
  12483. justify-content: space-between;
  12484. text-align: center;
  12485. flex-direction: column;
  12486. padding: 0
  12487. }
  12488. .offer-content-group-carousel {
  12489. width: 100%;
  12490. padding: 24px 15px 0;
  12491. display: flex;
  12492. flex-direction: column;
  12493. min-height: 133px;
  12494. height: 250px;
  12495. overflow: hidden;
  12496. text-align: left
  12497. }
  12498. .offer-content-group-carousel .offer__text {
  12499. display: -webkit-box;
  12500. overflow: hidden;
  12501. -webkit-line-clamp: 3;
  12502. -webkit-box-orient: vertical;
  12503. font-style: normal;
  12504. margin: 0 auto 16px
  12505. }
  12506. .offer-content-group-carousel .offer__text--earned {
  12507. display: block;
  12508. overflow: visible
  12509. }
  12510. .offer-content-group-carousel--modal .offer__reward.offer__reward--carousel {
  12511. color: #ac342a;
  12512. margin-top: 8px
  12513. }
  12514. .offer-description {
  12515. font-size: 13px;
  12516. line-height: 15px;
  12517. margin-top: 10px
  12518. }
  12519. .flyer-result--disabled .offer-footer__state,
  12520. .flyer-result--disabled .offer__reward,
  12521. .offer--disabled .offer-footer__state,
  12522. .offer--disabled .offer__reward,
  12523. .offers-preview .offer--invalid .offer-footer__state,
  12524. .offers-preview .offer--invalid .offer__reward {
  12525. color: #655c6c
  12526. }
  12527. .flyer-result--disabled .offer-section__inner,
  12528. .offer--disabled .offer-section__inner,
  12529. .offers-preview .offer--invalid .offer-section__inner {
  12530. position: relative
  12531. }
  12532. .flyer-result--disabled .flyer-result__footer,
  12533. .flyer-result--disabled .offer-details__discovery-offer-text,
  12534. .flyer-result--disabled .offer-details__section,
  12535. .flyer-result--disabled .offer-footer,
  12536. .offer--disabled .flyer-result__footer,
  12537. .offer--disabled .offer-details__discovery-offer-text,
  12538. .offer--disabled .offer-details__section,
  12539. .offer--disabled .offer-footer,
  12540. .offers-preview .offer--invalid .flyer-result__footer,
  12541. .offers-preview .offer--invalid .offer-details__discovery-offer-text,
  12542. .offers-preview .offer--invalid .offer-details__section,
  12543. .offers-preview .offer--invalid .offer-footer {
  12544. border-color: rgba(155, 149, 168, .16)
  12545. }
  12546. .offer-template-id {
  12547. position: absolute;
  12548. color: #8a8a8a;
  12549. font-size: 12px;
  12550. line-height: 1;
  12551. bottom: -20px;
  12552. right: 0
  12553. }
  12554. @media(min-width:48em) {
  12555. .offer-template-id {
  12556. bottom: 0;
  12557. right: auto;
  12558. left: 100%;
  12559. margin-left: 8px
  12560. }
  12561. }
  12562. .offer-details__info>:first-child {
  12563. margin-top: 0
  12564. }
  12565. .offer-details__info>:last-child {
  12566. margin-bottom: 0
  12567. }
  12568. .offer-details__info-discovery {
  12569. border-bottom: 1px solid rgba(155, 149, 168, .16);
  12570. padding: 18px
  12571. }
  12572. .offer-details__info-discovery>p:first-child {
  12573. margin-top: 0
  12574. }
  12575. .offer-details__info-discovery>p:last-child {
  12576. margin-bottom: 0
  12577. }
  12578. @media(min-width:48em) {
  12579. .offer-details__info-discovery {
  12580. padding: 20px 30px
  12581. }
  12582. }
  12583. .offer-details__info-pcf-bonus-icon {
  12584. position: relative;
  12585. bottom: -3px;
  12586. height: 16px;
  12587. width: 25px;
  12588. margin-right: 8px
  12589. }
  12590. @media(min-width:48em) {
  12591. .offer-details__info-pcf-bonus-icon {
  12592. bottom: -6px;
  12593. height: 24px;
  12594. width: 36px;
  12595. margin-right: 14px
  12596. }
  12597. }
  12598. .offer-details__explanation {
  12599. padding: 18px;
  12600. border-bottom: 1px solid rgba(155, 149, 168, .16);
  12601. color: #403840
  12602. }
  12603. .offer-details__explanation>.offer-details-steps-progress:first-child,
  12604. .offer-details__explanation>p:first-child {
  12605. margin-top: 0
  12606. }
  12607. .offer-details__explanation>.offer-details-steps-progress:last-child,
  12608. .offer-details__explanation>p:last-child {
  12609. margin-bottom: 0
  12610. }
  12611. @media(min-width:48em) {
  12612. .offer-details__explanation {
  12613. padding: 20px 30px
  12614. }
  12615. }
  12616. .offer-details__offer-date {
  12617. padding: 18px;
  12618. border-top: 1px solid rgba(155, 149, 168, .16);
  12619. border-bottom: 1px solid rgba(155, 149, 168, .16);
  12620. color: #403840
  12621. }
  12622. .offer-details__offer-date>p {
  12623. margin: 0
  12624. }
  12625. @media(min-width:48em) {
  12626. .offer-details__offer-date {
  12627. padding: 20px 30px
  12628. }
  12629. }
  12630. .offer-details__cta {
  12631. padding: 18px;
  12632. border-top: 1px solid rgba(155, 149, 168, .16)
  12633. }
  12634. .offer-details__cta button:first-of-type {
  12635. margin-bottom: 24px
  12636. }
  12637. @media(min-width:48em) {
  12638. .offer-details__cta button:first-of-type {
  12639. margin-bottom: 0
  12640. }
  12641. }
  12642. @media(min-width:48em) {
  12643. .offer-details__cta {
  12644. display: flex;
  12645. flex-flow: row wrap;
  12646. justify-content: space-between;
  12647. padding: 20px 30px
  12648. }
  12649. }
  12650. @media(min-width:48em) {
  12651. .offer-details__cta>* {
  12652. flex-basis: calc(50% - 9px)
  12653. }
  12654. }
  12655. @media(min-width:64em) {
  12656. .offer-details__cta>* {
  12657. flex-basis: calc(50% - 18px)
  12658. }
  12659. }
  12660. .offer-details__cta-label {
  12661. order: 1;
  12662. margin: 0 0 4px
  12663. }
  12664. @media(max-width:47.99em) {
  12665. .offer-details__cta-label--reject {
  12666. margin-top: 18px
  12667. }
  12668. }
  12669. .offer-details__cta-notice {
  12670. order: 3;
  12671. font-weight: 700;
  12672. color: #191919;
  12673. margin: 8px 0 0
  12674. }
  12675. .offer-details__cta-button {
  12676. order: 2;
  12677. padding: 0;
  12678. white-space: normal;
  12679. border-color: #191919
  12680. }
  12681. @media(max-width:63.99em) {
  12682. .offer-details__cta-button {
  12683. font-size: .875rem
  12684. }
  12685. }
  12686. .offer-details__cta-button[disabled],
  12687. .offer-details__cta-button[disabled]:active,
  12688. .offer-details__cta-button[disabled]:hover {
  12689. color: #bcbcbc;
  12690. fill: #bcbcbc;
  12691. border-color: #bcbcbc;
  12692. background: transparent
  12693. }
  12694. .offer-details__cta-button--save .sprite {
  12695. top: -2px
  12696. }
  12697. .offer-details__cta-button--reject .sprite {
  12698. top: -1px
  12699. }
  12700. .offer-details__cta-button-inner {
  12701. display: flex;
  12702. height: 44px;
  12703. justify-content: center;
  12704. align-items: center;
  12705. margin: 0 6px
  12706. }
  12707. @media(min-width:64em) {
  12708. .offer-details__cta-button-inner {
  12709. height: 52px;
  12710. margin: 0 20px
  12711. }
  12712. }
  12713. .offer-details__cta-button-inner .sprite {
  12714. position: relative;
  12715. flex-shrink: 0;
  12716. margin-right: 10px
  12717. }
  12718. .offer-details__cta--reject-disabled .offer-details__cta-label--reject,
  12719. .offer-details__cta--save-disabled .offer-details__cta-label--save {
  12720. color: #bcbcbc
  12721. }
  12722. .offer-details__confirm {
  12723. text-align: center;
  12724. padding: 18px;
  12725. border-bottom: 1px solid rgba(155, 149, 168, .16)
  12726. }
  12727. @media(min-width:48em) {
  12728. .offer-details__confirm {
  12729. display: flex;
  12730. flex-flow: row nowrap;
  12731. text-align: left;
  12732. justify-content: space-between;
  12733. align-items: flex-start;
  12734. padding: 20px 40px
  12735. }
  12736. }
  12737. @media(min-width:64em) {
  12738. .offer-details__confirm {
  12739. padding-left: 100px;
  12740. padding-right: 100px
  12741. }
  12742. }
  12743. @media(min-width:48em) {
  12744. .offer-details__confirm-icon {
  12745. flex-shrink: 0
  12746. }
  12747. }
  12748. .offer-details__confirm-icon .sprite {
  12749. height: 40px;
  12750. width: 40px
  12751. }
  12752. @media(min-width:48em) {
  12753. .offer-details__confirm-content {
  12754. flex-grow: 1;
  12755. margin-left: 20px
  12756. }
  12757. }
  12758. @media(min-width:64em) {
  12759. .offer-details__confirm-content {
  12760. margin-left: 45px
  12761. }
  12762. }
  12763. .offer-details__confirm-buttons {
  12764. display: flex;
  12765. flex-direction: column;
  12766. margin-top: 30px
  12767. }
  12768. @media(min-width:48em) {
  12769. .offer-details__confirm-buttons {
  12770. flex-direction: row;
  12771. margin-top: 14px
  12772. }
  12773. }
  12774. .offer-details__confirm-cancel-button {
  12775. margin: 16px auto
  12776. }
  12777. @media(min-width:48em) {
  12778. .offer-details__confirm-cancel-button {
  12779. margin: auto
  12780. }
  12781. }
  12782. .offer-details__terms {
  12783. padding: 18px
  12784. }
  12785. @media(min-width:48em) {
  12786. .offer-details__terms {
  12787. padding: 20px 30px
  12788. }
  12789. }
  12790. .offer-details__terms>:first-child {
  12791. margin-top: 0
  12792. }
  12793. .offer-details__terms>:last-child {
  12794. margin-bottom: 0
  12795. }
  12796. .offer-details__terms-text {
  12797. color: #403840
  12798. }
  12799. .flyer-result--disabled .offer-details__info,
  12800. .flyer-result--disabled .offer-details__info-discovery,
  12801. .flyer-result--disabled .offer-details__terms,
  12802. .offer--disabled .offer-details__info,
  12803. .offer--disabled .offer-details__info-discovery,
  12804. .offer--disabled .offer-details__terms,
  12805. .offers-preview .offer--invalid .offer-details__info,
  12806. .offers-preview .offer--invalid .offer-details__info-discovery,
  12807. .offers-preview .offer--invalid .offer-details__terms {
  12808. border-color: rgba(155, 149, 168, .16)
  12809. }
  12810. .flyer-result--disabled .offer-details__saved,
  12811. .offer--disabled .offer-details__saved,
  12812. .offers-preview .offer--invalid .offer-details__saved {
  12813. text-align: center;
  12814. padding: 18px;
  12815. border-bottom: 1px solid rgba(155, 149, 168, .16)
  12816. }
  12817. @media(min-width:48em) {
  12818. .flyer-result--disabled .offer-details__saved,
  12819. .offer--disabled .offer-details__saved,
  12820. .offers-preview .offer--invalid .offer-details__saved {
  12821. display: flex;
  12822. flex-flow: row nowrap;
  12823. text-align: left;
  12824. justify-content: space-between;
  12825. align-items: flex-start;
  12826. padding: 20px 40px
  12827. }
  12828. }
  12829. @media(min-width:64em) {
  12830. .flyer-result--disabled .offer-details__saved,
  12831. .offer--disabled .offer-details__saved,
  12832. .offers-preview .offer--invalid .offer-details__saved {
  12833. padding-left: 100px;
  12834. padding-right: 100px
  12835. }
  12836. }
  12837. .flyer-result--disabled .offer-details__saved-icon,
  12838. .offer--disabled .offer-details__saved-icon,
  12839. .offers-preview .offer--invalid .offer-details__saved-icon {
  12840. height: 40px;
  12841. width: 40px
  12842. }
  12843. @media(min-width:48em) {
  12844. .flyer-result--disabled .offer-details__saved-icon,
  12845. .offer--disabled .offer-details__saved-icon,
  12846. .offers-preview .offer--invalid .offer-details__saved-icon {
  12847. flex-shrink: 0
  12848. }
  12849. }
  12850. @media(min-width:48em) {
  12851. .flyer-result--disabled .offer-details__saved-content,
  12852. .offer--disabled .offer-details__saved-content,
  12853. .offers-preview .offer--invalid .offer-details__saved-content {
  12854. flex-grow: 1;
  12855. margin-left: 20px
  12856. }
  12857. }
  12858. @media(min-width:64em) {
  12859. .flyer-result--disabled .offer-details__saved-content,
  12860. .offer--disabled .offer-details__saved-content,
  12861. .offers-preview .offer--invalid .offer-details__saved-content {
  12862. margin-left: 45px
  12863. }
  12864. }
  12865. .flyer-result--disabled .offer-details__saved-title,
  12866. .offer--disabled .offer-details__saved-title,
  12867. .offers-preview .offer--invalid .offer-details__saved-title {
  12868. display: block;
  12869. font-size: .875rem;
  12870. line-height: 1.428571429;
  12871. margin: 10px 30px
  12872. }
  12873. @media(min-width:48em) {
  12874. .flyer-result--disabled .offer-details__saved-title,
  12875. .offer--disabled .offer-details__saved-title,
  12876. .offers-preview .offer--invalid .offer-details__saved-title {
  12877. margin: 0 0 14px
  12878. }
  12879. }
  12880. .flyer-result--disabled .offer-details__saved-subtitle,
  12881. .offer--disabled .offer-details__saved-subtitle,
  12882. .offers-preview .offer--invalid .offer-details__saved-subtitle {
  12883. margin: 10px 30px 0
  12884. }
  12885. @media(min-width:48em) {
  12886. .flyer-result--disabled .offer-details__saved-subtitle,
  12887. .offer--disabled .offer-details__saved-subtitle,
  12888. .offers-preview .offer--invalid .offer-details__saved-subtitle {
  12889. margin: 10px 0 0
  12890. }
  12891. }
  12892. .shoppable-offer-link {
  12893. color: #157a77;
  12894. margin-top: 12px
  12895. }
  12896. @media(max-width:47.99em) {
  12897. .shoppable-offer-link {
  12898. font-size: .75rem
  12899. }
  12900. }
  12901. @media(min-width:34.375em) {
  12902. .shoppable-offer-link {
  12903. margin-top: 8px
  12904. }
  12905. }
  12906. @media(max-width:47.99em) {
  12907. .shoppable-offer-link .sprite.new-window-link__icon {
  12908. width: 13px
  12909. }
  12910. }
  12911. .flyer-result__footer,
  12912. .offer-footer {
  12913. display: flex;
  12914. flex-direction: column-reverse;
  12915. justify-content: center;
  12916. align-items: center;
  12917. text-align: left;
  12918. min-height: 40px;
  12919. padding: 0
  12920. }
  12921. @media(min-width:48em) {
  12922. .flyer-result__footer,
  12923. .offer-footer {
  12924. border-top: 1px solid rgba(155, 149, 168, .16);
  12925. padding: 10px 30px;
  12926. min-height: 50px;
  12927. flex-direction: row-reverse;
  12928. justify-content: space-between
  12929. }
  12930. }
  12931. .offer-footer__action-buttons {
  12932. display: flex;
  12933. flex-direction: column;
  12934. align-items: center;
  12935. width: 100%
  12936. }
  12937. @media(min-width:48em) {
  12938. .offer-footer__action-buttons {
  12939. flex-direction: row;
  12940. width: -moz-fit-content;
  12941. width: fit-content
  12942. }
  12943. }
  12944. .offer-footer__add-to-shopping-list {
  12945. display: flex;
  12946. justify-content: center;
  12947. border-top: 1px solid rgba(155, 149, 168, .16);
  12948. padding: 10px 18px;
  12949. width: 100%
  12950. }
  12951. @media(min-width:48em) {
  12952. .offer-footer__add-to-shopping-list {
  12953. width: -moz-fit-content;
  12954. width: fit-content;
  12955. border-top: none;
  12956. margin-right: 24px;
  12957. padding: 0
  12958. }
  12959. }
  12960. .offer-footer__view-details {
  12961. padding: 10px 18px
  12962. }
  12963. @media(min-width:48em) {
  12964. .offer-footer__view-details {
  12965. padding: 0
  12966. }
  12967. }
  12968. .offer-footer__view-details-container {
  12969. display: flex;
  12970. width: 100%;
  12971. justify-content: center;
  12972. border-top: 1px solid rgba(155, 149, 168, .16)
  12973. }
  12974. @media(min-width:48em) {
  12975. .offer-footer__view-details-container {
  12976. border-top: none;
  12977. width: -moz-fit-content;
  12978. width: fit-content
  12979. }
  12980. }
  12981. .offer-footer__date-container {
  12982. display: flex;
  12983. justify-content: center;
  12984. width: 100%;
  12985. border-top: 1px solid rgba(155, 149, 168, .16);
  12986. padding: 10px 18px
  12987. }
  12988. @media(min-width:48em) {
  12989. .offer-footer__date-container {
  12990. width: -moz-fit-content;
  12991. width: fit-content;
  12992. border-top: none;
  12993. padding: 0
  12994. }
  12995. }
  12996. .offer-footer--carousel {
  12997. padding: 10px 16px;
  12998. justify-content: space-around;
  12999. max-height: 50px;
  13000. border-top: none
  13001. }
  13002. .offer-footer--carousel .shoppable-offer-link {
  13003. margin-top: 0;
  13004. max-width: 100%;
  13005. color: #157a77
  13006. }
  13007. .offer-footer--carousel .shoppable-offer-link span {
  13008. max-width: 72px
  13009. }
  13010. .offer-footer--carousel .shoppable-offer-link:hover {
  13011. color: #615395
  13012. }
  13013. .offer-footer--carousel--shoppable {
  13014. border-top: 1px solid rgba(155, 149, 168, .16)
  13015. }
  13016. .offer-footer-date {
  13017. text-align: left;
  13018. color: #655c6c
  13019. }
  13020. .menu {
  13021. width: 100vw
  13022. }
  13023. .modal-container {
  13024. z-index: 999;
  13025. position: fixed;
  13026. top: 0;
  13027. left: 0;
  13028. width: 100%;
  13029. height: 100vh;
  13030. display: flex;
  13031. justify-content: center;
  13032. align-items: center;
  13033. background-color: rgba(6, 17, 22, .65);
  13034. padding: 50px 10px
  13035. }
  13036. .modal-content {
  13037. max-width: 327px;
  13038. position: relative;
  13039. border-radius: 15px;
  13040. background-color: #fff;
  13041. padding: 0;
  13042. max-height: 530px;
  13043. overflow: hidden
  13044. }
  13045. .modal-content--scrollable {
  13046. position: relative;
  13047. height: 100%
  13048. }
  13049. .modal-content--scrollable .offer-content-group-carousel-wrapper.offers-modal__scroll-content {
  13050. height: calc(90vh - 384px);
  13051. min-height: 141px
  13052. }
  13053. @media(min-width:48em) {
  13054. .modal-content {
  13055. max-width: 561px;
  13056. max-height: 900px
  13057. }
  13058. }
  13059. .modal-content__link-wrapper {
  13060. display: flex;
  13061. flex-direction: column
  13062. }
  13063. @media(min-width:48em) {
  13064. .modal-content__link-wrapper {
  13065. flex-direction: row;
  13066. justify-content: flex-end
  13067. }
  13068. }
  13069. .modal-content__link-wrapper .button-base.secondary {
  13070. margin: 16px 0 0
  13071. }
  13072. @media(min-width:48em) {
  13073. .modal-content__link-wrapper .button-base.secondary {
  13074. margin: 0 0 0 24px
  13075. }
  13076. }
  13077. .modal-content__link-wrapper .button-base.primary,
  13078. .modal-content__link-wrapper .button-base.secondary {
  13079. padding: 12px 48px
  13080. }
  13081. .modal-content--close {
  13082. position: absolute;
  13083. top: 15px;
  13084. right: 15px;
  13085. border-radius: 100%;
  13086. padding: 3px;
  13087. z-index: 1
  13088. }
  13089. @media(min-width:48em) {
  13090. .modal-content--close {
  13091. top: 18px;
  13092. right: 18px
  13093. }
  13094. }
  13095. .modal-content--close svg {
  13096. width: 28px;
  13097. height: auto;
  13098. fill: #403840
  13099. }
  13100. .modal-content--close-contrast {
  13101. width: 32px;
  13102. height: 32px;
  13103. background-color: #fff;
  13104. display: flex;
  13105. justify-content: center;
  13106. align-items: center
  13107. }
  13108. .modal-content--close-contrast svg {
  13109. width: 20px
  13110. }
  13111. .modal-content--close-contrast:hover {
  13112. background-color: #f4f1f6;
  13113. border: 2px solid #615395;
  13114. border-radius: 50%
  13115. }
  13116. .modal-content--close-contrast:hover svg {
  13117. fill: #615395
  13118. }
  13119. .modal-content h1 {
  13120. margin-bottom: 16px
  13121. }
  13122. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward {
  13123. color: #655c6c
  13124. }
  13125. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned {
  13126. color: #615395
  13127. }
  13128. .offer-details-steps-progress {
  13129. display: flex;
  13130. color: #403840;
  13131. margin: 16px 0
  13132. }
  13133. .offer-details-steps-progress__key {
  13134. margin-right: 4px
  13135. }
  13136. .offer-details-steps-progress__value {
  13137. margin: 0
  13138. }
  13139. .activation-card-display {
  13140. text-align: center
  13141. }
  13142. .activation-card-display__card-graphic {
  13143. display: block;
  13144. width: auto;
  13145. max-width: 320px;
  13146. margin: 20px auto
  13147. }
  13148. .activation-card-display__points,
  13149. .activation-card-display__redeemable-value,
  13150. .activation-card-display__redeemable-value-section {
  13151. margin-top: 16px
  13152. }
  13153. .activation-card-display__redeemable-value {
  13154. font-weight: 700
  13155. }
  13156. .split-graphic {
  13157. position: relative;
  13158. max-width: none;
  13159. margin: 24px auto;
  13160. border-bottom: 1px solid rgba(158, 147, 166, .25)
  13161. }
  13162. .split-graphic__points {
  13163. margin: 0 auto
  13164. }
  13165. .link-more-cards {
  13166. text-align: center;
  13167. display: flex;
  13168. flex-direction: column;
  13169. align-items: center
  13170. }
  13171. @media(min-width:34.375em) {
  13172. .link-more-cards {
  13173. flex-direction: row;
  13174. text-align: left
  13175. }
  13176. }
  13177. .link-more-cards__title {
  13178. margin-top: 0
  13179. }
  13180. .link-more-cards__body {
  13181. margin-bottom: 0
  13182. }
  13183. .link-more-cards__img-link {
  13184. display: block;
  13185. margin-bottom: 40px;
  13186. flex-shrink: 0
  13187. }
  13188. .link-more-cards__img-link img {
  13189. display: block;
  13190. max-width: 100%;
  13191. box-shadow: 0 1px 3px rgba(0, 0, 0, .3)
  13192. }
  13193. @media(min-width:34.375em) {
  13194. .link-more-cards__img-link {
  13195. margin-bottom: 0;
  13196. margin-right: 40px
  13197. }
  13198. }
  13199. .link-more-cards__img-link--legacy img {
  13200. width: 112px;
  13201. border-radius: 4px
  13202. }
  13203. .link-more-cards__img-link--legacy img:last-child {
  13204. margin-top: -45px;
  13205. margin-left: 40px
  13206. }
  13207. .link-more-cards__img-link--pcf img {
  13208. width: 152px;
  13209. border-radius: 6px
  13210. }
  13211. .refine-search-bar {
  13212. background-color: #fff;
  13213. border-bottom: 1px solid #ddd;
  13214. border-top: 1px solid #ddd
  13215. }
  13216. @media(max-width:47.99em) {
  13217. .refine-search-bar__apply-button,
  13218. .refine-search-bar__clear-button,
  13219. .refine-search-bar__close-button {
  13220. margin-top: 10px;
  13221. margin-bottom: 10px
  13222. }
  13223. }
  13224. .refine-search-bar__inner {
  13225. display: flex;
  13226. align-items: center
  13227. }
  13228. @media(min-width:48em) {
  13229. .refine-search-bar__inner {
  13230. padding: 10px 0
  13231. }
  13232. }
  13233. .refine-search-bar__inner--placeholder {
  13234. height: 72px
  13235. }
  13236. @media(min-width:48em) {
  13237. .refine-search-bar__inner--placeholder {
  13238. height: 78px
  13239. }
  13240. }
  13241. .refine-search-bar__results-summary {
  13242. flex-grow: 1;
  13243. padding: 10px 10px 10px 0;
  13244. margin-left: 20px
  13245. }
  13246. @media(min-width:48em) {
  13247. .refine-search-bar__results-summary {
  13248. margin-left: 40px
  13249. }
  13250. }
  13251. .refine-search-bar__title {
  13252. display: flex;
  13253. align-items: center;
  13254. margin-right: auto;
  13255. margin-left: 20px
  13256. }
  13257. @media(min-width:48em) {
  13258. .refine-search-bar__title {
  13259. margin-left: 40px
  13260. }
  13261. }
  13262. .refine-search-bar__title .sprite {
  13263. flex-shrink: 0;
  13264. margin-right: 10px
  13265. }
  13266. .refine-search-bar__clear-button {
  13267. align-self: stretch;
  13268. margin-right: 10px;
  13269. min-width: 0
  13270. }
  13271. @media(min-width:34.375em) {
  13272. .refine-search-bar__clear-button {
  13273. min-width: 100px;
  13274. padding: 0 20px
  13275. }
  13276. }
  13277. @media(min-width:48em) {
  13278. .refine-search-bar__clear-button {
  13279. margin-right: 20px;
  13280. line-height: 24px
  13281. }
  13282. }
  13283. .refine-search-bar__clear-button:hover {
  13284. color: #8a8a8a
  13285. }
  13286. .refine-search-bar__apply-button {
  13287. min-width: 0;
  13288. padding: 10px 15px;
  13289. flex-shrink: 0
  13290. }
  13291. @media(min-width:34.375em) {
  13292. .refine-search-bar__apply-button {
  13293. min-width: 100px;
  13294. margin-right: 16px
  13295. }
  13296. }
  13297. @media(min-width:48em) {
  13298. .refine-search-bar__apply-button {
  13299. margin-right: 26px;
  13300. padding: 16px;
  13301. line-height: 24px
  13302. }
  13303. }
  13304. .refine-search-bar__close-button {
  13305. padding: 0 15px;
  13306. align-self: stretch
  13307. }
  13308. @media(min-width:48em) {
  13309. .refine-search-bar__close-button {
  13310. padding: 0 20px;
  13311. margin-right: 20px
  13312. }
  13313. }
  13314. .refine-search-bar__close-button .sprite {
  13315. width: 18px;
  13316. height: 18px
  13317. }
  13318. .refine-search-bar--sticky {
  13319. z-index: 1;
  13320. border-top: 3px solid #fff
  13321. }
  13322. .refine-search-button {
  13323. min-width: 0;
  13324. flex-shrink: 0;
  13325. color: #191919;
  13326. fill: #191919
  13327. }
  13328. @media(max-width:47.99em) {
  13329. .refine-search-button {
  13330. align-self: stretch;
  13331. border-left: 1px solid #ddd;
  13332. padding: 0
  13333. }
  13334. }
  13335. @media(min-width:48em) {
  13336. .refine-search-button {
  13337. margin-right: 20px
  13338. }
  13339. }
  13340. .refine-search-button:hover {
  13341. fill: #fff
  13342. }
  13343. .refine-search-button__inner {
  13344. display: flex;
  13345. align-items: center;
  13346. justify-content: center
  13347. }
  13348. @media(max-width:47.99em) {
  13349. .refine-search-button__inner {
  13350. min-height: 70px;
  13351. width: 70px
  13352. }
  13353. }
  13354. @media(max-width:47.99em) {
  13355. .refine-search-button__text {
  13356. display: none
  13357. }
  13358. }
  13359. @media(min-width:48em) {
  13360. .refine-search-button__sprite {
  13361. margin-right: 10px
  13362. }
  13363. }
  13364. @media(max-width:47.99em) {
  13365. .refine-search-button--placeholder {
  13366. display: flex;
  13367. justify-content: center;
  13368. align-items: center;
  13369. border-left: 0
  13370. }
  13371. .refine-search-button--placeholder .loading-placeholder__inner {
  13372. max-width: 28px
  13373. }
  13374. }
  13375. .notification-bar__inner {
  13376. padding: 10px 20px;
  13377. display: flex;
  13378. height: 70px;
  13379. align-items: center
  13380. }
  13381. .notification-bar__inner:empty {
  13382. display: none
  13383. }
  13384. .notification-bar__content-inner {
  13385. padding-right: 20px
  13386. }
  13387. .search-results-list,
  13388. .search-results-list-error-tile {
  13389. width: 100%
  13390. }
  13391. .search-results-list__inner {
  13392. display: flex;
  13393. flex-direction: column;
  13394. list-style: none;
  13395. padding: 0;
  13396. margin-top: 0;
  13397. margin-bottom: 0
  13398. }
  13399. .search-results-list--hidden {
  13400. display: none
  13401. }
  13402. .search-results-list-error-tile {
  13403. margin: 40px 20px
  13404. }
  13405. .search-result-item {
  13406. border-bottom: 1px solid #ddd
  13407. }
  13408. .search-result-item__clickable-wrapper {
  13409. display: block;
  13410. width: 100%;
  13411. text-align: left
  13412. }
  13413. .search-result-item__inner {
  13414. background-color: #fff;
  13415. padding: 30px 20px;
  13416. display: flex;
  13417. flex-direction: row
  13418. }
  13419. @media(min-width:48em) {
  13420. .search-result-item__inner {
  13421. padding: 20px
  13422. }
  13423. }
  13424. @media(min-width:64em) {
  13425. .search-result-item__inner {
  13426. padding: 40px
  13427. }
  13428. }
  13429. .search-result-item__marker {
  13430. margin-right: 10px;
  13431. margin-left: -10px;
  13432. margin-top: -5px
  13433. }
  13434. @media(min-width:64em) {
  13435. .search-result-item__marker {
  13436. margin-top: -10px
  13437. }
  13438. }
  13439. .search-result-item__marker-icon {
  13440. height: 40px;
  13441. width: 40px
  13442. }
  13443. @media(min-width:64em) {
  13444. .search-result-item__marker-icon {
  13445. height: 50px;
  13446. width: 50px
  13447. }
  13448. }
  13449. .search-result-item__marker-icon--placeholder {
  13450. opacity: .3;
  13451. animation: PlaceholderBreathe 1s ease-in-out infinite alternate
  13452. }
  13453. .search-result-item__content {
  13454. flex: 4 0 0;
  13455. width: 100%
  13456. }
  13457. .search-result-item__name {
  13458. margin-top: 0;
  13459. margin-right: 20px;
  13460. line-height: 1.3;
  13461. margin-bottom: 6px;
  13462. max-width: 210px
  13463. }
  13464. @media(min-width:48em) {
  13465. .search-result-item__name {
  13466. max-width: 180px
  13467. }
  13468. }
  13469. .search-result-item__address1,
  13470. .search-result-item__address2 {
  13471. margin-top: 0;
  13472. margin-bottom: 5px;
  13473. margin-right: 30%
  13474. }
  13475. .search-result-item__address2 {
  13476. margin-bottom: 20px
  13477. }
  13478. .search-result-item__header {
  13479. display: flex;
  13480. align-items: flex-start
  13481. }
  13482. .search-result-item__footer {
  13483. display: flex;
  13484. align-items: center
  13485. }
  13486. .search-result-item__distance {
  13487. flex-grow: 1;
  13488. white-space: nowrap;
  13489. text-align: right;
  13490. margin-top: 0;
  13491. line-height: 1.3;
  13492. margin-bottom: 6px
  13493. }
  13494. .search-result-item__hours {
  13495. margin: 0 20px 0 0;
  13496. text-decoration: none;
  13497. color: #191919
  13498. }
  13499. @media(min-width:48em) {
  13500. .search-result-item__hours {
  13501. margin: 0 40px 0 0
  13502. }
  13503. }
  13504. .search-result-item__service {
  13505. margin: 0;
  13506. text-decoration: none;
  13507. color: #191919
  13508. }
  13509. .search-result-item__hours-icon {
  13510. width: 16px;
  13511. height: 16px;
  13512. margin-right: 6px;
  13513. color: #191919
  13514. }
  13515. @media(min-width:48em) {
  13516. .search-result-item__hours-icon {
  13517. width: 26px;
  13518. height: 26px;
  13519. margin-right: 10px
  13520. }
  13521. }
  13522. .search-result-item__gas-bar-icon {
  13523. width: 16px;
  13524. height: 16px;
  13525. margin-right: 6px;
  13526. fill: #8a8a8a
  13527. }
  13528. @media(min-width:48em) {
  13529. .search-result-item__gas-bar-icon {
  13530. width: 26px;
  13531. height: 26px;
  13532. margin-right: 10px
  13533. }
  13534. }
  13535. .search-results-map {
  13536. flex: 2 0 0;
  13537. position: relative;
  13538. order: 1;
  13539. height: 175px;
  13540. flex-basis: 100%
  13541. }
  13542. @media(min-width:48em) {
  13543. .search-results-map {
  13544. height: 600px
  13545. }
  13546. }
  13547. .search-results-map__inner {
  13548. top: 0;
  13549. left: 0;
  13550. width: 100%;
  13551. height: 100%;
  13552. position: absolute
  13553. }
  13554. .store-details-header {
  13555. position: relative;
  13556. background-color: #fff
  13557. }
  13558. .store-details-header .utility-header-bg {
  13559. min-height: 200px
  13560. }
  13561. @media(min-width:64em) {
  13562. .store-details-header .utility-header-bg {
  13563. min-height: 220px
  13564. }
  13565. }
  13566. .store-details-header__inner {
  13567. position: relative;
  13568. display: flex;
  13569. flex-direction: column;
  13570. height: 200px
  13571. }
  13572. @media(min-width:48em) {
  13573. .store-details-header__inner {
  13574. height: 220px
  13575. }
  13576. }
  13577. .store-details-header__logo {
  13578. max-height: 60px
  13579. }
  13580. @media(max-width:47.99em) {
  13581. .store-details-header__logo {
  13582. max-width: 250px
  13583. }
  13584. }
  13585. .store-details-header__name {
  13586. color: inherit;
  13587. margin-top: 10px;
  13588. margin-bottom: 0;
  13589. -webkit-font-smoothing: antialiased
  13590. }
  13591. .store-details-header__hours {
  13592. display: flex;
  13593. align-items: center;
  13594. justify-content: center;
  13595. color: #191919
  13596. }
  13597. .store-details-header__hours .sprite {
  13598. color: #191919;
  13599. margin-right: 10px
  13600. }
  13601. .store-details-header__hours--placeholder {
  13602. margin-top: 20px
  13603. }
  13604. .store-details-header__hours-placeholder:last-child:not(:only-child) {
  13605. margin-left: 30px
  13606. }
  13607. .store-details-header__content {
  13608. display: flex;
  13609. flex-direction: column;
  13610. align-items: center;
  13611. justify-content: center;
  13612. width: 100%;
  13613. min-height: 200px;
  13614. position: absolute;
  13615. top: 0;
  13616. left: 0;
  13617. bottom: 0
  13618. }
  13619. @media(min-width:48em) {
  13620. .store-details-header__content {
  13621. min-height: 220px
  13622. }
  13623. }
  13624. .shopping-info-tile__inner {
  13625. line-height: 1.25rem
  13626. }
  13627. .shopping-info-tile__inner p {
  13628. margin: 0
  13629. }
  13630. .shopping-info-tile__inner ul {
  13631. list-style-type: disc;
  13632. padding-left: 16px;
  13633. margin-top: 16px;
  13634. font-size: .875rem
  13635. }
  13636. .shopping-info-tile__marker {
  13637. width: 31px;
  13638. height: auto;
  13639. margin: 10px 5px 0
  13640. }
  13641. @media(min-width:64em) {
  13642. .shopping-info-tile__marker {
  13643. margin: 16px 10px 0
  13644. }
  13645. }
  13646. .what-to-expect-in-store {
  13647. margin: 0 auto;
  13648. max-width: 920px
  13649. }
  13650. .what-to-expect-in-store__content {
  13651. margin-bottom: 30px
  13652. }
  13653. @media(min-width:48em) {
  13654. .what-to-expect-in-store__content {
  13655. background: #f0f0f0;
  13656. padding: 40px;
  13657. margin-bottom: 0
  13658. }
  13659. }
  13660. .what-to-expect-in-store__content p:first-of-type {
  13661. margin-top: 0
  13662. }
  13663. .what-to-expect-in-store__content p:last-of-type {
  13664. margin-top: 16px
  13665. }
  13666. .account-setting--security .what-to-expect-in-store .account-setting__turn-off-button .sprite,
  13667. .account-setting--security .what-to-expect-in-store .account-setting__turn-on-button .sprite,
  13668. .points-days-cta-section__content .what-to-expect-in-store .cta-section__link .sprite,
  13669. .what-to-expect-in-store .account-setting--security .account-setting__turn-off-button .sprite,
  13670. .what-to-expect-in-store .account-setting--security .account-setting__turn-on-button .sprite,
  13671. .what-to-expect-in-store .button .sprite,
  13672. .what-to-expect-in-store .household-grid__invite-button .sprite,
  13673. .what-to-expect-in-store .link--theme-button--large-primary .sprite,
  13674. .what-to-expect-in-store .link--theme-button--large-secondary .sprite,
  13675. .what-to-expect-in-store .link--theme-button--small-primary .sprite,
  13676. .what-to-expect-in-store .link--theme-button--small-secondary .sprite,
  13677. .what-to-expect-in-store .link--theme-button-gray .sprite,
  13678. .what-to-expect-in-store .link--theme-button-red .sprite,
  13679. .what-to-expect-in-store .link--theme-button-transparent-white .sprite,
  13680. .what-to-expect-in-store .link--theme-button-transparent .sprite,
  13681. .what-to-expect-in-store .link--theme-button-white .sprite,
  13682. .what-to-expect-in-store .link--theme-button .sprite,
  13683. .what-to-expect-in-store .load-shop-pay-header__link .sprite,
  13684. .what-to-expect-in-store .load-shop-pay-module__link .sprite,
  13685. .what-to-expect-in-store .marketing-page-header__link .sprite,
  13686. .what-to-expect-in-store .marketing-page-module__link .sprite,
  13687. .what-to-expect-in-store .partnership-perk-details__cta .sprite,
  13688. .what-to-expect-in-store .partnership-perk-redeemed-success__cta .sprite,
  13689. .what-to-expect-in-store .points-days-cta-section__content .cta-section__link .sprite,
  13690. .what-to-expect-in-store .points-days__cta .sprite {
  13691. width: 12px;
  13692. height: 12px;
  13693. margin-right: 10px
  13694. }
  13695. .what-to-expect-in-store h1 {
  13696. margin: 30px 0 16px
  13697. }
  13698. @media(min-width:48em) {
  13699. .what-to-expect-in-store h1 {
  13700. margin: 48px 0 24px
  13701. }
  13702. }
  13703. .what-to-expect-in-store ul {
  13704. padding-left: 16px;
  13705. margin: 0
  13706. }
  13707. .what-to-expect-in-store ul li {
  13708. margin-bottom: 8px
  13709. }
  13710. .more-ways-to-shop {
  13711. margin: 0 auto;
  13712. max-width: 920px;
  13713. border-top: 1px solid #f0f0f0
  13714. }
  13715. @media(min-width:48em) {
  13716. .more-ways-to-shop {
  13717. border-top: none
  13718. }
  13719. }
  13720. .more-ways-to-shop__content>p {
  13721. margin-bottom: 24px
  13722. }
  13723. @media(min-width:48em) {
  13724. .more-ways-to-shop__content {
  13725. background: #f0f0f0;
  13726. padding: 40px
  13727. }
  13728. .more-ways-to-shop__content>p {
  13729. margin-bottom: 40px
  13730. }
  13731. }
  13732. .more-ways-to-shop__inner>div {
  13733. margin-bottom: 24px
  13734. }
  13735. @media(min-width:48em) {
  13736. .more-ways-to-shop__inner {
  13737. display: flex
  13738. }
  13739. .more-ways-to-shop__inner>div {
  13740. flex-basis: 50%;
  13741. flex-shrink: 0
  13742. }
  13743. }
  13744. .more-ways-to-shop__inner .donate-banner__fake-cta,
  13745. .more-ways-to-shop__inner .new-window-link,
  13746. .more-ways-to-shop__inner .tile-item__fake-cta,
  13747. .more-ways-to-shop__inner .video-tile__fake-cta {
  13748. display: block;
  13749. margin: 24px 0 8px
  13750. }
  13751. @media(min-width:48em) {
  13752. .more-ways-to-shop__inner .donate-banner__fake-cta,
  13753. .more-ways-to-shop__inner .new-window-link,
  13754. .more-ways-to-shop__inner .tile-item__fake-cta,
  13755. .more-ways-to-shop__inner .video-tile__fake-cta {
  13756. margin: 32px 0 8px;
  13757. max-width: 255px
  13758. }
  13759. }
  13760. .more-ways-to-shop__inner p {
  13761. margin: 0 0 16px;
  13762. line-height: 1.5rem
  13763. }
  13764. @media(min-width:48em) {
  13765. .more-ways-to-shop__pc-express {
  13766. padding-right: 40px
  13767. }
  13768. }
  13769. .more-ways-to-shop__pc-express .sprite {
  13770. width: 130px;
  13771. height: 32px;
  13772. margin-bottom: 16px
  13773. }
  13774. @media(min-width:48em) {
  13775. .more-ways-to-shop__delivery {
  13776. padding-left: 40px;
  13777. border-left: 1px solid #8a8a8a
  13778. }
  13779. }
  13780. @media(min-width:48em) {
  13781. .more-ways-to-shop__delivery div {
  13782. max-width: 255px
  13783. }
  13784. }
  13785. .more-ways-to-shop__delivery div p {
  13786. font-size: .875rem;
  13787. text-align: center;
  13788. margin: 0
  13789. }
  13790. .more-ways-to-shop h1 {
  13791. margin: 30px 0 16px
  13792. }
  13793. @media(min-width:48em) {
  13794. .more-ways-to-shop h1 {
  13795. margin: 48px 0 24px
  13796. }
  13797. }
  13798. .flyer-result {
  13799. width: 100%;
  13800. cursor: pointer;
  13801. position: relative
  13802. }
  13803. @media(min-width:48em) {
  13804. .flyer-result {
  13805. width: 48%
  13806. }
  13807. }
  13808. .flyer-result__content {
  13809. padding: 20px;
  13810. display: flex;
  13811. margin-bottom: 40px
  13812. }
  13813. @media(min-width:48em) {
  13814. .flyer-result__content {
  13815. margin-bottom: 50px
  13816. }
  13817. }
  13818. .flyer-result__info {
  13819. margin-left: 30px
  13820. }
  13821. .flyer-result__info--placeholder {
  13822. max-width: 50%
  13823. }
  13824. .flyer-result__preview {
  13825. flex-shrink: 0;
  13826. width: 80px;
  13827. max-height: 200px;
  13828. overflow: hidden
  13829. }
  13830. @media(min-width:48em) {
  13831. .flyer-result__preview {
  13832. width: 125px
  13833. }
  13834. }
  13835. .flyer-result__preview img {
  13836. display: block;
  13837. height: 100%;
  13838. margin: 0 auto
  13839. }
  13840. .flyer-result__preview--placeholder {
  13841. max-height: 130px
  13842. }
  13843. .flyer-result__address {
  13844. font-style: normal;
  13845. margin: 1em 0
  13846. }
  13847. .flyer-result__footer {
  13848. display: flex;
  13849. align-items: center;
  13850. min-height: 40px;
  13851. width: 100%;
  13852. padding-left: 20px;
  13853. padding-right: 20px;
  13854. position: absolute;
  13855. bottom: 0
  13856. }
  13857. .flyer-result__footer--placeholder {
  13858. min-height: 33px;
  13859. padding: 10px 20px
  13860. }
  13861. .flyer-result__footer-container {
  13862. width: 100%;
  13863. display: flex;
  13864. justify-content: space-between
  13865. }
  13866. .flyer-result__no-flyers {
  13867. text-transform: uppercase
  13868. }
  13869. .flyer-result--placeholder {
  13870. pointer-events: none
  13871. }
  13872. .flyer-result--disabled {
  13873. cursor: not-allowed
  13874. }
  13875. .flyer-store-details {
  13876. display: flex;
  13877. position: relative;
  13878. color: #585858
  13879. }
  13880. .flyer-store-details__inner {
  13881. position: absolute;
  13882. z-index: 1;
  13883. right: 0;
  13884. top: 70px;
  13885. width: 260px;
  13886. background: #fff;
  13887. border: 1px solid #ddd
  13888. }
  13889. .flyer-store-details__contact {
  13890. margin-bottom: 20px;
  13891. padding-left: 20px;
  13892. padding-right: 20px;
  13893. border-bottom: 1px solid #f0f0f0
  13894. }
  13895. .flyer-store-details__contact-header {
  13896. color: #585858;
  13897. margin-bottom: 0
  13898. }
  13899. .flyer-store-details__contact-address {
  13900. font-style: normal;
  13901. font-size: 14px;
  13902. color: #585858;
  13903. margin-top: 0;
  13904. margin-bottom: 1em
  13905. }
  13906. .flyer-store-details__hours {
  13907. margin-top: 20px;
  13908. padding-left: 20px;
  13909. padding-right: 20px;
  13910. font-size: 14px
  13911. }
  13912. .flyer-store-details__hours-day {
  13913. display: flex;
  13914. justify-content: space-between;
  13915. text-align: right;
  13916. margin: 0
  13917. }
  13918. .flyer-store-details__link {
  13919. display: block;
  13920. margin: 20px;
  13921. border-color: #ee3124;
  13922. color: #ee3124
  13923. }
  13924. .flyer-store-details__button {
  13925. display: flex;
  13926. align-items: center;
  13927. height: 70px;
  13928. background: #fff;
  13929. margin-left: auto;
  13930. padding-left: 5px;
  13931. text-decoration: none
  13932. }
  13933. .flyer-store-details__button-text {
  13934. text-decoration: underline
  13935. }
  13936. @media(max-width:34.365em) {
  13937. .flyer-store-details__button-text {
  13938. display: none
  13939. }
  13940. }
  13941. .flyer-store-details__arrow {
  13942. fill: #ee3124;
  13943. transform: rotate(90deg)
  13944. }
  13945. @media(min-width:34.375em) {
  13946. .flyer-store-details__store-icon {
  13947. display: none
  13948. }
  13949. }
  13950. .flyer-store-details--expanded {
  13951. z-index: 2
  13952. }
  13953. .flyer-store-details--expanded .flyer-store-details__store-icon {
  13954. fill: #ee3124
  13955. }
  13956. .flyer-store-details--expanded .flyer-store-details__arrow {
  13957. transform: rotate(-90deg)
  13958. }
  13959. .flyer-store-details--expanded .flyer-store-details__button-text {
  13960. color: #ee3124
  13961. }
  13962. .flipp-placeholder {
  13963. position: relative
  13964. }
  13965. .flipp-placeholder__page-container {
  13966. display: flex;
  13967. overflow-x: hidden
  13968. }
  13969. .flipp-placeholder__page {
  13970. width: 65%;
  13971. flex: 0 0 65%;
  13972. height: 600px
  13973. }
  13974. @media(min-width:48em) {
  13975. .flipp-placeholder__page {
  13976. width: 350px;
  13977. flex: 0 0 350px;
  13978. height: 700px
  13979. }
  13980. }
  13981. .flipp-placeholder__page:nth-child(n+3) {
  13982. display: none
  13983. }
  13984. @media(min-width:48em) {
  13985. .flipp-placeholder__page:nth-child(n+3) {
  13986. display: block
  13987. }
  13988. }
  13989. .flipp-placeholder__page:not(:first-child) {
  13990. margin-left: 20px
  13991. }
  13992. .flipp-iframe main {
  13993. display: flex !important;
  13994. justify-content: center
  13995. }
  13996. .flipp-iframe main iframe {
  13997. max-width: 1024px
  13998. }
  13999. .flipp-modal-content {
  14000. max-width: 320px;
  14001. position: relative;
  14002. border-radius: 10px;
  14003. background-color: #fff;
  14004. border: 1px solid #e9e9e9;
  14005. max-height: calc(100vh - 150px);
  14006. height: auto;
  14007. overflow-y: auto;
  14008. overflow-x: hidden
  14009. }
  14010. @media(min-width:48em) {
  14011. .flipp-modal-content {
  14012. max-width: 768px
  14013. }
  14014. }
  14015. @media(min-width:64em) {
  14016. .flipp-modal-content {
  14017. max-width: 1024px
  14018. }
  14019. }
  14020. .flipp-modal-content .flipp-item-detail-img,
  14021. .flipp-modal-content .flipp-item-detail-vid {
  14022. display: flex;
  14023. justify-content: center;
  14024. border-bottom: 1px solid #e9e9e9
  14025. }
  14026. .flipp-modal-content .flipp-item-detail-img img,
  14027. .flipp-modal-content .flipp-item-detail-vid img {
  14028. max-height: 380px;
  14029. max-width: 320px;
  14030. padding: 50px 20px
  14031. }
  14032. @media(min-width:48em) {
  14033. .flipp-modal-content .flipp-item-detail-img img,
  14034. .flipp-modal-content .flipp-item-detail-vid img {
  14035. max-width: 768px
  14036. }
  14037. }
  14038. @media(min-width:64em) {
  14039. .flipp-modal-content .flipp-item-detail-img img,
  14040. .flipp-modal-content .flipp-item-detail-vid img {
  14041. max-width: 1024px
  14042. }
  14043. }
  14044. .flipp-modal-content .flipp-item-detail-header {
  14045. padding: 14px 24px;
  14046. border-bottom: 1px solid #e7e7e7
  14047. }
  14048. .flipp-modal-content .flipp-item-detail-header p {
  14049. font-weight: 400;
  14050. font-size: 22px;
  14051. line-height: 27px
  14052. }
  14053. .flipp-modal-content .flipp-item-detail-header-shopping-list {
  14054. margin-top: 8px
  14055. }
  14056. .flipp-modal-content .flipp-item-detail-info {
  14057. background: #f8f8f8;
  14058. padding: 24px;
  14059. border-bottom: 1px solid #e7e7e7
  14060. }
  14061. .flipp-modal-content .flipp-item-detail-info-price-text {
  14062. margin-bottom: 8px
  14063. }
  14064. .flipp-modal-content .flipp-item-detail-info-price-text p {
  14065. color: #d41e1e;
  14066. font-size: 20px;
  14067. margin: 0
  14068. }
  14069. .flipp-modal-content .flipp-item-detail-info-salestory {
  14070. font-size: 14px;
  14071. margin-bottom: 12px
  14072. }
  14073. .flipp-modal-content .flipp-item-detail-info-valid-date {
  14074. color: #707070;
  14075. font-size: 14px
  14076. }
  14077. .flipp-modal-content .flipp-item-detail-description {
  14078. padding: 14px 24px
  14079. }
  14080. .flipp-modal-content .flipp-item-detail-footer {
  14081. padding: 20px 24px 24px;
  14082. border-bottom: 1px solid #e7e7e7
  14083. }
  14084. .flipp-modal-content .flipp-item-detail-footer-note {
  14085. font-size: 12px;
  14086. color: #6d6e71;
  14087. font-style: italic
  14088. }
  14089. .flipp-modal-content .flipp-item-detail-button {
  14090. display: flex;
  14091. justify-content: space-around;
  14092. padding: 20px 0
  14093. }
  14094. .flipp-modal-content .flipp-item-detail-button a {
  14095. display: flex;
  14096. align-items: center;
  14097. justify-content: center;
  14098. text-decoration: none;
  14099. box-sizing: border-box;
  14100. height: 40px;
  14101. width: 160px;
  14102. cursor: pointer;
  14103. font-weight: 700;
  14104. font-size: 14px;
  14105. background-color: #1a75cf;
  14106. border: 1px solid #1a75cf;
  14107. border-radius: 22px;
  14108. color: #fff
  14109. }
  14110. .eflyers-subscription-header {
  14111. height: 250px;
  14112. margin-bottom: 18px;
  14113. padding-top: 26px;
  14114. padding-bottom: 34px
  14115. }
  14116. @media(min-width:48em) {
  14117. .eflyers-subscription-header {
  14118. margin-bottom: 32px;
  14119. padding-top: 32px;
  14120. padding-bottom: 32px
  14121. }
  14122. }
  14123. .eflyers-subscription-header__title {
  14124. font-size: 3.125rem;
  14125. line-height: 2.9375rem;
  14126. margin: 0 0 28px
  14127. }
  14128. @media(min-width:48em) {
  14129. .eflyers-subscription-header__title {
  14130. font-size: 2.625rem;
  14131. line-height: 3.4375rem;
  14132. margin: 0 0 24px
  14133. }
  14134. }
  14135. .eflyers-subscription-header__subtitle {
  14136. font-size: .9375rem;
  14137. font-weight: 700;
  14138. line-height: 1.3125rem;
  14139. margin: 0
  14140. }
  14141. @media(min-width:48em) {
  14142. .eflyers-subscription-header__subtitle {
  14143. font-size: 1rem;
  14144. line-height: 1.5rem
  14145. }
  14146. }
  14147. .eflyers-subscription__container {
  14148. padding-bottom: 32px
  14149. }
  14150. @media(min-width:48em) {
  14151. .eflyers-subscription__container {
  14152. max-width: 840px;
  14153. padding: 0 0 112px
  14154. }
  14155. }
  14156. .eflyers-subscription-form-container {
  14157. background-color: #fff;
  14158. padding: 20px
  14159. }
  14160. @media(min-width:48em) {
  14161. .eflyers-subscription-form-container {
  14162. padding: 32px
  14163. }
  14164. }
  14165. .eflyers-subscription-form {
  14166. background-color: #fff
  14167. }
  14168. @media(min-width:48em) {
  14169. .eflyers-subscription-form {
  14170. display: flex;
  14171. flex-wrap: wrap;
  14172. justify-content: space-between
  14173. }
  14174. }
  14175. .eflyers-subscription-form__input-horizontal {
  14176. margin: 0 0 24px
  14177. }
  14178. @media(min-width:48em) {
  14179. .eflyers-subscription-form__input-horizontal {
  14180. display: inline-block;
  14181. margin: 0 0 24px;
  14182. width: calc(50% - 12px)
  14183. }
  14184. }
  14185. .eflyers-subscription-form__input-vertical {
  14186. margin: 0 0 24px
  14187. }
  14188. .eflyers-subscription-form__input-vertical p {
  14189. margin: 0
  14190. }
  14191. .eflyers-subscription-form__submit-button {
  14192. margin: 0 auto;
  14193. width: auto
  14194. }
  14195. .eflyers-subscription-form__footnote {
  14196. margin: 24px 0 0;
  14197. text-align: center
  14198. }
  14199. .eflyers-subscription-success {
  14200. align-items: center;
  14201. background-color: #fff;
  14202. display: flex;
  14203. flex-direction: column;
  14204. margin: 0 auto;
  14205. max-width: 700px;
  14206. padding: 20px 20px 34px;
  14207. text-align: center
  14208. }
  14209. @media(min-width:48em) {
  14210. .eflyers-subscription-success {
  14211. padding-top: 32px
  14212. }
  14213. }
  14214. .eflyers-subscription-success__header {
  14215. font-size: 1.375rem;
  14216. line-height: 1.75rem;
  14217. margin: 0 0 16px
  14218. }
  14219. @media(min-width:48em) {
  14220. .eflyers-subscription-success__header {
  14221. font-size: 2rem;
  14222. line-height: 2.25rem
  14223. }
  14224. }
  14225. .weekly-flyer-opt-in {
  14226. background-color: #f0f0f0;
  14227. padding: 20px 0 30px
  14228. }
  14229. .weekly-flyer-opt-in__inner {
  14230. display: flex;
  14231. align-items: flex-start;
  14232. min-height: 72px;
  14233. max-width: 960px;
  14234. padding: 12px;
  14235. background: #fff;
  14236. box-shadow: 0 4px 0 #bcbcbc
  14237. }
  14238. @media(min-width:48em) {
  14239. .weekly-flyer-opt-in__inner {
  14240. padding: 12px
  14241. }
  14242. }
  14243. @media(min-width:64em) {
  14244. .weekly-flyer-opt-in__inner {
  14245. align-items: center
  14246. }
  14247. }
  14248. .weekly-flyer-opt-in__icon {
  14249. flex-shrink: 0;
  14250. margin-right: 20px;
  14251. height: 48px;
  14252. width: 48px
  14253. }
  14254. @media(min-width:48em) {
  14255. .weekly-flyer-opt-in__icon {
  14256. margin-right: 16px
  14257. }
  14258. }
  14259. .weekly-flyer-opt-in__text-group {
  14260. flex-grow: 1
  14261. }
  14262. .weekly-flyer-opt-in__title {
  14263. line-height: 24px;
  14264. font-size: 1rem;
  14265. color: #403840;
  14266. letter-spacing: 0;
  14267. margin: 0
  14268. }
  14269. @media(min-width:48em) {
  14270. .weekly-flyer-opt-in__title {
  14271. font-size: 1rem;
  14272. line-height: 24px
  14273. }
  14274. }
  14275. .weekly-flyer-opt-in__message {
  14276. font-size: .8125rem;
  14277. line-height: 18px
  14278. }
  14279. @media(min-width:48em) {
  14280. .weekly-flyer-opt-in__message {
  14281. font-size: .8125rem;
  14282. line-height: 18px
  14283. }
  14284. }
  14285. .weekly-flyer-opt-in__caret {
  14286. padding: 10px;
  14287. line-height: 0
  14288. }
  14289. .weekly-flyer-opt-in__caret .sprite {
  14290. fill: #ee3124;
  14291. width: 14px;
  14292. height: 14px
  14293. }
  14294. .visit-store__description {
  14295. text-align: center
  14296. }
  14297. @media(min-width:48em) {
  14298. .visit-store__description {
  14299. display: flex;
  14300. max-width: 460px
  14301. }
  14302. }
  14303. .visit-store__card-section {
  14304. margin: 0 20px
  14305. }
  14306. .visit-store__find-a-store {
  14307. display: block;
  14308. margin: 40px auto
  14309. }
  14310. @media(min-width:48em) {
  14311. .visit-store__find-a-store {
  14312. max-width: 200px
  14313. }
  14314. }
  14315. .visit-store__back-to-cards .sprite {
  14316. margin-top: -3px;
  14317. vertical-align: middle;
  14318. fill: #ee3124;
  14319. transform: rotate(180deg)
  14320. }
  14321. .transfer-video-line {
  14322. border: 0;
  14323. border-top: 1px solid #ddd;
  14324. margin: 10px auto
  14325. }
  14326. @media(min-width:48em) {
  14327. .transfer-video-line {
  14328. margin: 30px auto
  14329. }
  14330. }
  14331. .transfer-video-link {
  14332. display: inline-block;
  14333. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  14334. }
  14335. .transfer-video-link__icon {
  14336. vertical-align: middle;
  14337. margin-right: 10px;
  14338. width: 36px;
  14339. height: auto;
  14340. fill: transparent
  14341. }
  14342. @media(min-width:48em) {
  14343. .transfer-video-link__icon {
  14344. width: 56px
  14345. }
  14346. }
  14347. .transfer-video-link sup {
  14348. font-size: 10px
  14349. }
  14350. @media(min-width:48em) {
  14351. .member-care__description {
  14352. max-width: 420px
  14353. }
  14354. }
  14355. .member-care__find-a-store {
  14356. display: block;
  14357. margin: 40px auto 60px
  14358. }
  14359. @media(min-width:48em) {
  14360. .member-care__find-a-store {
  14361. max-width: 200px
  14362. }
  14363. }
  14364. .member-care__link-more-cards {
  14365. max-width: none;
  14366. margin: 0 10px
  14367. }
  14368. .enrol-communications-label__learn-more-button {
  14369. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  14370. }
  14371. .registration-confirmation {
  14372. background: linear-gradient(180deg, #f9dada, #f9dada 75%, snow 0, snow)
  14373. }
  14374. .registration-confirmation__container {
  14375. max-width: 400px;
  14376. margin: 0 auto;
  14377. padding: 0 16px;
  14378. text-align: center
  14379. }
  14380. @media(min-width:48em) {
  14381. .registration-confirmation__container {
  14382. max-width: 750px;
  14383. margin: 0 auto
  14384. }
  14385. }
  14386. .registration-confirmation__callout {
  14387. background: #fff;
  14388. margin: 16px 0 20px;
  14389. padding: 24px;
  14390. border-radius: 8px;
  14391. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14)
  14392. }
  14393. @media(min-width:48em) {
  14394. .registration-confirmation__callout {
  14395. max-width: 750px;
  14396. padding: 30px
  14397. }
  14398. }
  14399. .registration-confirmation__title {
  14400. margin-top: 40px;
  14401. color: #ac342a
  14402. }
  14403. @media(min-width:48em) {
  14404. .registration-confirmation__title {
  14405. margin-top: 60px
  14406. }
  14407. }
  14408. .registration-confirmation__subtitle {
  14409. margin: 0 auto;
  14410. width: 250px;
  14411. padding-bottom: 18px
  14412. }
  14413. @media(min-width:48em) {
  14414. .registration-confirmation__subtitle {
  14415. width: auto
  14416. }
  14417. }
  14418. .registration-confirmation__copy {
  14419. padding-top: 18px;
  14420. margin: 0 0 24px;
  14421. border-top: 1px solid rgba(158, 147, 166, .4)
  14422. }
  14423. .registration-confirmation__cta {
  14424. padding: 12px 24px;
  14425. display: inline-block
  14426. }
  14427. .registration-confirmation__offers-link {
  14428. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  14429. display: block;
  14430. margin-top: 24px;
  14431. color: #157a77
  14432. }
  14433. .registration-confirmation__offers-link:hover {
  14434. color: #615395
  14435. }
  14436. .registration-confirmation__cta-copy {
  14437. color: #fff
  14438. }
  14439. .registration-confirmation__image {
  14440. width: 90%;
  14441. margin: 0 0 20px
  14442. }
  14443. @media(min-width:48em) {
  14444. .registration-confirmation__image {
  14445. margin: 40px 0;
  14446. max-width: 550px
  14447. }
  14448. }
  14449. .registration-confirmation__terms {
  14450. background: snow;
  14451. padding: 25px 18px;
  14452. border-top: 1px solid rgba(158, 147, 166, .4)
  14453. }
  14454. .registration-confirmation__terms-copy {
  14455. margin: 0 auto
  14456. }
  14457. @media(min-width:48em) {
  14458. .registration-confirmation__terms-copy {
  14459. width: 90%;
  14460. max-width: 1000px
  14461. }
  14462. }
  14463. .claim-phone-number-modal-content {
  14464. width: 328px;
  14465. margin: auto;
  14466. background: #fff;
  14467. border-radius: 8px;
  14468. padding: 48px 16px 16px;
  14469. display: flex;
  14470. flex-direction: column;
  14471. position: relative
  14472. }
  14473. .claim-phone-number-modal-content .pco-modal-content__back,
  14474. .claim-phone-number-modal-content .pco-modal-content__close {
  14475. border: 2px solid transparent
  14476. }
  14477. .claim-phone-number-modal-content .pco-modal-content__back svg,
  14478. .claim-phone-number-modal-content .pco-modal-content__close svg {
  14479. stroke-width: 1px;
  14480. fill: #191919;
  14481. stroke: #191919
  14482. }
  14483. .claim-phone-number-modal-content .pco-modal-content__back:focus,
  14484. .claim-phone-number-modal-content .pco-modal-content__back:focus-within,
  14485. .claim-phone-number-modal-content .pco-modal-content__back:hover,
  14486. .claim-phone-number-modal-content .pco-modal-content__close:focus,
  14487. .claim-phone-number-modal-content .pco-modal-content__close:focus-within,
  14488. .claim-phone-number-modal-content .pco-modal-content__close:hover {
  14489. background-color: rgba(97, 83, 149, .0784313725)
  14490. }
  14491. .claim-phone-number-modal-content .pco-modal-content__back:active,
  14492. .claim-phone-number-modal-content .pco-modal-content__close:active {
  14493. background: #403840
  14494. }
  14495. .claim-phone-number-modal-content .pco-modal-content__back:active svg,
  14496. .claim-phone-number-modal-content .pco-modal-content__close:active svg {
  14497. fill: #fff;
  14498. stroke: #fff
  14499. }
  14500. .claim-phone-number-modal-content .pco-modal-content__back {
  14501. transform: rotate(180deg);
  14502. min-width: 0
  14503. }
  14504. .claim-phone-number-modal-content .pco-modal-content__back svg {
  14505. padding: 3px
  14506. }
  14507. .claim-phone-number-modal-content__text {
  14508. text-align: center;
  14509. border-bottom: 1px solid rgba(158, 147, 166, .25)
  14510. }
  14511. .claim-phone-number-modal-content__text h1 {
  14512. margin: 8px auto 0;
  14513. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  14514. }
  14515. .link-phone-number-modal-content {
  14516. width: 328px;
  14517. margin: auto;
  14518. background: #fff;
  14519. border-radius: 8px;
  14520. padding: 48px 16px 16px;
  14521. display: flex;
  14522. flex-direction: column;
  14523. position: relative
  14524. }
  14525. .link-phone-number-modal-content .account-setting {
  14526. padding: 8px
  14527. }
  14528. .link-phone-number-modal-content .account-setting__title {
  14529. text-align: center;
  14530. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  14531. font-size: 18px;
  14532. margin: 0 auto 14px
  14533. }
  14534. .link-phone-number-modal-content .account-setting__form-info {
  14535. text-align: center;
  14536. font-size: 12px;
  14537. line-height: 16px
  14538. }
  14539. .link-phone-number-modal-content .account-setting__submit-button {
  14540. display: block;
  14541. width: -moz-fit-content;
  14542. width: fit-content;
  14543. margin: 0 auto
  14544. }
  14545. .homepage-hero {
  14546. position: relative;
  14547. overflow: hidden;
  14548. padding-top: 60px;
  14549. background: linear-gradient(180deg, #feece8 1%, #feece8 45%, #f4dbd6)
  14550. }
  14551. @media(min-width:48em) {
  14552. .homepage-hero {
  14553. padding-top: 80px
  14554. }
  14555. }
  14556. .homepage-hero.default-hero {
  14557. background: #fff;
  14558. padding-top: 88px
  14559. }
  14560. @media(min-width:48em) {
  14561. .homepage-hero.default-hero {
  14562. padding-top: 60px
  14563. }
  14564. }
  14565. @media(min-width:64em) {
  14566. .homepage-hero.default-hero {
  14567. padding-top: 96px
  14568. }
  14569. }
  14570. .homepage-hero__pco-card-wrapper {
  14571. display: flex;
  14572. justify-content: center;
  14573. position: relative;
  14574. padding-bottom: 40px
  14575. }
  14576. .homepage-hero__ring-top-right {
  14577. position: absolute;
  14578. width: 166px;
  14579. height: 166px;
  14580. top: 50px;
  14581. right: -76px;
  14582. transform: rotate(135deg)
  14583. }
  14584. @media(max-width:47.99em) {
  14585. .homepage-hero__ring-top-right {
  14586. display: none
  14587. }
  14588. }
  14589. .homepage-hero__inner {
  14590. position: relative;
  14591. text-align: center
  14592. }
  14593. .homepage-hero__inner__inner {
  14594. display: flex
  14595. }
  14596. .homepage-hero__inner--pco {
  14597. padding-bottom: 80px
  14598. }
  14599. .homepage-hero__title {
  14600. color: #ee3124;
  14601. margin: 0 0 10px
  14602. }
  14603. .homepage-hero__subtitle {
  14604. margin: 0 auto 20px;
  14605. max-width: 460px
  14606. }
  14607. @media(min-width:48em) {
  14608. .homepage-hero__subtitle {
  14609. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  14610. font-size: 1rem;
  14611. line-height: 1.5;
  14612. margin-bottom: 40px
  14613. }
  14614. }
  14615. .homepage-hero__login-link {
  14616. display: inline-block
  14617. }
  14618. .homepage-hero__faq-link {
  14619. color: #fff;
  14620. padding: 16px 0
  14621. }
  14622. .default-hero .homepage-hero__inner {
  14623. display: flex;
  14624. flex-wrap: wrap;
  14625. justify-content: space-between
  14626. }
  14627. .default-hero .homepage-hero__text-section {
  14628. flex: 1 1 0%;
  14629. text-align: left;
  14630. padding-right: 40px;
  14631. display: flex;
  14632. flex-wrap: wrap;
  14633. align-content: center
  14634. }
  14635. @media(max-width:63.99em) {
  14636. .default-hero .homepage-hero__text-section {
  14637. align-content: flex-start
  14638. }
  14639. }
  14640. @media(max-width:47.99em) {
  14641. .default-hero .homepage-hero__text-section {
  14642. padding-right: 0;
  14643. flex: 1 1 100%;
  14644. z-index: 1
  14645. }
  14646. }
  14647. .default-hero .homepage-hero__image-section {
  14648. flex: 1 1 0%;
  14649. padding: 0 12px 0 28px
  14650. }
  14651. @media(max-width:47.99em) {
  14652. .default-hero .homepage-hero__image-section {
  14653. padding: 0;
  14654. flex: 1 1 100%
  14655. }
  14656. }
  14657. .default-hero .homepage-hero__title {
  14658. color: #ee3124;
  14659. margin-bottom: 24px;
  14660. width: 100%
  14661. }
  14662. .default-hero .homepage-hero__title--mobile {
  14663. text-align: left
  14664. }
  14665. @media(min-width:64em) {
  14666. .default-hero .homepage-hero__title--mobile {
  14667. display: none
  14668. }
  14669. }
  14670. @media(max-width:47.99em) {
  14671. .default-hero .homepage-hero__title--mobile {
  14672. font-size: 2rem
  14673. }
  14674. }
  14675. @media(max-width:63.99em) {
  14676. .default-hero .homepage-hero__title--desktop {
  14677. display: none
  14678. }
  14679. }
  14680. .default-hero .homepage-hero__subtitle {
  14681. font-family: Noir, sans-serif;
  14682. margin: 0 0 40px;
  14683. line-height: 1.33
  14684. }
  14685. @media(max-width:47.99em) {
  14686. .default-hero .homepage-hero__subtitle {
  14687. max-width: none;
  14688. flex-basis: 100%;
  14689. line-height: 1.4;
  14690. font-size: .9375rem;
  14691. margin: 0 0 32px
  14692. }
  14693. }
  14694. .default-hero .homepage-hero__graphic-container {
  14695. /* border: 4px solid #f79d90; */
  14696. display: flex
  14697. }
  14698. .default-hero .homepage-hero__graphic-container img {
  14699. width: 100%;
  14700. transform: translate(16px, -16px)
  14701. }
  14702. @media(max-width:47.99em) {
  14703. .default-hero .homepage-hero__graphic-container {
  14704. margin: -20px 20px 0
  14705. }
  14706. }
  14707. .ir-banner {
  14708. background: #24338a;
  14709. padding: 40px 0 30px;
  14710. overflow: hidden
  14711. }
  14712. .ir-banner__container {
  14713. display: flex;
  14714. flex-direction: column;
  14715. justify-content: space-between;
  14716. align-items: center
  14717. }
  14718. @media(min-width:48em) {
  14719. .ir-banner__container {
  14720. flex-direction: row
  14721. }
  14722. }
  14723. .ir-banner__header {
  14724. display: flex;
  14725. flex-direction: column;
  14726. align-items: center
  14727. }
  14728. @media(min-width:48em) {
  14729. .ir-banner__header {
  14730. display: block;
  14731. width: 660px
  14732. }
  14733. }
  14734. @media(min-width:64em) {
  14735. .ir-banner__header {
  14736. width: 691px
  14737. }
  14738. }
  14739. .ir-banner__content {
  14740. padding: 28px 0
  14741. }
  14742. .ir-banner__content,
  14743. .ir-banner__title {
  14744. color: #fff;
  14745. text-align: center
  14746. }
  14747. @media(min-width:48em) {
  14748. .ir-banner__content,
  14749. .ir-banner__title {
  14750. text-align: start
  14751. }
  14752. }
  14753. .ir-banner__cta {
  14754. width: 260px;
  14755. color: #191919
  14756. }
  14757. .ir-banner__cover-image {
  14758. width: 100vw;
  14759. margin: 28px -20px 0
  14760. }
  14761. @media(min-width:48em) {
  14762. .ir-banner__cover-image {
  14763. width: auto;
  14764. margin: 10px 0;
  14765. transform: translateX(40px)
  14766. }
  14767. }
  14768. @media(min-width:64em) {
  14769. .ir-banner__cover-image {
  14770. margin: 40px 0
  14771. }
  14772. }
  14773. @media(min-width:1280px) {
  14774. .ir-banner__cover-image {
  14775. transform: translateX(calc(50vw - 610px))
  14776. }
  14777. }
  14778. .ir-banner__cover-image img {
  14779. width: 100%
  14780. }
  14781. .ir-banner .no-margin {
  14782. margin: 0
  14783. }
  14784. .homepage-legacy {
  14785. background-color: #fff;
  14786. padding: 60px 0 70px;
  14787. text-align: center
  14788. }
  14789. @media(min-width:48em) {
  14790. .homepage-legacy {
  14791. padding: 40px 0
  14792. }
  14793. }
  14794. @media(min-width:64em) {
  14795. .homepage-legacy {
  14796. padding: 90px 0 110px
  14797. }
  14798. }
  14799. @media(min-width:48em) {
  14800. .homepage-legacy__inner {
  14801. display: flex;
  14802. flex-wrap: wrap;
  14803. justify-content: space-between;
  14804. align-items: center
  14805. }
  14806. }
  14807. .homepage-legacy__title {
  14808. margin: 0 0 40px;
  14809. width: 100%
  14810. }
  14811. @media(min-width:48em) {
  14812. .homepage-legacy__title {
  14813. padding: 0 3%
  14814. }
  14815. }
  14816. @media(min-width:64em) {
  14817. .homepage-legacy__title {
  14818. padding: 0 7%;
  14819. margin-bottom: 60px
  14820. }
  14821. }
  14822. .homepage-legacy__item-group {
  14823. width: 100%;
  14824. display: flex;
  14825. flex-flow: row wrap;
  14826. justify-content: space-between;
  14827. align-items: baseline
  14828. }
  14829. .homepage-legacy__item {
  14830. flex: 0 1
  14831. }
  14832. @media(max-width:34.365em) {
  14833. .homepage-legacy__item {
  14834. flex-basis: calc(50% - 13.5px)
  14835. }
  14836. }
  14837. @media(min-width:34.375em)and (max-width:63.99em) {
  14838. .homepage-legacy__item {
  14839. flex-basis: calc(50% - 40px)
  14840. }
  14841. }
  14842. @media(min-width:64em) {
  14843. .homepage-legacy__item {
  14844. flex-basis: calc(33.33333% - 66.66667px)
  14845. }
  14846. }
  14847. .homepage-legacy__item p {
  14848. margin: 20px 0 30px
  14849. }
  14850. .homepage-legacy .sprite {
  14851. display: block;
  14852. height: 46px;
  14853. width: 60px;
  14854. margin: auto
  14855. }
  14856. .homepage-legacy .sprite.homepage-legacy__receipt-sprite {
  14857. height: 56px
  14858. }
  14859. .homepage-pcf {
  14860. background: #f9dada;
  14861. padding: 60px 0 30px
  14862. }
  14863. @media(min-width:48em) {
  14864. .homepage-pcf {
  14865. padding: 40px 0
  14866. }
  14867. }
  14868. @media(min-width:48em) {
  14869. .homepage-pcf__inner {
  14870. display: flex;
  14871. justify-content: space-between;
  14872. align-items: center
  14873. }
  14874. }
  14875. .homepage-pcf__header {
  14876. display: flex;
  14877. flex-direction: column;
  14878. align-items: center;
  14879. text-align: center
  14880. }
  14881. @media(min-width:48em) {
  14882. .homepage-pcf__header {
  14883. text-align: left;
  14884. width: 660px
  14885. }
  14886. }
  14887. .homepage-pcf__title {
  14888. margin: 0 0 10px
  14889. }
  14890. @media(min-width:48em) {
  14891. .homepage-pcf__title {
  14892. margin: 0 0 16px
  14893. }
  14894. }
  14895. .homepage-pcf__title sup {
  14896. font-size: 1.2rem
  14897. }
  14898. .homepage-pcf__subtitle {
  14899. margin: 0
  14900. }
  14901. .homepage-pcf__subtitle:lang(en-CA) sup {
  14902. font-size: 1.4rem
  14903. }
  14904. .homepage-pcf__link {
  14905. display: flex;
  14906. margin: 28px auto 0
  14907. }
  14908. @media(min-width:48em) {
  14909. .homepage-pcf__link {
  14910. margin: 28px auto 0 0
  14911. }
  14912. }
  14913. .homepage-pcf__cta {
  14914. width: 260px
  14915. }
  14916. .homepage-pcf__image-container {
  14917. text-align: center;
  14918. max-width: 200px;
  14919. margin: 0 auto
  14920. }
  14921. @media(min-width:34.375em) {
  14922. .homepage-pcf__image-container {
  14923. max-width: 350px
  14924. }
  14925. }
  14926. @media(min-width:48em) {
  14927. .homepage-pcf__image-container {
  14928. margin: 0 0 0 20px
  14929. }
  14930. }
  14931. .homepage-pcf__image-container img {
  14932. max-width: 100%
  14933. }
  14934. .homepage-app {
  14935. background: #feece8
  14936. }
  14937. @media(max-width:47.99em) {
  14938. .homepage-app {
  14939. padding: 80px 0 0;
  14940. text-align: center
  14941. }
  14942. }
  14943. .homepage-app__inner {
  14944. max-width: 1250px;
  14945. overflow: hidden
  14946. }
  14947. @media(min-width:48em) {
  14948. .homepage-app__inner {
  14949. height: 400px;
  14950. display: flex;
  14951. justify-content: space-between;
  14952. align-items: center
  14953. }
  14954. }
  14955. @media(min-width:64em) {
  14956. .homepage-app__inner {
  14957. height: 600px
  14958. }
  14959. }
  14960. @media(min-width:48em) {
  14961. .homepage-app__header {
  14962. width: 730px
  14963. }
  14964. }
  14965. .homepage-app__title {
  14966. margin: 0 0 10px
  14967. }
  14968. @media(min-width:48em) {
  14969. .homepage-app__title {
  14970. margin: 0 0 16px
  14971. }
  14972. }
  14973. .homepage-app__subtitle {
  14974. margin: 0
  14975. }
  14976. .homepage-app__badges {
  14977. display: flex;
  14978. justify-content: center;
  14979. margin: 20px 0 0
  14980. }
  14981. @media(min-width:48em) {
  14982. .homepage-app__badges {
  14983. justify-content: flex-start;
  14984. margin: 30px 0 0
  14985. }
  14986. }
  14987. .homepage-app__badge-app:first-child {
  14988. margin-right: 10px
  14989. }
  14990. @media(min-width:34.375em) {
  14991. .homepage-app__badge-app:first-child {
  14992. margin-right: 20px
  14993. }
  14994. }
  14995. .homepage-app__badge-app-svg {
  14996. pointer-events: none;
  14997. width: 130px;
  14998. height: 40px
  14999. }
  15000. .homepage-app__phone-graphic {
  15001. margin: 40px 0 30px
  15002. }
  15003. @media(min-width:48em) {
  15004. .homepage-app__phone-graphic {
  15005. margin: 0 0 0 40px
  15006. }
  15007. }
  15008. @media(min-width:64em) {
  15009. .homepage-app__phone-graphic {
  15010. margin: 0 0 0 100px
  15011. }
  15012. }
  15013. .download-app {
  15014. background: #fdf0f0
  15015. }
  15016. @media(max-width:47.99em) {
  15017. .download-app {
  15018. padding: 70px 0 0
  15019. }
  15020. }
  15021. @media(min-width:34.375em) {
  15022. .download-app {
  15023. text-align: center
  15024. }
  15025. }
  15026. @media(min-width:48em) {
  15027. .download-app {
  15028. text-align: left
  15029. }
  15030. }
  15031. .download-app sup {
  15032. line-height: 0
  15033. }
  15034. .download-app .container,
  15035. .download-app .eflyers-subscription__container,
  15036. .download-app .homepage-join__inner,
  15037. .download-app .points-days-banners-section,
  15038. .download-app .points-days-cta-section,
  15039. .download-app .points-days-offers-section,
  15040. .download-app .points-days-ts-and-cs__container,
  15041. .download-app .weekly-flyer-opt-in__inner {
  15042. max-width: 1076px
  15043. }
  15044. @media(min-width:48em) {
  15045. .download-app__inner {
  15046. display: flex;
  15047. justify-content: space-between;
  15048. align-items: center
  15049. }
  15050. }
  15051. @media(max-width:34.365em) {
  15052. .download-app__text-container {
  15053. padding: 0 20px
  15054. }
  15055. }
  15056. @media(min-width:48em) {
  15057. .download-app__text-container {
  15058. width: 50%;
  15059. padding: 2rem 0
  15060. }
  15061. }
  15062. @media(min-width:64em) {
  15063. .download-app__text-container {
  15064. width: 40%
  15065. }
  15066. }
  15067. .download-app__title {
  15068. color: #655c6c;
  15069. margin: 0 0 1.4rem
  15070. }
  15071. @media(min-width:48em) {
  15072. .download-app__title.download-app__title-text {
  15073. margin: 0 0 2rem;
  15074. font-size: 2.625rem;
  15075. line-height: 3rem
  15076. }
  15077. }
  15078. .download-app__title.download-app__title-text sup {
  15079. font-size: 1.2rem
  15080. }
  15081. .download-app__subtitle {
  15082. color: #655c6c;
  15083. margin: 0
  15084. }
  15085. @media(max-width:47.99em) {
  15086. .download-app__subtitle.download-app__subtitle-text {
  15087. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  15088. font-weight: 400;
  15089. font-size: .9375rem;
  15090. line-height: 1.25rem
  15091. }
  15092. }
  15093. .download-app__badges {
  15094. display: flex;
  15095. justify-content: flex-start;
  15096. margin: 2rem 0 0
  15097. }
  15098. @media(min-width:34.375em) {
  15099. .download-app__badges {
  15100. justify-content: center
  15101. }
  15102. }
  15103. @media(min-width:48em) {
  15104. .download-app__badges {
  15105. justify-content: flex-start;
  15106. margin: 6rem 0 0
  15107. }
  15108. }
  15109. .download-app__badge-app:first-child {
  15110. margin-right: 10px
  15111. }
  15112. @media(min-width:34.375em) {
  15113. .download-app__badge-app:first-child {
  15114. margin-right: 20px
  15115. }
  15116. }
  15117. @media(max-width:34.365em) {
  15118. .download-app__badge-app img {
  15119. width: 110px;
  15120. height: 32px
  15121. }
  15122. }
  15123. .download-app__badge-app-svg {
  15124. pointer-events: none;
  15125. width: 110px;
  15126. height: 32px
  15127. }
  15128. @media(min-width:34.375em) {
  15129. .download-app__badge-app-svg {
  15130. width: 130px;
  15131. height: 40px
  15132. }
  15133. }
  15134. .download-app__image-container {
  15135. text-align: center;
  15136. max-width: 404px;
  15137. margin: 0 auto
  15138. }
  15139. @media(min-width:48em) {
  15140. .download-app__image-container {
  15141. margin: 0
  15142. }
  15143. }
  15144. .download-app__picture img {
  15145. max-width: 100%
  15146. }
  15147. .homepage-offers {
  15148. overflow: hidden;
  15149. background: #ee3124;
  15150. text-align: center
  15151. }
  15152. @media(min-width:48em) {
  15153. .homepage-offers__inner {
  15154. display: flex;
  15155. max-width: 1280px;
  15156. margin: auto
  15157. }
  15158. }
  15159. .homepage-offers__header {
  15160. padding: 70px 0;
  15161. position: relative;
  15162. -webkit-font-smoothing: antialiased
  15163. }
  15164. @media(min-width:48em) {
  15165. .homepage-offers__header {
  15166. flex: 0 0 50%;
  15167. display: flex;
  15168. align-items: center;
  15169. justify-content: center;
  15170. padding: 0
  15171. }
  15172. }
  15173. .homepage-offers__header * {
  15174. color: #fff
  15175. }
  15176. .homepage-offers__header-inner {
  15177. position: relative;
  15178. margin: 0 auto;
  15179. padding-left: 20px;
  15180. padding-right: 20px
  15181. }
  15182. @media(min-width:48em) {
  15183. .homepage-offers__header-inner {
  15184. padding: 20px 24px;
  15185. max-width: 540px
  15186. }
  15187. }
  15188. .homepage-offers__title {
  15189. margin: 0 0 10px
  15190. }
  15191. @media(min-width:48em)and (max-width:63.99em) {
  15192. .homepage-offers__title {
  15193. font-size: 2.25rem
  15194. }
  15195. }
  15196. .homepage-offers__subtitle {
  15197. margin: 0
  15198. }
  15199. @media(min-width:48em)and (max-width:63.99em) {
  15200. .homepage-offers__subtitle {
  15201. font-size: 1.25rem
  15202. }
  15203. }
  15204. .homepage-offers-grid {
  15205. display: flex;
  15206. flex-flow: row wrap;
  15207. margin: 0;
  15208. padding: 0
  15209. }
  15210. @media(min-width:48em) {
  15211. .homepage-offers-grid {
  15212. flex: 0 0 50%;
  15213. -webkit-font-smoothing: antialiased
  15214. }
  15215. }
  15216. .homepage-offers-grid__square {
  15217. position: relative;
  15218. list-style: none;
  15219. flex: 0 0 50%;
  15220. display: flex;
  15221. align-items: flex-start;
  15222. justify-content: center;
  15223. background-repeat: no-repeat;
  15224. background-position: 50%;
  15225. background-size: cover
  15226. }
  15227. .homepage-offers-grid__square-hack {
  15228. width: 100%
  15229. }
  15230. .homepage-offers-grid__square-hack-padding {
  15231. padding-bottom: 100%
  15232. }
  15233. .homepage-offers-grid__square-text {
  15234. position: absolute;
  15235. left: 10px;
  15236. right: 10px;
  15237. max-width: none;
  15238. top: 12%;
  15239. font-size: 3.7vw;
  15240. line-height: 1.4
  15241. }
  15242. @media(max-width:19.99em) {
  15243. .homepage-offers-grid__square-text {
  15244. font-size: .8125rem
  15245. }
  15246. }
  15247. @media(min-width:34.375em) {
  15248. .homepage-offers-grid__square-text {
  15249. font-size: 3vw;
  15250. left: 20px;
  15251. right: 20px;
  15252. top: 13%
  15253. }
  15254. }
  15255. @media(min-width:48em) {
  15256. .homepage-offers-grid__square-text {
  15257. font-size: 1.9vw
  15258. }
  15259. }
  15260. @media(min-width:64em) {
  15261. .homepage-offers-grid__square-text {
  15262. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  15263. font-size: 2.2vw
  15264. }
  15265. }
  15266. @media(min-width:80em) {
  15267. .homepage-offers-grid__square-text {
  15268. font-size: 1.75rem;
  15269. line-height: 1.285714286;
  15270. left: 30px;
  15271. right: 30px
  15272. }
  15273. }
  15274. .homepage-offers-grid__square:first-child {
  15275. background-image: url(/static/images/homepage/offer-strawberry.jpg)
  15276. }
  15277. .homepage-offers-grid__square:nth-child(2) {
  15278. background-image: url(/static/images/homepage/offer-eggs.jpg)
  15279. }
  15280. .homepage-offers-grid__square:nth-child(3) {
  15281. background-image: url(/static/images/homepage/offer-car.jpg)
  15282. }
  15283. .homepage-offers-grid__square:nth-child(4) {
  15284. background-image: url(/static/images/homepage/offer-makeup.jpg)
  15285. }
  15286. [lang=fr-CA] .homepage-offers-grid__square-text {
  15287. top: 10%
  15288. }
  15289. @media(min-width:48em) {
  15290. [lang=fr-CA] .homepage-offers-grid__square-text {
  15291. font-size: 1.8vw
  15292. }
  15293. }
  15294. @media(min-width:80em) {
  15295. [lang=fr-CA] .homepage-offers-grid__square-text {
  15296. font-size: 26px
  15297. }
  15298. }
  15299. .homepage-stores {
  15300. background: #fce5e3 url(/static/images/homepage/stores-background.png) no-repeat 50%/auto 100%;
  15301. padding-top: 70px;
  15302. padding-bottom: 80px
  15303. }
  15304. @media(min-width:34.375em) {
  15305. .homepage-stores {
  15306. padding: 90px 0
  15307. }
  15308. }
  15309. @media(min-width:48em) {
  15310. .homepage-stores {
  15311. padding-top: 120px;
  15312. padding-bottom: 140px
  15313. }
  15314. }
  15315. .homepage-stores__inner {
  15316. max-width: 780px;
  15317. text-align: center;
  15318. margin: 0 auto
  15319. }
  15320. .homepage-stores__title {
  15321. margin: 0
  15322. }
  15323. .homepage-stores__subtitle {
  15324. font-size: 1.875rem;
  15325. line-height: 1.2;
  15326. margin: 20px 0
  15327. }
  15328. @media(min-width:48em) {
  15329. .homepage-stores__subtitle {
  15330. font-size: 2.6875rem;
  15331. line-height: 1.162790698
  15332. }
  15333. }
  15334. .homepage-stores--results-shown {
  15335. padding-bottom: 40px
  15336. }
  15337. @media(min-width:48em) {
  15338. .homepage-stores--results-shown {
  15339. padding-bottom: 70px
  15340. }
  15341. }
  15342. .homepage-stores__search {
  15343. display: flex;
  15344. flex-flow: row nowrap;
  15345. width: 500px;
  15346. max-width: 100%;
  15347. border-bottom: 3px solid rgba(0, 0, 0, .1);
  15348. margin: 20px auto 0
  15349. }
  15350. .homepage-stores__search--full-width {
  15351. width: 100%
  15352. }
  15353. @media(min-width:48em) {
  15354. .homepage-stores__search {
  15355. margin-top: 30px
  15356. }
  15357. }
  15358. .homepage-stores__search-button {
  15359. position: relative;
  15360. min-width: 0;
  15361. flex-shrink: 0;
  15362. z-index: 1
  15363. }
  15364. @media(min-width:48em) {
  15365. .homepage-stores__search-button {
  15366. min-width: 160px
  15367. }
  15368. }
  15369. .homepage-stores__input {
  15370. background-color: #fff;
  15371. border: none;
  15372. height: 52px;
  15373. width: 100%;
  15374. padding-left: 50px;
  15375. line-height: normal
  15376. }
  15377. @media(max-width:34.365em) {
  15378. .homepage-stores__input {
  15379. font-size: .875rem
  15380. }
  15381. }
  15382. .homepage-stores__input-container {
  15383. position: relative;
  15384. flex-grow: 1
  15385. }
  15386. .homepage-stores__input-container .sprite {
  15387. pointer-events: none;
  15388. position: absolute;
  15389. margin-top: 15px;
  15390. margin-left: 15px
  15391. }
  15392. .homepage-province-stores {
  15393. margin-top: 40px
  15394. }
  15395. .homepage-province-stores__title {
  15396. margin: 0
  15397. }
  15398. .homepage-province-stores__rule {
  15399. border: 0;
  15400. border-top: 1px solid #ddd;
  15401. width: 50%;
  15402. margin: 20px auto
  15403. }
  15404. @media(min-width:48em) {
  15405. .homepage-province-stores__rule {
  15406. margin: 30px auto
  15407. }
  15408. }
  15409. .homepage-province-stores__logo-grid-container {
  15410. background: #fff;
  15411. padding: 24px 24px 0
  15412. }
  15413. @media(min-width:48em) {
  15414. .homepage-province-stores__logo-grid-container {
  15415. padding: 40px 50px 20px
  15416. }
  15417. }
  15418. .homepage-province-stores--error .homepage-province-stores__logo-grid-container {
  15419. padding: 24px
  15420. }
  15421. @media(min-width:48em) {
  15422. .homepage-province-stores--error .homepage-province-stores__logo-grid-container {
  15423. padding: 40px 50px
  15424. }
  15425. }
  15426. .homepage-faq {
  15427. padding: 70px 0 60px
  15428. }
  15429. @media(min-width:48em) {
  15430. .homepage-faq {
  15431. padding: 90px 0
  15432. }
  15433. }
  15434. .homepage-faq__title {
  15435. margin: 0 0 40px;
  15436. text-align: center
  15437. }
  15438. .homepage-faq__footer-links {
  15439. margin-top: 50px;
  15440. text-align: center
  15441. }
  15442. .homepage-faq__faq-link-button {
  15443. display: flex;
  15444. justify-content: center;
  15445. align-items: center;
  15446. width: 260px;
  15447. margin: 0 auto 20px
  15448. }
  15449. .homepage-faq__faq-link-button .new-window-link__icon {
  15450. margin: -1px 2px 0 8px
  15451. }
  15452. .homepage-faq__contact-us-link {
  15453. display: inline-block
  15454. }
  15455. .esso-redemption-faq__inner,
  15456. .homepage-faq__inner {
  15457. max-width: 996px;
  15458. margin: 0 auto;
  15459. display: flex;
  15460. flex-direction: column;
  15461. justify-content: center
  15462. }
  15463. .esso-redemption-faq {
  15464. background-color: #fff;
  15465. padding: 40px 24px
  15466. }
  15467. @media(min-width:48em) {
  15468. .esso-redemption-faq {
  15469. padding: 120px 0
  15470. }
  15471. }
  15472. .esso-redemption-faq__title {
  15473. margin: 0 0 20px;
  15474. text-align: center;
  15475. color: #655c6c
  15476. }
  15477. @media(min-width:48em) {
  15478. .esso-redemption-faq__title {
  15479. margin: 0 0 40px
  15480. }
  15481. }
  15482. .esso-redemption-faq__faq-link-button {
  15483. display: flex;
  15484. justify-content: center;
  15485. align-items: center;
  15486. background-color: #fff;
  15487. padding: 12px 24px 11px;
  15488. border-radius: 47px;
  15489. border: 1px solid #157a77;
  15490. color: #157a77;
  15491. width: -moz-max-content;
  15492. width: max-content;
  15493. margin: 0 auto
  15494. }
  15495. .esso-redemption-faq__faq-link-button:focus,
  15496. .esso-redemption-faq__faq-link-button:hover {
  15497. background-color: #fff;
  15498. border: 1px solid #615395;
  15499. color: #615395
  15500. }
  15501. .esso-redemption-faq__faq-link-button:active {
  15502. color: #403840
  15503. }
  15504. .esso-redemption-faq__faq-link-button .new-window-link__icon {
  15505. margin: -1px 2px 0 8px
  15506. }
  15507. .homepage-join {
  15508. position: relative;
  15509. overflow: hidden;
  15510. background-color: #feece8;
  15511. text-align: center;
  15512. padding: 90px 0 80px
  15513. }
  15514. @media(min-width:48em) {
  15515. .homepage-join {
  15516. padding: 90px 0 60px
  15517. }
  15518. }
  15519. .homepage-join__inner {
  15520. position: relative;
  15521. z-index: 1;
  15522. max-width: 780px
  15523. }
  15524. .homepage-join__title {
  15525. margin: 0 0 10px
  15526. }
  15527. @media(min-width:48em) {
  15528. .homepage-join__title {
  15529. margin: 0 0 16px
  15530. }
  15531. }
  15532. .homepage-join__subtitle {
  15533. margin: 0 0 30px
  15534. }
  15535. .homepage-join__link {
  15536. display: inline-block;
  15537. width: 260px
  15538. }
  15539. .donate-banner {
  15540. margin: 0 auto
  15541. }
  15542. .donate-banner__inner {
  15543. align-items: center;
  15544. background: #fff;
  15545. box-shadow: 0 4px 0 0 #bcbcbc;
  15546. display: flex;
  15547. margin: 24px 0 32px;
  15548. padding: 12px;
  15549. text-decoration: inherit
  15550. }
  15551. @media(min-width:48em) {
  15552. .donate-banner__inner {
  15553. background: #fff url(/static/images/brand/confetti-dots.png) no-repeat 50%;
  15554. background-size: cover;
  15555. flex-direction: column;
  15556. margin: 32px 0 40px;
  15557. padding: 8px 0 18px
  15558. }
  15559. }
  15560. .donate-banner__content {
  15561. display: flex;
  15562. flex-direction: column;
  15563. margin-left: 16px
  15564. }
  15565. @media(min-width:48em) {
  15566. .donate-banner__content {
  15567. align-items: center;
  15568. margin-left: 0
  15569. }
  15570. }
  15571. .donate-banner__title {
  15572. color: #403840;
  15573. font-size: 1rem;
  15574. line-height: 1.5rem;
  15575. margin: 0 0 4px
  15576. }
  15577. @media(min-width:48em) {
  15578. .donate-banner__title {
  15579. font-size: 1.3125rem;
  15580. line-height: 1.5625rem;
  15581. margin: 4px 0 8px
  15582. }
  15583. }
  15584. .donate-banner__fake-cta {
  15585. text-decoration: underline;
  15586. font-size: .8125rem;
  15587. margin: 0;
  15588. line-height: 1.125rem;
  15589. color: #157a77
  15590. }
  15591. .donate-banner__fake-cta:hover {
  15592. color: #615395
  15593. }
  15594. @media(min-width:48em) {
  15595. .donate-banner__fake-cta {
  15596. font-size: .9375rem
  15597. }
  15598. }
  15599. .donate-banner .sprite {
  15600. height: 48px;
  15601. width: 48px
  15602. }
  15603. @media(min-width:48em) {
  15604. .donate-banner .sprite {
  15605. height: 32px;
  15606. width: 32px
  15607. }
  15608. }
  15609. .points-dashboard-achievements {
  15610. background: #fff;
  15611. width: 100%;
  15612. padding: 24px 0;
  15613. position: relative;
  15614. overflow: hidden;
  15615. margin-top: 55px
  15616. }
  15617. @media(min-width:48em) {
  15618. .points-dashboard-achievements {
  15619. padding: 30px 0
  15620. }
  15621. }
  15622. .points-dashboard-achievements .utility-content {
  15623. margin: 0 auto
  15624. }
  15625. .points-dashboard-achievements__no-achievements {
  15626. line-height: 1.2
  15627. }
  15628. @media(min-width:48em) {
  15629. .points-dashboard-achievements__no-achievements {
  15630. line-height: .7
  15631. }
  15632. }
  15633. .points-dashboard-achievements__no-achievements p:first-of-type,
  15634. .points-dashboard-achievements__no-achievements p:nth-of-type(2) {
  15635. margin-top: 16px
  15636. }
  15637. .points-dashboard-achievements__no-achievements p:last-of-type {
  15638. margin-bottom: 30px
  15639. }
  15640. .points-dashboard-achievements__no-achievements .sprite {
  15641. width: 64px;
  15642. height: 64px
  15643. }
  15644. .points-dashboard-achievements__no-achievements .sprite:nth-of-type(2),
  15645. .points-dashboard-achievements__no-achievements .sprite:nth-of-type(3) {
  15646. position: relative;
  15647. right: 10px
  15648. }
  15649. .points-dashboard-achievements__no-achievements .sprite:nth-of-type(3) {
  15650. right: 20px
  15651. }
  15652. .points-dashboard-achievements__no-achievements .sprite:nth-of-type(2) {
  15653. z-index: 2
  15654. }
  15655. .points-dashboard-achievements__no-achievements .link {
  15656. width: 250px;
  15657. display: block
  15658. }
  15659. .points-dashboard-achievements .loading-placeholder__inner--black-background {
  15660. margin-top: 5px
  15661. }
  15662. .points-dashboard-achievements-background * {
  15663. position: absolute
  15664. }
  15665. .points-dashboard-achievements-background--circle {
  15666. transform: rotate(40deg);
  15667. width: 150px;
  15668. height: 150px;
  15669. right: -60px;
  15670. bottom: -70px
  15671. }
  15672. @media(min-width:48em) {
  15673. .points-dashboard-achievements-background--circle {
  15674. width: 400px;
  15675. height: 400px;
  15676. right: -200px;
  15677. bottom: -180px
  15678. }
  15679. }
  15680. .points-dashboard-achievements-background--dot {
  15681. top: -15px;
  15682. right: 40px;
  15683. width: 35px;
  15684. height: 35px
  15685. }
  15686. @media(min-width:48em) {
  15687. .points-dashboard-achievements-background--dot {
  15688. right: 150px
  15689. }
  15690. }
  15691. .points-dashboard-achievement {
  15692. display: flex;
  15693. margin-bottom: 20px
  15694. }
  15695. .points-dashboard-achievement .sprite {
  15696. width: 64px;
  15697. height: 64px
  15698. }
  15699. .points-dashboard-achievement__inner {
  15700. z-index: 0;
  15701. margin-left: 20px;
  15702. flex-grow: 1
  15703. }
  15704. .points-dashboard-achievement__inner:first-of-type {
  15705. margin-bottom: 32px
  15706. }
  15707. .points-dashboard-achievement__inner p {
  15708. margin: 0
  15709. }
  15710. .points-dashboard-achievement__inner p:nth-of-type(2) {
  15711. margin-top: 8px
  15712. }
  15713. .points-dashboard-achievement__inner p:first-of-type {
  15714. margin-top: 5px
  15715. }
  15716. .points-dashboard-achievement__inner div {
  15717. z-index: 2
  15718. }
  15719. .points-dashboard-achievement__inner .loading-placeholder {
  15720. margin-left: 20px
  15721. }
  15722. .points-dashboard-achievement__icon {
  15723. display: flex;
  15724. flex-direction: column;
  15725. align-items: center
  15726. }
  15727. @media(min-width:48em) {
  15728. .points-dashboard-achievement__icon {
  15729. min-width: 125px
  15730. }
  15731. }
  15732. .points-dashboard-achievement__icon--overlay {
  15733. background: #bb2620;
  15734. border-radius: 15px;
  15735. color: #fff;
  15736. display: flex;
  15737. font-size: .75rem;
  15738. justify-content: center;
  15739. align-items: center;
  15740. padding: 5px 5px 3px;
  15741. min-width: 75px;
  15742. position: relative;
  15743. bottom: 12px
  15744. }
  15745. .points-dashboard-banner {
  15746. overflow: hidden;
  15747. position: relative;
  15748. background: #fff;
  15749. text-align: center;
  15750. min-height: 80px
  15751. }
  15752. .points-dashboard-banner .loading-placeholder {
  15753. margin: 10px 10px 0
  15754. }
  15755. .points-dashboard-banner__badge-container {
  15756. padding: 10px 0;
  15757. max-width: 920px;
  15758. display: flex;
  15759. align-items: center;
  15760. justify-content: center;
  15761. margin: 0 auto;
  15762. position: relative
  15763. }
  15764. .points-dashboard-banner__badge-container .sprite {
  15765. width: 60px;
  15766. height: 50px
  15767. }
  15768. .points-dashboard-banner__badge {
  15769. position: relative;
  15770. width: 80px;
  15771. height: 60px;
  15772. display: flex;
  15773. justify-content: center;
  15774. align-items: center;
  15775. transition: .2s ease
  15776. }
  15777. .points-dashboard-banner__badge.member-since--selected,
  15778. .points-dashboard-banner__badge.pcf--selected {
  15779. cursor: auto
  15780. }
  15781. .points-dashboard-banner__badge.member-since--selected.member-since,
  15782. .points-dashboard-banner__badge.pcf--selected.member-since {
  15783. transform: translateX(40px)
  15784. }
  15785. .points-dashboard-banner__badge.member-since--selected.pcf,
  15786. .points-dashboard-banner__badge.pcf--selected.pcf {
  15787. transform: translateX(-40px)
  15788. }
  15789. .points-dashboard-banner__badge.member-since--selected.member-since,
  15790. .points-dashboard-banner__badge.pcf--selected.pcf {
  15791. z-index: 3
  15792. }
  15793. .points-dashboard-banner__drawer {
  15794. max-width: 920px;
  15795. max-height: 400px;
  15796. display: flex;
  15797. flex-direction: column;
  15798. align-items: center;
  15799. justify-content: center;
  15800. margin: 0 auto;
  15801. position: relative;
  15802. text-align: center;
  15803. padding-bottom: 25px;
  15804. transition: max-height, .15s linear
  15805. }
  15806. .points-dashboard-banner__drawer-close {
  15807. position: absolute;
  15808. right: 20px;
  15809. top: 20px
  15810. }
  15811. @media(min-width:48em) {
  15812. .points-dashboard-banner__drawer-close {
  15813. right: 40px
  15814. }
  15815. }
  15816. .points-dashboard-banner__drawer-close .sprite {
  15817. width: 20px;
  15818. height: 20px
  15819. }
  15820. .points-dashboard-banner__drawer-title {
  15821. color: #ee3124
  15822. }
  15823. .points-dashboard-banner__drawer-copy {
  15824. margin-top: 0
  15825. }
  15826. .points-dashboard-banner__drawer-subcopy {
  15827. display: flex;
  15828. flex-direction: column;
  15829. align-items: center
  15830. }
  15831. .points-dashboard-banner__drawer-subcopy .donate-banner__fake-cta,
  15832. .points-dashboard-banner__drawer-subcopy .new-window-link,
  15833. .points-dashboard-banner__drawer-subcopy .tile-item__fake-cta,
  15834. .points-dashboard-banner__drawer-subcopy .video-tile__fake-cta {
  15835. color: #000;
  15836. font-weight: 700;
  15837. text-decoration: none;
  15838. margin-bottom: 20px
  15839. }
  15840. .points-dashboard-banner__drawer-subcopy .donate-banner__fake-cta .sprite,
  15841. .points-dashboard-banner__drawer-subcopy .new-window-link .sprite,
  15842. .points-dashboard-banner__drawer-subcopy .tile-item__fake-cta .sprite,
  15843. .points-dashboard-banner__drawer-subcopy .video-tile__fake-cta .sprite {
  15844. fill: #ee3124;
  15845. position: relative;
  15846. bottom: -7px
  15847. }
  15848. .points-dashboard-button,
  15849. .points-dashboard-button:focus {
  15850. color: #000;
  15851. background: #fff;
  15852. border: none
  15853. }
  15854. .points-dashboard-button:focus:hover,
  15855. .points-dashboard-button:hover {
  15856. color: #fff;
  15857. background: #ee3124
  15858. }
  15859. .points-dashboard-button:focus:hover a,
  15860. .points-dashboard-button:hover a {
  15861. color: #fff
  15862. }
  15863. .points-dashboard-error {
  15864. padding: 50px 0
  15865. }
  15866. .points-dashboard-error .sprite {
  15867. fill: #bb2620
  15868. }
  15869. .points-dashboard-error__inner {
  15870. display: flex
  15871. }
  15872. .pc-insiders-subscription {
  15873. margin: 0 auto
  15874. }
  15875. .pc-insiders-subscription__title {
  15876. margin-bottom: 1rem
  15877. }
  15878. .pc-insiders-subscription__subtitle {
  15879. flex-basis: 100%;
  15880. margin-bottom: 1rem
  15881. }
  15882. .pc-insiders-subscription__tiles-container {
  15883. display: flex;
  15884. flex-wrap: wrap;
  15885. justify-content: space-between
  15886. }
  15887. .pc-insiders-subscription__tile {
  15888. align-items: center;
  15889. background-color: #fff;
  15890. margin-bottom: 8px;
  15891. flex-basis: 100%;
  15892. display: flex;
  15893. padding: 16px
  15894. }
  15895. @media(min-width:48em) {
  15896. .pc-insiders-subscription__tile {
  15897. flex: 0 1 calc(50% - 0.5rem);
  15898. -ms-flex: 0 1 45%;
  15899. margin-bottom: 16px;
  15900. padding: 24px 16px
  15901. }
  15902. }
  15903. .pc-insiders-subscription__tile-icon svg {
  15904. height: 100%;
  15905. margin-right: 16px;
  15906. width: 40px
  15907. }
  15908. @media(min-width:48em) {
  15909. .pc-insiders-subscription__tile-icon svg {
  15910. width: 48px
  15911. }
  15912. }
  15913. .ways-to-earn {
  15914. margin: 55px auto 35px
  15915. }
  15916. .ways-to-earn section {
  15917. margin-bottom: 15px
  15918. }
  15919. .ways-to-earn__subtitle {
  15920. margin-bottom: 16px
  15921. }
  15922. .homepage-footnote {
  15923. position: relative;
  15924. overflow: hidden;
  15925. text-align: left;
  15926. padding: 25px 20px;
  15927. border-top: 1px solid #ddd
  15928. }
  15929. @media(min-width:48em) {
  15930. .homepage-footnote {
  15931. padding: 25px 40px
  15932. }
  15933. }
  15934. .homepage-footnote__inner {
  15935. max-width: 1280px;
  15936. margin-left: auto;
  15937. margin-right: auto;
  15938. padding: 0;
  15939. position: relative;
  15940. z-index: 1;
  15941. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  15942. color: #585858;
  15943. font-size: .75rem;
  15944. line-height: 1.333333333
  15945. }
  15946. .homepage-footnote__link,
  15947. .homepage-footnote__link:hover {
  15948. color: #157a77
  15949. }
  15950. .dynamic-form {
  15951. width: 100%
  15952. }
  15953. @media(min-width:64em) {
  15954. .dynamic-form {
  15955. width: 840px
  15956. }
  15957. }
  15958. .dynamic-form__back-button {
  15959. display: flex;
  15960. position: relative;
  15961. top: 18px;
  15962. text-decoration: none
  15963. }
  15964. @media(min-width:64em) {
  15965. .dynamic-form__back-button {
  15966. position: relative;
  15967. top: 24px
  15968. }
  15969. }
  15970. .dynamic-form__back-button:focus,
  15971. .dynamic-form__back-button:hover {
  15972. text-decoration: underline
  15973. }
  15974. .dynamic-form__back-button .sprite {
  15975. transform: rotate(180deg)
  15976. }
  15977. .dynamic-form__back-button span {
  15978. margin-left: 16px
  15979. }
  15980. .dynamic-form__field-set-container {
  15981. display: flex;
  15982. flex-direction: column
  15983. }
  15984. .field-set__header {
  15985. margin: 24px 0 16px
  15986. }
  15987. @media(min-width:64em) {
  15988. .field-set__header {
  15989. margin: 48px 0 32px
  15990. }
  15991. }
  15992. .field-set__items-container {
  15993. background-color: #fff;
  15994. display: flex;
  15995. flex-wrap: wrap;
  15996. justify-content: space-between;
  15997. padding: 16px
  15998. }
  15999. @media(min-width:64em) {
  16000. .field-set__items-container {
  16001. padding: 20px 40px
  16002. }
  16003. }
  16004. .field-set__submit-button {
  16005. width: 232px;
  16006. margin: 24px auto 0
  16007. }
  16008. @media(min-width:64em) {
  16009. .field-set__submit-button {
  16010. margin: 48px auto 0
  16011. }
  16012. }
  16013. .field-set input[disabled] {
  16014. color: #585858
  16015. }
  16016. .field-set-item {
  16017. width: 100%
  16018. }
  16019. @media(min-width:64em) {
  16020. .field-set-item--horizontal {
  16021. width: calc(50% - 26px)
  16022. }
  16023. }
  16024. .field-set-item .radio-group {
  16025. margin-top: 4px 0
  16026. }
  16027. @media(min-width:64em) {
  16028. .field-set-item .radio-group {
  16029. margin: 8px 0
  16030. }
  16031. }
  16032. .field-set-item .radio-group__option {
  16033. margin: 0;
  16034. padding: 8px 0
  16035. }
  16036. @media(min-width:64em) {
  16037. .field-set-item .radio-group__option {
  16038. padding: 12px 0
  16039. }
  16040. }
  16041. .field-set-item .dropdown-group,
  16042. .field-set-item .text-group {
  16043. margin: 8px 0
  16044. }
  16045. @media(min-width:64em) {
  16046. .field-set-item .dropdown-group,
  16047. .field-set-item .text-group {
  16048. margin: 20px 0
  16049. }
  16050. }
  16051. .field-set-item .text-group__textarea {
  16052. height: 110px
  16053. }
  16054. .galen-updates {
  16055. background: #f0f0f0;
  16056. flex-grow: 1
  16057. }
  16058. .galen-updates header {
  16059. background: #f9dada
  16060. }
  16061. .galen-updates__body,
  16062. .galen-updates__content h2,
  16063. .galen-updates__inner-header {
  16064. margin: 0 auto;
  16065. max-width: 780px
  16066. }
  16067. .galen-updates__inner-header {
  16068. display: flex;
  16069. justify-content: flex-start;
  16070. align-items: center
  16071. }
  16072. @media(min-width:64em) {
  16073. .galen-updates__inner-header {
  16074. padding: 0
  16075. }
  16076. }
  16077. .galen-updates__inner-header h1 {
  16078. font-size: 1.5rem
  16079. }
  16080. @media(min-width:34.375em) {
  16081. .galen-updates__inner-header h1 {
  16082. font-size: 2rem
  16083. }
  16084. }
  16085. .galen-updates__inner-header img {
  16086. max-width: 100px;
  16087. margin: 30px 16px 30px 0
  16088. }
  16089. @media(min-width:34.375em) {
  16090. .galen-updates__inner-header img {
  16091. max-width: 150px
  16092. }
  16093. }
  16094. .galen-updates__content {
  16095. margin: 48px auto 0
  16096. }
  16097. .galen-updates__content:last-of-type {
  16098. margin-bottom: 48px
  16099. }
  16100. .galen-updates__content h2 {
  16101. line-height: 1;
  16102. margin: 0 auto 16px;
  16103. font-size: 1.2rem
  16104. }
  16105. @media(min-width:34.375em) {
  16106. .galen-updates__content h2 {
  16107. font-size: 1.5rem
  16108. }
  16109. }
  16110. @media(min-width:64em) {
  16111. .galen-updates__content h2 {
  16112. padding: 0
  16113. }
  16114. }
  16115. .galen-updates__body {
  16116. background: #fff;
  16117. padding: 40px 20px
  16118. }
  16119. @media(min-width:48em) {
  16120. .galen-updates__body {
  16121. padding: 40px
  16122. }
  16123. }
  16124. .galen-updates__body ol>li,
  16125. .galen-updates__body ul>li {
  16126. margin: 1rem 0
  16127. }
  16128. .galen-updates-error .utility-content {
  16129. max-width: 780px;
  16130. margin: 30px auto;
  16131. padding-left: 20px;
  16132. padding-right: 20px
  16133. }
  16134. @media(min-width:48em) {
  16135. .galen-updates-error .utility-content {
  16136. padding: 0
  16137. }
  16138. }
  16139. .galen-updates-error__inner {
  16140. margin: 0 auto;
  16141. display: flex
  16142. }
  16143. .galen-updates-error__inner .sprite {
  16144. fill: #bb2620
  16145. }
  16146. .tile-list {
  16147. margin: 0 auto 28px;
  16148. max-width: 702px;
  16149. position: relative;
  16150. z-index: 1;
  16151. list-style-type: none
  16152. }
  16153. @media(min-width:64em) {
  16154. .tile-list {
  16155. margin-bottom: 40px;
  16156. max-width: 794px
  16157. }
  16158. }
  16159. .tile-list__container {
  16160. display: flex;
  16161. justify-content: space-between;
  16162. flex-wrap: wrap;
  16163. list-style-type: none;
  16164. padding: 0;
  16165. margin: 0 0 24px
  16166. }
  16167. .tile-list__see-more {
  16168. margin: 0 auto;
  16169. max-width: 254px
  16170. }
  16171. .tile-list--your-pco {
  16172. max-width: none
  16173. }
  16174. @media(min-width:48em) {
  16175. .tile-list--your-pco {
  16176. max-width: 1280px;
  16177. padding: 0 40px
  16178. }
  16179. }
  16180. .tile-list--your-pco .tile-list__container {
  16181. display: block
  16182. }
  16183. @media(min-width:48em) {
  16184. .tile-list--your-pco .tile-list__container {
  16185. display: flex;
  16186. max-width: 792px;
  16187. margin: 0 auto
  16188. }
  16189. }
  16190. .tile-item {
  16191. flex-basis: calc(50% - 4px);
  16192. margin-bottom: 8px;
  16193. background: #fff;
  16194. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  16195. transition: box-shadow .3s ease-in-out;
  16196. border-radius: 8px;
  16197. position: relative
  16198. }
  16199. .tile-item__wrapper {
  16200. display: block;
  16201. height: 100%
  16202. }
  16203. .tile-item:focus,
  16204. .tile-item:focus-within,
  16205. .tile-item:hover {
  16206. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  16207. cursor: pointer
  16208. }
  16209. @media(min-width:48em) {
  16210. .tile-item {
  16211. flex-basis: calc(33% - 16px);
  16212. margin: 0 8px 16px
  16213. }
  16214. }
  16215. .tile-item a {
  16216. text-decoration: none;
  16217. display: flex;
  16218. flex-direction: column
  16219. }
  16220. .tile-item__fake-cta {
  16221. text-decoration: underline;
  16222. font-size: .75rem
  16223. }
  16224. @media(min-width:48em) {
  16225. .tile-item__fake-cta {
  16226. font-size: .875rem
  16227. }
  16228. }
  16229. .tile-item__content {
  16230. padding: 16px;
  16231. text-align: left;
  16232. order: 2
  16233. }
  16234. .tile-item__content--description {
  16235. margin: 0;
  16236. color: #655c6c;
  16237. font-size: .875rem
  16238. }
  16239. .tile-item__content--title {
  16240. margin: 0 0 4px;
  16241. color: #191919;
  16242. font-weight: 400;
  16243. font-size: .875rem
  16244. }
  16245. @media(min-width:48em) {
  16246. .tile-item__content--title {
  16247. font-size: 1rem
  16248. }
  16249. }
  16250. .tile-item__image {
  16251. display: block;
  16252. border-radius: 8px 8px 0 0;
  16253. max-width: 100%
  16254. }
  16255. .tile-item__image.image--error {
  16256. width: 64px;
  16257. height: 64px;
  16258. margin: 16px auto
  16259. }
  16260. .tile-item--sponsored:lang(fr-CA):before {
  16261. content: "Commandité"
  16262. }
  16263. .tile-item--sponsored:lang(en-CA):before {
  16264. content: "Sponsored"
  16265. }
  16266. .tile-item--sponsored:before {
  16267. position: absolute;
  16268. top: 0;
  16269. right: 0;
  16270. background-color: rgba(25, 25, 25, .5);
  16271. padding: .2rem .5rem;
  16272. margin: 8px;
  16273. color: #fff;
  16274. font-size: .875rem
  16275. }
  16276. .tile-item__tag {
  16277. display: flex;
  16278. flex-direction: row;
  16279. justify-content: center;
  16280. align-items: flex-start;
  16281. padding: 0 8px;
  16282. position: absolute;
  16283. height: 20px;
  16284. background: #fdde0e;
  16285. border-radius: 32px;
  16286. font-family: Inter, sans-serif;
  16287. font-style: normal;
  16288. font-weight: 700;
  16289. font-size: 9px;
  16290. line-height: 20px;
  16291. color: #403840;
  16292. right: 8px;
  16293. top: 8px
  16294. }
  16295. @media(min-width:48em) {
  16296. .tile-item__tag {
  16297. font-size: 10px
  16298. }
  16299. }
  16300. .tile-item--your-pco {
  16301. width: 253px;
  16302. margin: 0 0 24px;
  16303. overflow: hidden;
  16304. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  16305. transform: scale(1);
  16306. transition: all .2s
  16307. }
  16308. .tile-item--your-pco:focus,
  16309. .tile-item--your-pco:hover {
  16310. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24);
  16311. transform: scale(1.05)
  16312. }
  16313. .account-setting--security .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.account-setting__turn-off-button,
  16314. .account-setting--security .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.account-setting__turn-on-button,
  16315. .points-days-cta-section__content .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.cta-section__link,
  16316. .tile-item--your-pco:hover .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16317. .tile-item--your-pco:hover .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16318. .tile-item--your-pco:hover .tile-item__content .deals-for-you__header-cta,
  16319. .tile-item--your-pco:hover .tile-item__content .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16320. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.button,
  16321. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.household-grid__invite-button,
  16322. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button,
  16323. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-primary,
  16324. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16325. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-primary,
  16326. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-secondary,
  16327. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button-gray,
  16328. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button-red,
  16329. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent,
  16330. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent-white,
  16331. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.link--theme-button-white,
  16332. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.load-shop-pay-header__link,
  16333. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.load-shop-pay-module__link,
  16334. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.marketing-page-header__link,
  16335. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.marketing-page-module__link,
  16336. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.partnership-perk-details__cta,
  16337. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  16338. .tile-item--your-pco:hover .tile-item__content .redeemable-perk-content__cta.points-days__cta,
  16339. .tile-item--your-pco:hover .tile-item__content .type-ds-text-link {
  16340. color: #615395
  16341. }
  16342. .account-setting--security .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.account-setting__turn-off-button,
  16343. .account-setting--security .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.account-setting__turn-on-button,
  16344. .points-days-cta-section__content .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.cta-section__link,
  16345. .tile-item--your-pco:active .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16346. .tile-item--your-pco:active .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16347. .tile-item--your-pco:active .tile-item__content .deals-for-you__header-cta,
  16348. .tile-item--your-pco:active .tile-item__content .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16349. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.button,
  16350. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.household-grid__invite-button,
  16351. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button,
  16352. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-primary,
  16353. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16354. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-primary,
  16355. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-secondary,
  16356. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button-gray,
  16357. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button-red,
  16358. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent,
  16359. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent-white,
  16360. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.link--theme-button-white,
  16361. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.load-shop-pay-header__link,
  16362. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.load-shop-pay-module__link,
  16363. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.marketing-page-header__link,
  16364. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.marketing-page-module__link,
  16365. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.partnership-perk-details__cta,
  16366. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  16367. .tile-item--your-pco:active .tile-item__content .redeemable-perk-content__cta.points-days__cta,
  16368. .tile-item--your-pco:active .tile-item__content .type-ds-text-link {
  16369. color: #403840
  16370. }
  16371. @media(min-width:48em) {
  16372. .tile-item--your-pco {
  16373. flex-basis: calc(33% - 16px);
  16374. margin: 0 0 16px
  16375. }
  16376. }
  16377. @media(min-width:64em) {
  16378. .tile-item--your-pco {
  16379. flex-basis: calc(50% - 12px);
  16380. margin: 0 0 24px;
  16381. height: 200px
  16382. }
  16383. }
  16384. @media(min-width:64em) {
  16385. .tile-item--your-pco a {
  16386. display: flex;
  16387. flex-direction: row;
  16388. height: 100%
  16389. }
  16390. }
  16391. .cancel-subscription__modal-content .pcoi-error-tile .tile-item--your-pco p:first-of-type,
  16392. .enrol-flow .tile-item--your-pco .flow-progress-bar__title,
  16393. .no-subscription-plan__content .tile-item--your-pco h3,
  16394. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .tile-item--your-pco .offer__reward--earned,
  16395. .offer-content-group-carousel .tile-item--your-pco .offer__text,
  16396. .quest-offer-child-offer .continuity-offer__content-group .tile-item--your-pco .offer__reward,
  16397. .quest-offer-child-offer .hero-continuity-offer__content-group .tile-item--your-pco .offer__reward,
  16398. .quest-offer-child-offer .hero-product-offer__content-group .tile-item--your-pco .offer__reward,
  16399. .quest-offer-child-offer.offer--faded .tile-item--your-pco .offer__reward--earned,
  16400. .quest-offer-child-offer .product-offer__content-group .tile-item--your-pco .offer__reward,
  16401. .subscription-plan__content .tile-item--your-pco h3,
  16402. .tile-item--your-pco .activation-card-display__points-label,
  16403. .tile-item--your-pco .billing-history__date,
  16404. .tile-item--your-pco .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type,
  16405. .tile-item--your-pco .category-btn,
  16406. .tile-item--your-pco .deals-for-you-tile__item,
  16407. .tile-item--your-pco .enrol-flow .flow-progress-bar__title,
  16408. .tile-item--your-pco .esso-redemption-earning-card__subtitle,
  16409. .tile-item--your-pco .esso-redemption-pcf__money-subtitle,
  16410. .tile-item--your-pco .esso-redemption-redeem-cards__text,
  16411. .tile-item--your-pco .expandable-form-wrapper__title,
  16412. .tile-item--your-pco .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder,
  16413. .tile-item--your-pco .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder,
  16414. .tile-item--your-pco .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder,
  16415. .tile-item--your-pco .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder,
  16416. .tile-item--your-pco .initial-offers-slider__slider-container__slide-content__question,
  16417. .tile-item--your-pco .no-subscription-plan__content h3,
  16418. .tile-item--your-pco .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned,
  16419. .tile-item--your-pco .offer-content-group-carousel .offer__text,
  16420. .tile-item--your-pco .offer__text--carousel,
  16421. .tile-item--your-pco .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  16422. .tile-item--your-pco .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  16423. .tile-item--your-pco .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  16424. .tile-item--your-pco .quest-offer-child-offer.offer--faded .offer__reward--earned,
  16425. .tile-item--your-pco .quest-offer-child-offer .product-offer__content-group .offer__reward,
  16426. .tile-item--your-pco .subscription-plan__content h3,
  16427. .tile-item--your-pco .type-ds-headline {
  16428. margin: 0
  16429. }
  16430. .tile-item--your-pco .tile-item__image {
  16431. border-radius: 0
  16432. }
  16433. @media(min-width:64em) {
  16434. .tile-item--your-pco .tile-item__image {
  16435. max-width: 180px;
  16436. -o-object-fit: cover;
  16437. object-fit: cover
  16438. }
  16439. }
  16440. .tile-item--your-pco .tile-item__image.image--error {
  16441. width: 64px;
  16442. height: 64px;
  16443. margin: 16px auto
  16444. }
  16445. @media(min-width:64em) {
  16446. .tile-item--your-pco .tile-item__image.image--error {
  16447. margin: auto
  16448. }
  16449. }
  16450. .tile-item--your-pco .tile-item__content {
  16451. display: flex;
  16452. flex-direction: column;
  16453. justify-content: space-between;
  16454. height: 164px;
  16455. padding: 20px 16px 18px
  16456. }
  16457. @media(min-width:48em) {
  16458. .tile-item--your-pco .tile-item__content {
  16459. height: 113px;
  16460. padding: 16px 16px 12px
  16461. }
  16462. }
  16463. @media(min-width:64em) {
  16464. .tile-item--your-pco .tile-item__content {
  16465. height: auto;
  16466. padding: 24px;
  16467. width: 200px
  16468. }
  16469. }
  16470. .account-setting--security .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.account-setting__turn-off-button,
  16471. .account-setting--security .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.account-setting__turn-on-button,
  16472. .points-days-cta-section__content .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.cta-section__link,
  16473. .tile-item--your-pco .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16474. .tile-item--your-pco .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16475. .tile-item--your-pco .tile-item__content .deals-for-you__header-cta,
  16476. .tile-item--your-pco .tile-item__content .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16477. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.button,
  16478. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.household-grid__invite-button,
  16479. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button,
  16480. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-primary,
  16481. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16482. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-primary,
  16483. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-secondary,
  16484. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-gray,
  16485. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-red,
  16486. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent,
  16487. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent-white,
  16488. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-white,
  16489. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.load-shop-pay-header__link,
  16490. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.load-shop-pay-module__link,
  16491. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.marketing-page-header__link,
  16492. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.marketing-page-module__link,
  16493. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.partnership-perk-details__cta,
  16494. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  16495. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.points-days__cta,
  16496. .tile-item--your-pco .tile-item__content .type-ds-text-link {
  16497. color: #157a77;
  16498. text-decoration: underline;
  16499. font-size: .9375rem;
  16500. transition: all .2s
  16501. }
  16502. @media(min-width:64em) {
  16503. .account-setting--security .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.account-setting__turn-off-button,
  16504. .account-setting--security .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.account-setting__turn-on-button,
  16505. .points-days-cta-section__content .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.cta-section__link,
  16506. .tile-item--your-pco .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16507. .tile-item--your-pco .tile-item__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16508. .tile-item--your-pco .tile-item__content .deals-for-you__header-cta,
  16509. .tile-item--your-pco .tile-item__content .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16510. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.button,
  16511. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.household-grid__invite-button,
  16512. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button,
  16513. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-primary,
  16514. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16515. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-primary,
  16516. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button--small-secondary,
  16517. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-gray,
  16518. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-red,
  16519. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent,
  16520. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-transparent-white,
  16521. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.link--theme-button-white,
  16522. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.load-shop-pay-header__link,
  16523. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.load-shop-pay-module__link,
  16524. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.marketing-page-header__link,
  16525. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.marketing-page-module__link,
  16526. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.partnership-perk-details__cta,
  16527. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  16528. .tile-item--your-pco .tile-item__content .redeemable-perk-content__cta.points-days__cta,
  16529. .tile-item--your-pco .tile-item__content .type-ds-text-link {
  16530. font-size: 1rem
  16531. }
  16532. }
  16533. .tile-item--product-love-story {
  16534. list-style: none;
  16535. margin: 0 0 32px;
  16536. border-radius: 8px;
  16537. overflow: hidden;
  16538. display: flex;
  16539. flex-direction: column;
  16540. transition: all .2s;
  16541. color: transparent
  16542. }
  16543. @media(min-width:48em) {
  16544. .tile-item--product-love-story {
  16545. flex-direction: row
  16546. }
  16547. }
  16548. .tile-item--product-love-story:hover {
  16549. color: transparent
  16550. }
  16551. .tile-item--product-love-story:focus,
  16552. .tile-item--product-love-story:hover {
  16553. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24);
  16554. transform: scale(1.05);
  16555. outline: none
  16556. }
  16557. .tile-item--product-love-story:focus .tile-item__text-link,
  16558. .tile-item--product-love-story:hover .tile-item__text-link {
  16559. color: #615395
  16560. }
  16561. .tile-item--product-love-story .tile-item__image-container {
  16562. background-color: #f4f1f6;
  16563. width: 100%;
  16564. min-height: 160px
  16565. }
  16566. @media(min-width:48em) {
  16567. .tile-item--product-love-story .tile-item__image-container {
  16568. min-height: 210px;
  16569. width: 50%
  16570. }
  16571. }
  16572. .tile-item--product-love-story .tile-item__image {
  16573. -o-object-fit: cover;
  16574. object-fit: cover;
  16575. border-radius: 0
  16576. }
  16577. @media(min-width:48em) {
  16578. .tile-item--product-love-story .tile-item__content {
  16579. width: 50%;
  16580. display: flex;
  16581. flex-wrap: wrap;
  16582. align-content: center;
  16583. margin: 0 auto;
  16584. padding: 7%
  16585. }
  16586. }
  16587. .tile-item--product-love-story .tile-item__title {
  16588. margin: 0
  16589. }
  16590. .tile-item--product-love-story .tile-item__text-link {
  16591. margin: 6px 0 0;
  16592. color: #157a77;
  16593. text-decoration: underline;
  16594. -webkit-line-clamp: 1
  16595. }
  16596. @media(min-width:48em) {
  16597. .tile-item--product-love-story .tile-item__text-link {
  16598. margin: 8px 0 0
  16599. }
  16600. }
  16601. .offers-loading__list {
  16602. list-style: none;
  16603. padding-left: 0
  16604. }
  16605. .offers-loading__tile {
  16606. box-shadow: none;
  16607. border: 1px solid #f4f1f6
  16608. }
  16609. .offers-loading__tile:last-child {
  16610. display: none
  16611. }
  16612. @media(min-width:48em) {
  16613. .offers-loading__tile:last-child {
  16614. display: block
  16615. }
  16616. }
  16617. .offers-loading__title {
  16618. margin-bottom: 8px
  16619. }
  16620. .offers-loading__title .loading-placeholder__inner {
  16621. line-height: 24px;
  16622. width: 60%
  16623. }
  16624. @media(min-width:48em) {
  16625. .offers-loading__title .loading-placeholder__inner {
  16626. line-height: 32px;
  16627. width: 27%
  16628. }
  16629. }
  16630. .offers-loading__subtitle {
  16631. margin-bottom: 16px
  16632. }
  16633. .offers-loading__subtitle .loading-placeholder__inner {
  16634. line-height: 24px;
  16635. width: 60%
  16636. }
  16637. @media(min-width:48em) {
  16638. .offers-loading__subtitle .loading-placeholder__inner {
  16639. line-height: 28px;
  16640. width: 35%
  16641. }
  16642. }
  16643. .offers-loading__image {
  16644. min-height: 92px;
  16645. display: block;
  16646. margin-bottom: 0
  16647. }
  16648. @media(min-width:48em) {
  16649. .offers-loading__image {
  16650. min-height: 166px
  16651. }
  16652. }
  16653. .offers-loading__content .loading-placeholder {
  16654. margin-bottom: 10px
  16655. }
  16656. .offers-loading__content .loading-placeholder.offers-loading__content-bottom {
  16657. margin-bottom: 0
  16658. }
  16659. .offers-loading__content .loading-placeholder.offers-loading__content-top>div {
  16660. line-height: 20px
  16661. }
  16662. @media(min-width:48em) {
  16663. .offers-loading__content .loading-placeholder.offers-loading__content-top>div {
  16664. line-height: 32px
  16665. }
  16666. }
  16667. @media(min-width:48em) {
  16668. .offers-loading__content .loading-placeholder {
  16669. margin-bottom: 12px
  16670. }
  16671. }
  16672. .offers-section-header {
  16673. margin-top: 28px
  16674. }
  16675. .offers-section-header h1 {
  16676. color: #403840;
  16677. margin-bottom: 8px
  16678. }
  16679. .offers-section-header h1:last-child {
  16680. margin: 0 0 16px
  16681. }
  16682. @media(min-width:48em) {
  16683. .offers-section-header h1 {
  16684. margin: 35px 0 8px
  16685. }
  16686. }
  16687. .offers-section-header p {
  16688. margin: 0 0 16px
  16689. }
  16690. @media(min-width:48em) {
  16691. .offers-section-header p {
  16692. margin: 0 0 24px
  16693. }
  16694. }
  16695. .offers-section-header__description {
  16696. color: #655c6c
  16697. }
  16698. @media(min-width:48em) {
  16699. .offers-section-header__description {
  16700. display: flex
  16701. }
  16702. }
  16703. .video-tile__inner {
  16704. display: flex;
  16705. flex-direction: column;
  16706. justify-content: center;
  16707. max-width: 688px;
  16708. margin: 0 auto 28px;
  16709. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  16710. transition: box-shadow .3s ease-in-out;
  16711. overflow: hidden;
  16712. border-radius: 16px;
  16713. background: #fff;
  16714. position: relative
  16715. }
  16716. .video-tile__inner:focus,
  16717. .video-tile__inner:focus-within,
  16718. .video-tile__inner:hover {
  16719. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  16720. cursor: pointer
  16721. }
  16722. @media(min-width:48em) {
  16723. .video-tile__inner {
  16724. margin: 0 auto 40px;
  16725. flex-direction: row
  16726. }
  16727. }
  16728. @media(min-width:64em) {
  16729. .video-tile__inner {
  16730. max-width: 780px
  16731. }
  16732. }
  16733. .video-tile__video-player {
  16734. flex-basis: 50%;
  16735. position: relative;
  16736. padding-top: 56.25%;
  16737. z-index: 1
  16738. }
  16739. @media(min-width:48em) {
  16740. .video-tile__video-player {
  16741. padding-top: 28.125%
  16742. }
  16743. }
  16744. .video-tile__video-player .sprite {
  16745. width: 44px;
  16746. height: 44px
  16747. }
  16748. @media(min-width:64em) {
  16749. .video-tile__video-player .sprite {
  16750. width: 48px;
  16751. height: 48px
  16752. }
  16753. }
  16754. .video-tile__video-player .react-player,
  16755. .video-tile__video-player .react-player__preview {
  16756. position: absolute;
  16757. top: 0;
  16758. left: 0
  16759. }
  16760. .video-tile__video-player video::-webkit-media-controls-current-time-display,
  16761. .video-tile__video-player video::-webkit-media-controls-fullscreen-button,
  16762. .video-tile__video-player video::-webkit-media-controls-time-remaining-display,
  16763. .video-tile__video-player video::-webkit-media-controls-timeline {
  16764. display: none
  16765. }
  16766. .video-tile a {
  16767. text-decoration: none;
  16768. flex-basis: 50%;
  16769. display: flex
  16770. }
  16771. .video-tile__content {
  16772. padding: 16px;
  16773. display: flex;
  16774. flex-direction: column;
  16775. justify-content: center;
  16776. flex: 1
  16777. }
  16778. @media(min-width:48em) {
  16779. .video-tile__content {
  16780. padding: 0 32px
  16781. }
  16782. }
  16783. .video-tile__title {
  16784. font-size: .9375rem;
  16785. margin: 0 0 4px;
  16786. font-weight: 400;
  16787. color: #191919
  16788. }
  16789. @media(min-width:48em) {
  16790. .video-tile__title {
  16791. font-size: 1.5rem;
  16792. line-height: 24px;
  16793. margin: 0 0 16px;
  16794. font-weight: 700
  16795. }
  16796. }
  16797. @media(min-width:64em) {
  16798. .video-tile__title {
  16799. line-height: 2rem;
  16800. font-size: 2rem
  16801. }
  16802. }
  16803. .video-tile__subcopy {
  16804. margin: 0 0 4px
  16805. }
  16806. @media(min-width:64em) {
  16807. .video-tile__subcopy {
  16808. font-size: 1rem;
  16809. margin: 0 0 11px
  16810. }
  16811. }
  16812. .video-tile__fake-cta {
  16813. text-decoration: underline;
  16814. font-size: .75rem;
  16815. margin: 0
  16816. }
  16817. @media(min-width:48em) {
  16818. .video-tile__fake-cta {
  16819. font-size: .875rem
  16820. }
  16821. }
  16822. @media(min-width:64em) {
  16823. .video-tile__fake-cta {
  16824. font-size: 1rem
  16825. }
  16826. }
  16827. .video-tile--sponsored .video-tile__video-player:lang(fr-CA):after {
  16828. content: "Commandité"
  16829. }
  16830. .video-tile--sponsored .video-tile__video-player:lang(en-CA):after {
  16831. content: "Sponsored"
  16832. }
  16833. .video-tile--sponsored .video-tile__video-player:after {
  16834. position: absolute;
  16835. top: 0;
  16836. right: 0;
  16837. background-color: rgba(25, 25, 25, .5);
  16838. padding: .2rem .5rem;
  16839. margin: 8px;
  16840. color: #fff;
  16841. font-size: .875rem
  16842. }
  16843. .video-tile--your-pco .video-tile__inner {
  16844. max-width: 794px;
  16845. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  16846. transform: scale(1);
  16847. transition: all .2s
  16848. }
  16849. .video-tile--your-pco .video-tile__inner:focus,
  16850. .video-tile--your-pco .video-tile__inner:hover {
  16851. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24);
  16852. transform: scale(1.03)
  16853. }
  16854. .account-setting--security .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.account-setting__turn-off-button,
  16855. .account-setting--security .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.account-setting__turn-on-button,
  16856. .points-days-cta-section__content .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.cta-section__link,
  16857. .video-tile--your-pco .video-tile__inner:hover .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16858. .video-tile--your-pco .video-tile__inner:hover .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16859. .video-tile--your-pco .video-tile__inner:hover .deals-for-you__header-cta,
  16860. .video-tile--your-pco .video-tile__inner:hover .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16861. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.button,
  16862. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.household-grid__invite-button,
  16863. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button,
  16864. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button--large-primary,
  16865. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16866. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button--small-primary,
  16867. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button--small-secondary,
  16868. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button-gray,
  16869. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button-red,
  16870. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button-transparent,
  16871. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button-transparent-white,
  16872. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.link--theme-button-white,
  16873. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.load-shop-pay-header__link,
  16874. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.load-shop-pay-module__link,
  16875. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.marketing-page-header__link,
  16876. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.marketing-page-module__link,
  16877. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.partnership-perk-details__cta,
  16878. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  16879. .video-tile--your-pco .video-tile__inner:hover .redeemable-perk-content__cta.points-days__cta,
  16880. .video-tile--your-pco .video-tile__inner:hover .type-ds-text-link {
  16881. color: #615395
  16882. }
  16883. .account-setting--security .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.account-setting__turn-off-button,
  16884. .account-setting--security .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.account-setting__turn-on-button,
  16885. .points-days-cta-section__content .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.cta-section__link,
  16886. .video-tile--your-pco .video-tile__inner:active .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16887. .video-tile--your-pco .video-tile__inner:active .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16888. .video-tile--your-pco .video-tile__inner:active .deals-for-you__header-cta,
  16889. .video-tile--your-pco .video-tile__inner:active .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16890. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.button,
  16891. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.household-grid__invite-button,
  16892. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button,
  16893. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button--large-primary,
  16894. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16895. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button--small-primary,
  16896. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button--small-secondary,
  16897. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button-gray,
  16898. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button-red,
  16899. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button-transparent,
  16900. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button-transparent-white,
  16901. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.link--theme-button-white,
  16902. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.load-shop-pay-header__link,
  16903. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.load-shop-pay-module__link,
  16904. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.marketing-page-header__link,
  16905. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.marketing-page-module__link,
  16906. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.partnership-perk-details__cta,
  16907. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  16908. .video-tile--your-pco .video-tile__inner:active .redeemable-perk-content__cta.points-days__cta,
  16909. .video-tile--your-pco .video-tile__inner:active .type-ds-text-link {
  16910. color: #403840
  16911. }
  16912. .video-tile--your-pco .video-tile__video-player {
  16913. transform: scale(1.01)
  16914. }
  16915. .video-tile--your-pco .video-tile__content {
  16916. justify-content: space-between
  16917. }
  16918. @media(min-width:48em) {
  16919. .video-tile--your-pco .video-tile__content {
  16920. padding: 24px 32px
  16921. }
  16922. }
  16923. .billing-history-empty-state__message .video-tile--your-pco .video-tile__content h4,
  16924. .loadToCard-brand-banner .video-tile--your-pco .video-tile__content .layoutCard__title,
  16925. .modal-content .video-tile--your-pco .video-tile__content .offer__text--carousel,
  16926. .video-tile--your-pco .video-tile__content .billing-history-empty-state__message h4,
  16927. .video-tile--your-pco .video-tile__content .deals-for-you__subtitle,
  16928. .video-tile--your-pco .video-tile__content .download-app__subtitle,
  16929. .video-tile--your-pco .video-tile__content .esso-redemption-header__subtitle,
  16930. .video-tile--your-pco .video-tile__content .esso-redemption-pcf__title,
  16931. .video-tile--your-pco .video-tile__content .esso-redemption-redeem-cards__text-divider,
  16932. .video-tile--your-pco .video-tile__content .esso-redemption-redeem-cards__title,
  16933. .video-tile--your-pco .video-tile__content .loadToCard-brand-banner .layoutCard__title,
  16934. .video-tile--your-pco .video-tile__content .modal-content .offer__text--carousel,
  16935. .video-tile--your-pco .video-tile__content .offer-standalone__heading,
  16936. .video-tile--your-pco .video-tile__content .offer__reward--carousel,
  16937. .video-tile--your-pco .video-tile__content .slider-header__text--heading,
  16938. .video-tile--your-pco .video-tile__content .type-ds-title-3,
  16939. .video-tile--your-pco .video-tile__content .your-pco-error__tile-content-title {
  16940. margin: 0
  16941. }
  16942. .billing-history__amount .video-tile--your-pco .video-tile__content p,
  16943. .billing-history__card--number .video-tile--your-pco .video-tile__content p,
  16944. .enrol-flow .video-tile--your-pco .video-tile__content .flow-header__sub-title,
  16945. .flow-faq--new-design-system .video-tile--your-pco .video-tile__content .flow-faq__subtitle,
  16946. .hero-quest-offer .video-tile--your-pco .video-tile__content .offer__text,
  16947. .loadToCard-brand-banner .video-tile--your-pco .video-tile__content .layoutCard__body,
  16948. .quest-offer .video-tile--your-pco .video-tile__content .offer__text,
  16949. .redemption-perk-details .video-tile--your-pco .video-tile__content .dropdown-group__dropdown,
  16950. .text-group--new-design-system .text-group__input-container--with-addon .video-tile--your-pco .video-tile__content .flyers-header__input,
  16951. .text-group--new-design-system .text-group__input-container--with-addon .video-tile--your-pco .video-tile__content .homepage-stores__input,
  16952. .text-group--new-design-system .text-group__input-container--with-addon .video-tile--your-pco .video-tile__content .search-box__input,
  16953. .text-group--new-design-system .text-group__input-container--with-addon .video-tile--your-pco .video-tile__content .text-group__input,
  16954. .text-group--new-design-system .text-group__input-container--with-addon .video-tile--your-pco .video-tile__content .text-group__input-addon,
  16955. .video-tile--your-pco .video-tile__content .activation-card-display__redeemable-value,
  16956. .video-tile--your-pco .video-tile__content .activation-card-display__redeemable-value-section,
  16957. .video-tile--your-pco .video-tile__content .billing-history__amount p,
  16958. .video-tile--your-pco .video-tile__content .billing-history__card--number p,
  16959. .video-tile--your-pco .video-tile__content .billing-history__type,
  16960. .video-tile--your-pco .video-tile__content .checkbox-group-new-ds__label,
  16961. .video-tile--your-pco .video-tile__content .enrol-flow .flow-header__sub-title,
  16962. .video-tile--your-pco .video-tile__content .enrol-form__expanded-legal-copy,
  16963. .video-tile--your-pco .video-tile__content .esso-redemption-earning-card__text,
  16964. .video-tile--your-pco .video-tile__content .esso-redemption-redeem-cards__subtext,
  16965. .video-tile--your-pco .video-tile__content .flow-faq--new-design-system .flow-faq__subtitle,
  16966. .video-tile--your-pco .video-tile__content .header-points__redeemable,
  16967. .video-tile--your-pco .video-tile__content .hero-quest-offer .offer__text,
  16968. .video-tile--your-pco .video-tile__content .initial-offers-slider__slider-container__slide-content__title,
  16969. .video-tile--your-pco .video-tile__content .loadToCard-brand-banner .layoutCard__body,
  16970. .video-tile--your-pco .video-tile__content .loadToCard-header__subtitle,
  16971. .video-tile--your-pco .video-tile__content .messages__all-read,
  16972. .video-tile--your-pco .video-tile__content .quest-offer .offer__text,
  16973. .video-tile--your-pco .video-tile__content .redemption-perk-details .dropdown-group__dropdown,
  16974. .video-tile--your-pco .video-tile__content .text-group--new-design-system .text-group__input-container--with-addon .flyers-header__input,
  16975. .video-tile--your-pco .video-tile__content .text-group--new-design-system .text-group__input-container--with-addon .homepage-stores__input,
  16976. .video-tile--your-pco .video-tile__content .text-group--new-design-system .text-group__input-container--with-addon .search-box__input,
  16977. .video-tile--your-pco .video-tile__content .text-group--new-design-system .text-group__input-container--with-addon .text-group__input,
  16978. .video-tile--your-pco .video-tile__content .text-group--new-design-system .text-group__input-container--with-addon .text-group__input-addon,
  16979. .video-tile--your-pco .video-tile__content .type-ds-body,
  16980. .video-tile--your-pco .video-tile__content .your-pco-error__tile-content-subtitle,
  16981. .video-tile--your-pco .video-tile__content .your-pco-section__description,
  16982. .video-tile--your-pco .video-tile__content .your-pco-section__heading+p {
  16983. margin: 7px 0 35px;
  16984. color: #6b6272
  16985. }
  16986. .account-setting--security .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.account-setting__turn-off-button,
  16987. .account-setting--security .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.account-setting__turn-on-button,
  16988. .points-days-cta-section__content .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.cta-section__link,
  16989. .video-tile--your-pco .video-tile__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  16990. .video-tile--your-pco .video-tile__content .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  16991. .video-tile--your-pco .video-tile__content .deals-for-you__header-cta,
  16992. .video-tile--your-pco .video-tile__content .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  16993. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.button,
  16994. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.household-grid__invite-button,
  16995. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button,
  16996. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button--large-primary,
  16997. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button--large-secondary,
  16998. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button--small-primary,
  16999. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button--small-secondary,
  17000. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button-gray,
  17001. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button-red,
  17002. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button-transparent,
  17003. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button-transparent-white,
  17004. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.link--theme-button-white,
  17005. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.load-shop-pay-header__link,
  17006. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.load-shop-pay-module__link,
  17007. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.marketing-page-header__link,
  17008. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.marketing-page-module__link,
  17009. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.partnership-perk-details__cta,
  17010. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  17011. .video-tile--your-pco .video-tile__content .redeemable-perk-content__cta.points-days__cta,
  17012. .video-tile--your-pco .video-tile__content .type-ds-text-link {
  17013. color: #157a77;
  17014. text-decoration: underline;
  17015. margin: 0;
  17016. transition: all .2s
  17017. }
  17018. .call-centre-details {
  17019. display: flex;
  17020. justify-content: center;
  17021. margin-top: 24px
  17022. }
  17023. @media(min-width:64em) {
  17024. .call-centre-details {
  17025. margin-top: 64px
  17026. }
  17027. }
  17028. .call-centre-details__inner {
  17029. align-items: center;
  17030. display: flex;
  17031. flex-direction: column;
  17032. text-align: center;
  17033. width: 100%
  17034. }
  17035. @media(min-width:48em) {
  17036. .call-centre-details__inner {
  17037. width: 420px
  17038. }
  17039. }
  17040. .call-centre-details hr {
  17041. color: #191919;
  17042. margin: 0 0 24px;
  17043. opacity: .15;
  17044. width: 100%
  17045. }
  17046. @media(min-width:48em) {
  17047. .call-centre-details hr {
  17048. margin: 0 0 48px
  17049. }
  17050. }
  17051. .call-centre-details__phone {
  17052. margin: 8px 0 16px
  17053. }
  17054. .call-centre-details p {
  17055. margin: 0
  17056. }
  17057. .contact-us-tiles {
  17058. align-items: center;
  17059. display: flex;
  17060. flex-direction: column
  17061. }
  17062. @media(min-width:64em) {
  17063. .contact-us-tiles {
  17064. flex-direction: row;
  17065. justify-content: center
  17066. }
  17067. }
  17068. .contact-us-tile {
  17069. align-items: center;
  17070. background-color: #fff;
  17071. border-radius: 16px;
  17072. display: flex;
  17073. flex-direction: column;
  17074. justify-content: center;
  17075. margin-bottom: 16px;
  17076. padding: 40px 24px 24px;
  17077. text-align: center;
  17078. width: 100%;
  17079. max-width: 330px
  17080. }
  17081. .contact-us-tile:last-child {
  17082. margin-bottom: 0
  17083. }
  17084. @media(min-width:48em) {
  17085. .contact-us-tile {
  17086. padding: 40px;
  17087. max-width: 408px
  17088. }
  17089. }
  17090. @media(min-width:64em) {
  17091. .contact-us-tile {
  17092. margin: 0
  17093. }
  17094. }
  17095. .contact-us-tile .sprite {
  17096. height: 48px;
  17097. width: 48px
  17098. }
  17099. @media(min-width:64em) {
  17100. .contact-us-tile .sprite {
  17101. height: 56px;
  17102. width: 56px
  17103. }
  17104. }
  17105. .contact-us-tile__header {
  17106. margin: 16px 0;
  17107. width: 100%
  17108. }
  17109. .contact-us-tile__subtext {
  17110. color: #655c6c;
  17111. margin-bottom: 16px;
  17112. width: 100%
  17113. }
  17114. .contact-us-tile__button {
  17115. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  17116. padding: 12px 16px
  17117. }
  17118. @media(min-width:64em) {
  17119. .contact-us-tile__button {
  17120. padding: 12px 24px
  17121. }
  17122. }
  17123. .contact-us-tile p {
  17124. margin: 0
  17125. }
  17126. .submission-message {
  17127. align-items: center;
  17128. background-color: #fff;
  17129. display: flex;
  17130. flex-direction: column;
  17131. margin-top: 24px;
  17132. padding: 24px 16px;
  17133. text-align: center;
  17134. width: 100%
  17135. }
  17136. @media(min-width:64em) {
  17137. .submission-message {
  17138. margin-top: 48px;
  17139. padding: 40px
  17140. }
  17141. }
  17142. .submission-message .sprite {
  17143. height: 64px;
  17144. width: 64px
  17145. }
  17146. @media(min-width:64em) {
  17147. .submission-message .sprite {
  17148. height: 80px;
  17149. width: 80px
  17150. }
  17151. }
  17152. .submission-message__header {
  17153. margin: 16px 0 8px
  17154. }
  17155. @media(min-width:64em) {
  17156. .submission-message__header {
  17157. margin: 16px 0
  17158. }
  17159. }
  17160. .submission-message__subtext {
  17161. margin: 0
  17162. }
  17163. .points-inquiry__container {
  17164. margin: 0 auto;
  17165. padding-bottom: 32px
  17166. }
  17167. @media(min-width:64em) {
  17168. .points-inquiry__container {
  17169. width: 840px;
  17170. padding: 0 0 112px
  17171. }
  17172. }
  17173. .offer-section__header {
  17174. position: relative;
  17175. margin: 0
  17176. }
  17177. .offer-section__modal {
  17178. display: flex;
  17179. padding: 5px;
  17180. justify-content: flex-end
  17181. }
  17182. .offer-section__inner--faded {
  17183. position: absolute;
  17184. top: 0;
  17185. left: 0;
  17186. z-index: 2;
  17187. background: #fff;
  17188. width: 100%;
  17189. height: 100%;
  17190. opacity: .5
  17191. }
  17192. .offers-container,
  17193. .offers-preview {
  17194. width: 100%;
  17195. max-width: none;
  17196. min-height: 300px;
  17197. padding-bottom: 36px;
  17198. padding-top: 18px
  17199. }
  17200. @media(min-width:48em) {
  17201. .offers-container,
  17202. .offers-preview {
  17203. padding-bottom: 40px;
  17204. padding-top: 26px
  17205. }
  17206. }
  17207. .offers-container img,
  17208. .offers-preview img {
  17209. max-width: 100%
  17210. }
  17211. .offers-container .marketing-tile__img,
  17212. .offers-preview .marketing-tile__img {
  17213. max-width: unset
  17214. }
  17215. .offers-container .offers-grid,
  17216. .offers-preview .offers-grid {
  17217. list-style-type: none;
  17218. margin-top: 0;
  17219. padding-left: 0
  17220. }
  17221. .offers-container .flyer-result,
  17222. .offers-container .marketing-tile,
  17223. .offers-container .offer,
  17224. .offers-container .offers-count,
  17225. .offers-container .offers-expiring,
  17226. .offers-container .offers-section-header,
  17227. .offers-container__error-tile,
  17228. .offers-container__section-header,
  17229. .offers-preview .flyer-result,
  17230. .offers-preview .marketing-tile,
  17231. .offers-preview .offer,
  17232. .offers-preview .offers-count,
  17233. .offers-preview .offers-expiring,
  17234. .offers-preview .offers-section-header {
  17235. max-width: 688px;
  17236. margin-left: auto;
  17237. margin-right: auto
  17238. }
  17239. @media(min-width:64em) {
  17240. .offers-container .flyer-result,
  17241. .offers-container .marketing-tile,
  17242. .offers-container .offer,
  17243. .offers-container .offers-count,
  17244. .offers-container .offers-expiring,
  17245. .offers-container .offers-section-header,
  17246. .offers-container__error-tile,
  17247. .offers-container__section-header,
  17248. .offers-preview .flyer-result,
  17249. .offers-preview .marketing-tile,
  17250. .offers-preview .offer,
  17251. .offers-preview .offers-count,
  17252. .offers-preview .offers-expiring,
  17253. .offers-preview .offers-section-header {
  17254. max-width: 780px
  17255. }
  17256. }
  17257. .offers-container-empty {
  17258. text-align: center;
  17259. max-width: 450px;
  17260. margin: 0 auto
  17261. }
  17262. @media(min-width:48em) {
  17263. .offers-container-empty {
  17264. max-width: 720px
  17265. }
  17266. }
  17267. .offers-container-empty--your-list {
  17268. max-width: none
  17269. }
  17270. .offers-container-empty__inner {
  17271. max-width: 450px;
  17272. margin: 0 auto
  17273. }
  17274. @media(min-width:48em) {
  17275. .offers-container-empty__inner {
  17276. max-width: 720px
  17277. }
  17278. }
  17279. .offers-container-empty__button {
  17280. margin-top: 10px;
  17281. margin-bottom: 20px;
  17282. display: inline-block
  17283. }
  17284. @media(min-width:48em) {
  17285. .offers-container-empty__button {
  17286. margin-top: 44px;
  17287. margin-bottom: 60px
  17288. }
  17289. }
  17290. @media(min-width:48em) {
  17291. .offers-container-empty__button--back {
  17292. margin-top: 24px
  17293. }
  17294. }
  17295. .offers-container-empty .offer--empty {
  17296. min-height: 160px;
  17297. margin-top: 30px
  17298. }
  17299. @media(min-width:48em) {
  17300. .offers-container-empty .offer--empty {
  17301. margin-top: 50px
  17302. }
  17303. }
  17304. .offers-container-empty .offer__inner {
  17305. display: flex;
  17306. padding: 20px;
  17307. align-items: center
  17308. }
  17309. .offers-container-empty .offer__content {
  17310. flex-grow: 1
  17311. }
  17312. .offers-container-empty .offer__icon {
  17313. width: 40px;
  17314. height: 40px;
  17315. margin-right: 20px
  17316. }
  17317. @media(min-width:48em) {
  17318. .offers-container-empty .offer__icon {
  17319. margin: 0 60px 0 40px
  17320. }
  17321. }
  17322. .offers-container-empty .offer__placeholder {
  17323. display: block;
  17324. width: 35%;
  17325. height: 1rem;
  17326. margin: 0 0 10px;
  17327. background-color: #ddd
  17328. }
  17329. .offers-container-empty .offer__placeholder:nth-child(2) {
  17330. width: 75%
  17331. }
  17332. .offers-container-empty .offer__placeholder:nth-child(3) {
  17333. width: 75%;
  17334. margin-top: 2rem;
  17335. margin-bottom: 0
  17336. }
  17337. .offers-container-empty .offer-checkmark {
  17338. pointer-events: none
  17339. }
  17340. .offers-container-empty .offer-checkmark__icon {
  17341. fill: #fff
  17342. }
  17343. .offers-container-empty .offer-checkmark:before {
  17344. border-right-color: #ee3124;
  17345. border-top-color: #ee3124
  17346. }
  17347. .offers-count {
  17348. margin-bottom: 18px
  17349. }
  17350. @media(min-width:48em) {
  17351. .offers-count {
  17352. display: none
  17353. }
  17354. }
  17355. .offers-expiring {
  17356. display: flex;
  17357. flex-flow: row nowrap;
  17358. align-items: center;
  17359. background: #0075ff;
  17360. color: #fff;
  17361. -webkit-font-smoothing: antialiased;
  17362. padding: 20px;
  17363. margin-bottom: 18px
  17364. }
  17365. @media(min-width:48em) {
  17366. .offers-expiring {
  17367. margin-bottom: 26px
  17368. }
  17369. }
  17370. .offers-expiring .sprite {
  17371. flex-shrink: 0;
  17372. fill: #fff;
  17373. margin-right: 20px
  17374. }
  17375. @media(min-width:48em) {
  17376. .offers-expiring .sprite {
  17377. width: 32px;
  17378. height: 32px
  17379. }
  17380. }
  17381. .offers-expiring__wrap {
  17382. flex-grow: 1;
  17383. display: flex;
  17384. flex-flow: row wrap;
  17385. align-items: center
  17386. }
  17387. .offers-expiring__message {
  17388. margin: 0 auto 0 0
  17389. }
  17390. .offers-expiring__close-button,
  17391. .offers-expiring__close-button:hover {
  17392. color: #fff
  17393. }
  17394. .offers-points-day-error {
  17395. margin-bottom: 25px
  17396. }
  17397. .inspiration-feed-one-wrapper {
  17398. display: flex;
  17399. position: relative;
  17400. justify-content: center;
  17401. width: 100%
  17402. }
  17403. .inspiration-feed-one-wrapper__background {
  17404. width: 100vw;
  17405. position: absolute;
  17406. height: 100%;
  17407. background-image: linear-gradient(#fdfbe7, #fdfbe7);
  17408. background-position: 50%;
  17409. margin-top: -46px;
  17410. z-index: 0;
  17411. left: 50%;
  17412. transform: translate(-50%)
  17413. }
  17414. .inspiration-feed-one-wrapper__content {
  17415. position: relative;
  17416. display: block;
  17417. width: 100%;
  17418. max-width: 688px
  17419. }
  17420. @media(min-width:64em) {
  17421. .inspiration-feed-one-wrapper__content {
  17422. max-width: 794px
  17423. }
  17424. }
  17425. .inspiration-feed-one-wrapper__content__image {
  17426. position: absolute;
  17427. max-width: 100%;
  17428. height: 226px;
  17429. top: calc(50% - 121px);
  17430. right: -118px
  17431. }
  17432. @media(min-width:48em) {
  17433. .inspiration-feed-one-wrapper__content__image {
  17434. top: calc(50% - 173px);
  17435. right: -118px
  17436. }
  17437. }
  17438. .inspiration-feed-one-wrapper__content .offers-section-header {
  17439. display: none
  17440. }
  17441. .modal-content .offers-modal__scroll-content {
  17442. max-height: 384px;
  17443. overflow-y: auto
  17444. }
  17445. @media(min-width:48em) {
  17446. .modal-content .offers-modal__scroll-content {
  17447. max-height: 674px
  17448. }
  17449. }
  17450. .modal-content .offers-modal__scroll-content--shoppable {
  17451. max-height: 240px;
  17452. overflow-y: auto
  17453. }
  17454. @media(min-width:48em) {
  17455. .modal-content .offers-modal__scroll-content--shoppable {
  17456. max-height: 524px
  17457. }
  17458. }
  17459. .modal-content .offer-content-group-carousel-wrapper {
  17460. overflow-y: auto;
  17461. height: calc(100% - 38px)
  17462. }
  17463. @media(min-width:48em) {
  17464. .modal-content .offer-content-group-carousel-wrapper {
  17465. height: calc(100% - 276px)
  17466. }
  17467. }
  17468. .modal-content .offer-content-group-carousel {
  17469. height: auto;
  17470. padding: 24px 26px 25px;
  17471. border-bottom: 1px solid #e0e0e0
  17472. }
  17473. .modal-content .offer-content-group-carousel--modal {
  17474. padding: 24px
  17475. }
  17476. @media(min-width:48em) {
  17477. .modal-content .offer-content-group-carousel {
  17478. border: 1px solid #e0e0e0
  17479. }
  17480. .modal-content .offer-content-group-carousel--modal {
  17481. padding: 24px 32px
  17482. }
  17483. }
  17484. .modal-content .offer__image--carousel {
  17485. display: block;
  17486. width: 100%;
  17487. height: 146px;
  17488. overflow-x: hidden
  17489. }
  17490. @media(min-width:48em) {
  17491. .modal-content .offer__image--carousel {
  17492. height: 226px;
  17493. max-height: 226px
  17494. }
  17495. }
  17496. .modal-content .offer__image--carousel .offer__image-element--carousel {
  17497. width: auto;
  17498. max-width: none;
  17499. height: 146px;
  17500. max-height: 146px;
  17501. -o-object-fit: cover;
  17502. object-fit: cover;
  17503. left: 50%;
  17504. transform: translate(-50%)
  17505. }
  17506. @media(min-width:48em) {
  17507. .modal-content .offer__image--carousel .offer__image-element--carousel {
  17508. height: 226px;
  17509. max-height: 226px
  17510. }
  17511. }
  17512. .modal-content .offer__image--carousel .offer__image-element--hero {
  17513. width: auto;
  17514. max-width: none;
  17515. height: 146px;
  17516. -o-object-fit: cover;
  17517. object-fit: cover;
  17518. left: 50%;
  17519. transform: translate(-50%)
  17520. }
  17521. @media(min-width:48em) {
  17522. .modal-content .offer__image--carousel .offer__image-element--hero {
  17523. height: 226px;
  17524. max-height: 226px
  17525. }
  17526. }
  17527. .modal-content .offer__image--add-to-shopping-list {
  17528. display: flex;
  17529. justify-content: center;
  17530. align-items: center
  17531. }
  17532. .modal-content .offer__image--add-to-shopping-list .offer__image-element--add-to-shopping-list {
  17533. height: auto
  17534. }
  17535. .modal-content .offer__text--carousel {
  17536. text-align: center
  17537. }
  17538. .modal-content .offer__text--no-reward {
  17539. margin: 0 auto
  17540. }
  17541. .modal-content .offer-details__carousel-modal-cta {
  17542. display: flex;
  17543. flex-direction: column;
  17544. align-items: center;
  17545. padding: 24px
  17546. }
  17547. .modal-content .offer-details__carousel-modal-cta a:first-child {
  17548. margin-bottom: 14px
  17549. }
  17550. .modal-content .offer-details__carousel-modal-cta a:first-child,
  17551. .modal-content .offer-details__carousel-modal-cta button:first-child {
  17552. width: 100%
  17553. }
  17554. @media(min-width:48em) {
  17555. .modal-content .offer-details__carousel-modal-cta {
  17556. padding: 32px
  17557. }
  17558. }
  17559. .modal-content .offer-details__content {
  17560. padding: 24px
  17561. }
  17562. @media(min-width:48em) {
  17563. .modal-content .offer-details__content {
  17564. padding: 32px
  17565. }
  17566. }
  17567. .modal-content .offer-details__explanation,
  17568. .modal-content .offer-details__info-discovery,
  17569. .modal-content .offer-details__offer-date,
  17570. .modal-content .offer-details__terms {
  17571. border: none;
  17572. padding: 0;
  17573. margin: 16px 0
  17574. }
  17575. .modal-content .offer-details__offer-date {
  17576. margin-top: 0
  17577. }
  17578. .hero-quest-offer,
  17579. .quest-offer {
  17580. border-radius: 16px
  17581. }
  17582. .hero-quest-offer.continuity-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17583. .hero-quest-offer.hero-continuity-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17584. .hero-quest-offer.hero-product-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17585. .hero-quest-offer.offer.continuity-offer.offer--faded.quest-offer--shadow-disabled,
  17586. .hero-quest-offer.offer.hero-continuity-offer.offer--faded.quest-offer--shadow-disabled,
  17587. .hero-quest-offer.offer.hero-product-offer.offer--faded.quest-offer--shadow-disabled,
  17588. .hero-quest-offer.offer.product-offer.offer--faded.quest-offer--shadow-disabled,
  17589. .hero-quest-offer.product-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17590. .quest-offer.continuity-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17591. .quest-offer.hero-continuity-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17592. .quest-offer.hero-product-offer.offer--faded.quest-offer--shadow-disabled.flyer-result,
  17593. .quest-offer.offer.continuity-offer.offer--faded.quest-offer--shadow-disabled,
  17594. .quest-offer.offer.hero-continuity-offer.offer--faded.quest-offer--shadow-disabled,
  17595. .quest-offer.offer.hero-product-offer.offer--faded.quest-offer--shadow-disabled,
  17596. .quest-offer.offer.product-offer.offer--faded.quest-offer--shadow-disabled,
  17597. .quest-offer.product-offer.offer--faded.quest-offer--shadow-disabled.flyer-result {
  17598. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  17599. cursor: auto
  17600. }
  17601. .hero-quest-offer__top-inner,
  17602. .quest-offer__top-inner {
  17603. display: flex;
  17604. flex-direction: column
  17605. }
  17606. .hero-quest-offer__top-inner .offer__image,
  17607. .quest-offer__top-inner .offer__image {
  17608. max-width: 780px;
  17609. overflow: hidden
  17610. }
  17611. .hero-quest-offer__top-inner .offer__image img,
  17612. .quest-offer__top-inner .offer__image img {
  17613. border-radius: 16px 16px 0 0;
  17614. max-width: 100%;
  17615. max-height: 160px;
  17616. -o-object-fit: cover;
  17617. object-fit: cover
  17618. }
  17619. .hero-quest-offer__content-group,
  17620. .quest-offer__content-group {
  17621. margin: 20px 30px 16px
  17622. }
  17623. .hero-quest-offer .offer__reward,
  17624. .quest-offer .offer__reward {
  17625. color: #ac342a
  17626. }
  17627. .hero-quest-offer.offer--faded .offer__reward,
  17628. .hero-quest-offer .offer__reward--unearnable,
  17629. .quest-offer.offer--faded .offer__reward,
  17630. .quest-offer .offer__reward--unearnable {
  17631. color: #655c6c
  17632. }
  17633. .hero-quest-offer .offer__text,
  17634. .quest-offer .offer__text {
  17635. margin-top: 4px
  17636. }
  17637. .quest-offer-footer-date {
  17638. border-top: 1px solid rgba(155, 149, 168, .16);
  17639. color: #655c6c;
  17640. display: block;
  17641. margin-top: auto;
  17642. padding: 10px 18px;
  17643. width: 100%
  17644. }
  17645. .quest-offer-child-offer {
  17646. display: flex;
  17647. height: 100%
  17648. }
  17649. .quest-offer-child-offer__container {
  17650. border: 1px solid rgba(155, 149, 168, .16);
  17651. border-radius: 8px;
  17652. cursor: pointer;
  17653. display: flex;
  17654. flex-direction: column;
  17655. width: 214px;
  17656. text-align: left
  17657. }
  17658. @media(min-width:48em) {
  17659. .quest-offer-child-offer__container {
  17660. width: 323px
  17661. }
  17662. }
  17663. .quest-offer-child-offer__container--modal-disabled {
  17664. cursor: grab
  17665. }
  17666. .quest-offer-child-offer__inner {
  17667. position: relative
  17668. }
  17669. .quest-offer-child-offer__indicator--earned {
  17670. background-color: #157a77;
  17671. display: flex;
  17672. justify-content: center;
  17673. align-items: center;
  17674. border-radius: 50%;
  17675. width: 24px;
  17676. height: 24px;
  17677. position: absolute;
  17678. left: 34px;
  17679. top: 34px;
  17680. z-index: 1
  17681. }
  17682. .quest-offer-child-offer__indicator--earned .sprite {
  17683. fill: #fff;
  17684. height: 20px;
  17685. width: 20px
  17686. }
  17687. .quest-offer-child-offer .continuity-offer__top-inner,
  17688. .quest-offer-child-offer .hero-continuity-offer__top-inner,
  17689. .quest-offer-child-offer .hero-product-offer__top-inner,
  17690. .quest-offer-child-offer .product-offer__top-inner {
  17691. display: flex;
  17692. align-items: flex-start;
  17693. padding: 20px
  17694. }
  17695. .quest-offer-child-offer .continuity-offer__top-inner .offer__image,
  17696. .quest-offer-child-offer .hero-continuity-offer__top-inner .offer__image,
  17697. .quest-offer-child-offer .hero-product-offer__top-inner .offer__image,
  17698. .quest-offer-child-offer .product-offer__top-inner .offer__image {
  17699. max-width: 50px;
  17700. margin: 0 16px 0 0
  17701. }
  17702. .quest-offer-child-offer .continuity-offer__top-inner .offer__image img,
  17703. .quest-offer-child-offer .hero-continuity-offer__top-inner .offer__image img,
  17704. .quest-offer-child-offer .hero-product-offer__top-inner .offer__image img,
  17705. .quest-offer-child-offer .product-offer__top-inner .offer__image img {
  17706. border-radius: 0;
  17707. max-width: 100%;
  17708. -o-object-fit: cover;
  17709. object-fit: cover
  17710. }
  17711. .quest-offer-child-offer .continuity-offer__content-group,
  17712. .quest-offer-child-offer .hero-continuity-offer__content-group,
  17713. .quest-offer-child-offer .hero-product-offer__content-group,
  17714. .quest-offer-child-offer .product-offer__content-group {
  17715. min-height: 0;
  17716. padding: 0
  17717. }
  17718. .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  17719. .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  17720. .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  17721. .quest-offer-child-offer .product-offer__content-group .offer__reward {
  17722. color: #ac342a
  17723. }
  17724. .quest-offer-child-offer .continuity-offer__content-group .offer__text--no-reward,
  17725. .quest-offer-child-offer .hero-continuity-offer__content-group .offer__text--no-reward,
  17726. .quest-offer-child-offer .hero-product-offer__content-group .offer__text--no-reward,
  17727. .quest-offer-child-offer .product-offer__content-group .offer__text--no-reward {
  17728. margin: 0 auto
  17729. }
  17730. .quest-offer-child-offer.offer--faded .offer__reward {
  17731. color: #655c6c
  17732. }
  17733. .quest-offer-child-offer.offer--faded .offer__reward--earned {
  17734. color: #615395
  17735. }
  17736. .quest-offer-child-offer-list {
  17737. margin: 16px auto 20px
  17738. }
  17739. .quest-offer-child-offer-list--sequential .scroll-slider-quest-offer-child-offer-list__item:not(:last-child):after {
  17740. content: "";
  17741. width: 12px;
  17742. height: 6px;
  17743. background: #f9dada;
  17744. display: block;
  17745. position: absolute;
  17746. top: 50%;
  17747. right: -12px;
  17748. transform: translateY(-50%)
  17749. }
  17750. .quest-offer-child-offer-list__carousel-container .scroll-slider-quest-offer-child-offer-list {
  17751. position: relative
  17752. }
  17753. .quest-offer-child-offer-list__carousel-container .scroll-slider-quest-offer-child-offer-list__item:not(:last-child) {
  17754. margin-right: 12px;
  17755. position: relative
  17756. }
  17757. .quest-offer-child-offer-list__carousel-container .scroll-slider-quest-offer-child-offer-list__item-tile {
  17758. display: flex;
  17759. height: 100%
  17760. }
  17761. .quest-offer-child-offer-list__carousel-container .scroll-slider-quest-offer-child-offer-list__item-tile fieldset {
  17762. display: flex;
  17763. margin: 0
  17764. }
  17765. .scroll-slider-quest-offer-child-offer {
  17766. margin: 0 auto
  17767. }
  17768. .scroll-slider-quest-offer-child-offer .slider-holder-div {
  17769. display: block;
  17770. width: 100%
  17771. }
  17772. .scroll-slider-quest-offer-child-offer-list--scroll {
  17773. scroll-snap-type: x mandatory;
  17774. padding: 0 30px 16px
  17775. }
  17776. .scroll-slider-quest-offer-child-offer-list--scroll::-webkit-scrollbar {
  17777. display: block;
  17778. height: 10px;
  17779. width: 100%
  17780. }
  17781. .scroll-slider-quest-offer-child-offer-list--scroll::-webkit-scrollbar-thumb {
  17782. border-radius: 10px;
  17783. background: #c2c2c2
  17784. }
  17785. .scroll-slider-quest-offer-child-offer-list--scroll::-webkit-scrollbar-track {
  17786. border-radius: 10px;
  17787. background: #f1f1f1;
  17788. margin: 0 30px
  17789. }
  17790. .scroll-slider-quest-offer-child-offer-list__button-container {
  17791. display: none
  17792. }
  17793. .quest-offer-progress {
  17794. display: flex;
  17795. align-items: center;
  17796. margin: 0 30px
  17797. }
  17798. @media(min-width:48em) {
  17799. .quest-offer-progress {
  17800. justify-content: flex-start
  17801. }
  17802. }
  17803. .quest-offer-progress__container {
  17804. display: grid;
  17805. grid-template-columns: repeat(5, 1fr);
  17806. grid-gap: 5px;
  17807. width: -moz-fit-content;
  17808. width: fit-content;
  17809. width: 60%;
  17810. list-style-type: none;
  17811. padding-left: 0
  17812. }
  17813. .quest-offer-progress__container :first-child {
  17814. margin-left: 0
  17815. }
  17816. @media(min-width:34.375em) {
  17817. .quest-offer-progress__container {
  17818. grid-template-columns: repeat(10, 1fr);
  17819. grid-gap: 16px
  17820. }
  17821. }
  17822. .quest-offer-progress__indicator {
  17823. background-color: #fdf0f0;
  17824. border-radius: 50%;
  17825. width: 24px;
  17826. height: 24px;
  17827. position: relative;
  17828. margin-left: 0
  17829. }
  17830. .quest-offer-progress__indicator span {
  17831. color: #6c221a
  17832. }
  17833. .quest-offer-progress__indicator .sprite,
  17834. .quest-offer-progress__indicator span {
  17835. position: absolute;
  17836. left: 50%;
  17837. top: 50%;
  17838. transform: translate(-50%, -50%)
  17839. }
  17840. .quest-offer-progress__indicator--active {
  17841. background-color: #fff;
  17842. border: 2px solid #6c221a
  17843. }
  17844. .quest-offer-progress__indicator--earned {
  17845. background-color: #157a77
  17846. }
  17847. .quest-offer-progress__indicator--notApplicable span,
  17848. .quest-offer-progress__indicator--unearnable span {
  17849. color: #fff
  17850. }
  17851. .quest-offer-progress__indicator--expired,
  17852. .quest-offer-progress__indicator--notApplicable,
  17853. .quest-offer-progress__indicator--unearnable {
  17854. background-color: #9e93a6
  17855. }
  17856. .quest-offer-progress__indicator--earned .sprite,
  17857. .quest-offer-progress__indicator--expired .sprite {
  17858. fill: #fff;
  17859. height: 20px;
  17860. width: 20px
  17861. }
  17862. .quest-offer-footer {
  17863. border-top: 1px solid rgba(155, 149, 168, .16);
  17864. display: flex;
  17865. flex-direction: column-reverse;
  17866. justify-content: center;
  17867. align-items: center;
  17868. text-align: left;
  17869. min-height: 40px;
  17870. padding: 0
  17871. }
  17872. @media(min-width:48em) {
  17873. .quest-offer-footer {
  17874. padding: 10px 30px;
  17875. min-height: 50px;
  17876. flex-direction: row-reverse;
  17877. justify-content: space-between
  17878. }
  17879. }
  17880. .quest-offer-footer__action-buttons {
  17881. display: flex;
  17882. flex-direction: column;
  17883. align-items: center;
  17884. width: 100%
  17885. }
  17886. @media(min-width:48em) {
  17887. .quest-offer-footer__action-buttons {
  17888. flex-direction: row;
  17889. width: -moz-fit-content;
  17890. width: fit-content
  17891. }
  17892. }
  17893. .quest-offer-footer__view-details {
  17894. padding: 10px 18px
  17895. }
  17896. @media(min-width:48em) {
  17897. .quest-offer-footer__view-details {
  17898. padding: 0
  17899. }
  17900. }
  17901. .quest-offer-footer__view-details-container {
  17902. display: flex;
  17903. width: 100%;
  17904. justify-content: center;
  17905. border-top: 1px solid rgba(155, 149, 168, .16)
  17906. }
  17907. @media(min-width:48em) {
  17908. .quest-offer-footer__view-details-container {
  17909. border-top: none;
  17910. width: -moz-fit-content;
  17911. width: fit-content
  17912. }
  17913. }
  17914. .quest-offer-footer__hide-offer {
  17915. display: flex;
  17916. align-items: center;
  17917. padding: 10px 0
  17918. }
  17919. .quest-offer-footer__hide-offer svg {
  17920. margin-right: 4px;
  17921. width: 20px
  17922. }
  17923. @media(min-width:48em) {
  17924. .quest-offer-footer__hide-offer {
  17925. padding: 0
  17926. }
  17927. }
  17928. .quest-offer-footer .quest-offer-footer-date {
  17929. border: none;
  17930. display: flex;
  17931. justify-content: center;
  17932. color: #655c6c
  17933. }
  17934. @media(min-width:48em) {
  17935. .quest-offer-footer .quest-offer-footer-date {
  17936. padding: 0
  17937. }
  17938. }
  17939. .offers-feed__category-filter {
  17940. position: relative
  17941. }
  17942. .offers-feed__category-filter ul {
  17943. padding: 0
  17944. }
  17945. .offers-feed__category-filter ul li:not(:nth-last-child(2)):not(:last-child) {
  17946. margin-right: 8px
  17947. }
  17948. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-container {
  17949. position: absolute;
  17950. top: 0;
  17951. display: flex;
  17952. align-items: center;
  17953. height: 100%;
  17954. width: 100%
  17955. }
  17956. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-left--gradient-bg,
  17957. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-right--gradient-bg {
  17958. z-index: 1;
  17959. display: flex;
  17960. align-items: center;
  17961. height: 100%
  17962. }
  17963. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-left--gradient-bg button,
  17964. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-right--gradient-bg button {
  17965. z-index: 2
  17966. }
  17967. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-left--gradient-bg {
  17968. padding-right: 15px;
  17969. background: linear-gradient(90deg, #fff 48.44%, hsla(0, 0%, 100%, 0))
  17970. }
  17971. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider-list__button-right--gradient-bg {
  17972. margin-left: auto;
  17973. padding-left: 15px;
  17974. background: linear-gradient(270deg, #fff 48.44%, hsla(0, 0%, 100%, 0))
  17975. }
  17976. .offers-feed__category-filter .scroll-slider-offers-feed__category-filter-slider--scroll {
  17977. margin: 0 0 8px
  17978. }
  17979. .offers-feed__category-filter,
  17980. .offers-feed__category-filter-label {
  17981. margin: 0 auto 16px
  17982. }
  17983. .offers-feed__category-filter--bold,
  17984. .offers-feed__category-filter-label--bold {
  17985. font-weight: 700
  17986. }
  17987. @media(min-width:64em) {
  17988. .offers-feed__category-filter,
  17989. .offers-feed__category-filter-label {
  17990. width: 780px
  17991. }
  17992. }
  17993. .offers-feed__category-filter .category-filter__button {
  17994. width: -moz-fit-content;
  17995. width: fit-content;
  17996. min-width: 50px;
  17997. padding: 10px 16px;
  17998. display: flex;
  17999. justify-content: center;
  18000. align-items: center
  18001. }
  18002. .offers-feed__category-filter .category-filter__button span {
  18003. color: inherit;
  18004. font-weight: 400
  18005. }
  18006. .offers-feed__category-filter .category-filter__button svg {
  18007. display: inline-block;
  18008. margin-right: 4px;
  18009. transition: fill .1s;
  18010. width: 18px;
  18011. height: 18px
  18012. }
  18013. .offers-feed-filter-empty {
  18014. text-align: center;
  18015. padding: 26px 20px
  18016. }
  18017. .offers-feed-filter-empty h2 {
  18018. margin: 0 0 8px
  18019. }
  18020. .offers-feed-filter-empty p {
  18021. margin: 0 0 16px
  18022. }
  18023. .how-points-work {
  18024. background-color: #fff
  18025. }
  18026. .how-points-work__utility-header {
  18027. margin-bottom: 2px
  18028. }
  18029. @media(min-width:64em) {
  18030. .how-points-work__utility-header {
  18031. margin-bottom: 8px
  18032. }
  18033. }
  18034. .how-points-work__container {
  18035. margin: 0 auto 32px;
  18036. padding: 0
  18037. }
  18038. @media(min-width:64em) {
  18039. .how-points-work__container {
  18040. max-width: 840px;
  18041. margin-bottom: 72px
  18042. }
  18043. }
  18044. .how-points-work-tile {
  18045. border-bottom: 1px solid #ddd;
  18046. background-color: #fff
  18047. }
  18048. @media(min-width:64em) {
  18049. .how-points-work-tile {
  18050. border-bottom: none
  18051. }
  18052. }
  18053. .how-points-work-tile:last-child {
  18054. border-bottom: none
  18055. }
  18056. @media(min-width:64em) {
  18057. .how-points-work-tile__tile-container {
  18058. background-color: #f0f0f0;
  18059. padding: 40px
  18060. }
  18061. }
  18062. .how-points-work-tile__title {
  18063. margin: 30px 0 16px
  18064. }
  18065. @media(min-width:64em) {
  18066. .how-points-work-tile__title {
  18067. margin: 40px 0 24px
  18068. }
  18069. }
  18070. .how-points-work-tile__subtitle {
  18071. margin-bottom: 26px
  18072. }
  18073. @media(min-width:64em) {
  18074. .how-points-work-tile__subtitle {
  18075. margin-bottom: 16px
  18076. }
  18077. }
  18078. .how-points-work-rule {
  18079. display: flex;
  18080. margin-bottom: 24px
  18081. }
  18082. @media(min-width:64em) {
  18083. .how-points-work-rule {
  18084. margin-bottom: 32px
  18085. }
  18086. }
  18087. .how-points-work-rule--vertical {
  18088. flex-direction: column
  18089. }
  18090. .how-points-work-rule__titles {
  18091. flex: 1
  18092. }
  18093. .how-points-work-rule__title {
  18094. font-weight: 700;
  18095. margin-bottom: 8px;
  18096. margin-top: 0
  18097. }
  18098. .how-points-work-rule__subtext {
  18099. margin: 0
  18100. }
  18101. .how-points-work-rule__sprite-container {
  18102. display: flex;
  18103. align-items: center;
  18104. margin-bottom: 8px
  18105. }
  18106. .how-points-work-rule__sprite-container--background {
  18107. width: 44px;
  18108. height: 44px;
  18109. margin-right: 12px;
  18110. margin-bottom: 0;
  18111. background-color: #fbf1f1;
  18112. border-radius: 50%;
  18113. justify-content: center
  18114. }
  18115. @media(min-width:64em) {
  18116. .how-points-work-rule__sprite-container--background {
  18117. width: 64px;
  18118. height: 64px;
  18119. margin-right: 24px
  18120. }
  18121. }
  18122. .how-points-work-rule__sprite {
  18123. width: 33px;
  18124. height: 33px
  18125. }
  18126. @media(min-width:64em) {
  18127. .how-points-work-rule__sprite {
  18128. width: 48px;
  18129. height: 48px
  18130. }
  18131. }
  18132. .how-points-work-rule__sprite--loblaw-flag {
  18133. width: 32px;
  18134. height: 32px;
  18135. margin: 8px 24px 0 0
  18136. }
  18137. @media(min-width:64em) {
  18138. .how-points-work-rule__sprite--loblaw-flag {
  18139. height: 44px;
  18140. width: 44px
  18141. }
  18142. }
  18143. .how-points-work-rule__sprite--superstore-flag {
  18144. width: 32px;
  18145. height: 32px;
  18146. margin: 8px 24px 0 0
  18147. }
  18148. @media(min-width:64em) {
  18149. .how-points-work-rule__sprite--superstore-flag {
  18150. height: 44px;
  18151. width: 44px
  18152. }
  18153. }
  18154. .how-points-work-rule__sprite--pc-express-flag {
  18155. width: 32px;
  18156. height: 32px;
  18157. margin: 8px 24px 0 0
  18158. }
  18159. @media(min-width:64em) {
  18160. .how-points-work-rule__sprite--pc-express-flag {
  18161. height: 44px;
  18162. width: 44px
  18163. }
  18164. }
  18165. .how-points-work-rule__sprite--shoppers-drug-mart-red {
  18166. width: 135px;
  18167. height: 32px
  18168. }
  18169. @media(min-width:64em) {
  18170. .how-points-work-rule__sprite--shoppers-drug-mart-red {
  18171. width: 150px;
  18172. height: 36px
  18173. }
  18174. }
  18175. .how-points-work-rule__sprite--pharmaprix-new {
  18176. width: 135px;
  18177. height: 32px
  18178. }
  18179. @media(min-width:64em) {
  18180. .how-points-work-rule__sprite--pharmaprix-new {
  18181. width: 150px;
  18182. height: 36px
  18183. }
  18184. }
  18185. .how-points-work-rule__sprite--esso-mobil-logo-light-bg {
  18186. height: 27px;
  18187. width: 99px;
  18188. margin-right: 14px
  18189. }
  18190. @media(min-width:64em) {
  18191. .how-points-work-rule__sprite--esso-mobil-logo-light-bg {
  18192. height: 31px;
  18193. width: 114px;
  18194. margin-right: 16px
  18195. }
  18196. }
  18197. .how-points-work-rule__sprite--joe-fresh {
  18198. width: 120px;
  18199. height: 28px
  18200. }
  18201. @media(min-width:64em) {
  18202. .how-points-work-rule__sprite--joe-fresh {
  18203. width: 150px;
  18204. height: 36px
  18205. }
  18206. }
  18207. .how-points-work-tile-footer {
  18208. margin-bottom: 30px;
  18209. display: inline-block
  18210. }
  18211. @media(min-width:64em) {
  18212. .how-points-work-tile-footer {
  18213. margin-bottom: 0;
  18214. margin-top: 8px
  18215. }
  18216. }
  18217. .how-points-work-tile-footer__sparkles-icon {
  18218. height: 25px;
  18219. margin-right: 16px
  18220. }
  18221. @media(min-width:64em) {
  18222. .how-points-work-tile-footer__sparkles-icon {
  18223. width: 30px;
  18224. height: 31px;
  18225. margin: 0 12px 0 0
  18226. }
  18227. }
  18228. .how-points-work-tile-footer__footer-container {
  18229. background-color: #f4f1f6;
  18230. border-radius: 8px;
  18231. display: flex;
  18232. align-items: center;
  18233. padding: 16px 24px 15px 12px
  18234. }
  18235. @media(min-width:64em) {
  18236. .how-points-work-tile-footer__footer-container {
  18237. background-color: #fff;
  18238. padding: 22px 24px 21px 12px
  18239. }
  18240. }
  18241. .how-points-work-tile-footer__footer-text {
  18242. color: #655c6c;
  18243. font-size: .8125rem;
  18244. line-height: 1.3846
  18245. }
  18246. @media(min-width:64em) {
  18247. .how-points-work-tile-footer__footer-text {
  18248. font-size: 1rem;
  18249. line-height: 1.5
  18250. }
  18251. }
  18252. .redemption-message {
  18253. text-align: center
  18254. }
  18255. @media(min-width:64em) {
  18256. .redemption-message {
  18257. text-align: left
  18258. }
  18259. }
  18260. .redemption-message__text {
  18261. font-size: .8125rem;
  18262. line-height: 1.125;
  18263. padding: 16px 0;
  18264. font-weight: 700;
  18265. display: flex;
  18266. flex-direction: column;
  18267. background-color: #f4f1f6;
  18268. border-radius: 4px
  18269. }
  18270. @media(min-width:64em) {
  18271. .redemption-message__text {
  18272. font-size: 1rem;
  18273. line-height: 1.5;
  18274. margin: 24px 0 16px;
  18275. padding: 0;
  18276. background-color: #f0f0f0
  18277. }
  18278. }
  18279. .redemption-message__footnote {
  18280. margin: 8px 0 30px
  18281. }
  18282. @media(min-width:64em) {
  18283. .redemption-message__footnote {
  18284. margin: 0
  18285. }
  18286. }
  18287. .redemption-message__footnote--text {
  18288. margin-left: 5px
  18289. }
  18290. @media(min-width:64em) {
  18291. .redemption-message__footnote--text {
  18292. margin-left: 13px
  18293. }
  18294. }
  18295. .offer-badge {
  18296. position: absolute;
  18297. top: 0;
  18298. right: 0;
  18299. padding: 4px 16px 2px;
  18300. border-top-right-radius: 8px;
  18301. -webkit-font-smoothing: antialiased
  18302. }
  18303. .offer-badge--gray-white {
  18304. background: #655c6c;
  18305. color: #fff
  18306. }
  18307. .offer-badge--orange-gray {
  18308. background: #ffc27b;
  18309. color: #403840
  18310. }
  18311. .offer-badge--yellow-gray {
  18312. background: #fff37b;
  18313. color: #403840
  18314. }
  18315. .offer-badge--yellow-gray-no-radius {
  18316. background: #fff37b;
  18317. color: #403840;
  18318. border-radius: 0
  18319. }
  18320. .feature-tile {
  18321. max-width: 688px;
  18322. margin: 18px auto;
  18323. display: flex;
  18324. text-decoration: inherit;
  18325. position: relative;
  18326. border-radius: 8px;
  18327. border: 1px solid #efeef1;
  18328. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  18329. transition: box-shadow .3s ease-in-out;
  18330. background-position: 100%;
  18331. background-size: contain;
  18332. background-repeat: no-repeat
  18333. }
  18334. .feature-tile:focus,
  18335. .feature-tile:focus-within,
  18336. .feature-tile:hover {
  18337. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  18338. cursor: pointer
  18339. }
  18340. @media(min-width:34.375em) {
  18341. .feature-tile {
  18342. flex-direction: row
  18343. }
  18344. }
  18345. @media(min-width:64em) {
  18346. .feature-tile {
  18347. max-width: 780px
  18348. }
  18349. }
  18350. .feature-tile__content {
  18351. display: flex;
  18352. flex-direction: column;
  18353. order: 1;
  18354. padding: 16px
  18355. }
  18356. @media(min-width:34.375em) {
  18357. .feature-tile__content {
  18358. padding: 32px;
  18359. order: 0
  18360. }
  18361. }
  18362. .feature-tile__content h1 {
  18363. margin: 0;
  18364. font-size: 1.375rem;
  18365. color: #191919
  18366. }
  18367. @media(min-width:34.375em) {
  18368. .feature-tile__content h1 {
  18369. font-size: 1.5rem;
  18370. line-height: 1.8125rem
  18371. }
  18372. }
  18373. .feature-tile__subcopy {
  18374. color: #655c6c;
  18375. font-size: .9375rem;
  18376. margin: 8px 0
  18377. }
  18378. @media(min-width:34.375em) {
  18379. .feature-tile__subcopy {
  18380. font-size: 1rem
  18381. }
  18382. }
  18383. .feature-tile__cta {
  18384. display: flex;
  18385. text-decoration: underline;
  18386. font-size: .75rem;
  18387. margin: 8px 0 0
  18388. }
  18389. @media(min-width:34.375em) {
  18390. .feature-tile__cta {
  18391. font-size: 1rem
  18392. }
  18393. }
  18394. .shop-the-flyer {
  18395. background-color: #fbf1f1;
  18396. flex-direction: column;
  18397. border: none
  18398. }
  18399. @media(min-width:34.375em) {
  18400. .shop-the-flyer {
  18401. flex-direction: row
  18402. }
  18403. }
  18404. .deals-for-you__container {
  18405. margin: 0 auto
  18406. }
  18407. @media(min-width:48em) {
  18408. .deals-for-you__container {
  18409. max-width: 688px
  18410. }
  18411. }
  18412. @media(min-width:64em) {
  18413. .deals-for-you__container {
  18414. max-width: 780px
  18415. }
  18416. }
  18417. .deals-for-you__subtitle {
  18418. margin: 0
  18419. }
  18420. .deals-for-you__header {
  18421. display: flex;
  18422. justify-content: space-between;
  18423. align-items: center;
  18424. margin: 24px 0
  18425. }
  18426. .deals-for-you__header-logo svg {
  18427. height: 24px;
  18428. width: 130px
  18429. }
  18430. .deals-for-you__header-cta {
  18431. color: #157a77;
  18432. transition: all .2s
  18433. }
  18434. .deals-for-you__header-cta:focus,
  18435. .deals-for-you__header-cta:hover {
  18436. color: #615395
  18437. }
  18438. .deals-for-you-tile {
  18439. border-radius: 16px;
  18440. border: 1px solid rgba(158, 147, 166, .32);
  18441. background: #fff;
  18442. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14)
  18443. }
  18444. .deals-for-you-tile__grocery {
  18445. height: 375px
  18446. }
  18447. @media(min-width:48em) {
  18448. .deals-for-you-tile__grocery {
  18449. height: 389px
  18450. }
  18451. }
  18452. .deals-for-you-tile__grocery:focus,
  18453. .deals-for-you-tile__grocery:hover,
  18454. .deals-for-you-tile__pharmacy:focus {
  18455. outline: none;
  18456. box-shadow: 0 4px 5px rgba(158, 147, 166, .2), 0 3px 14px rgba(158, 147, 166, .12), 0 8px 10px rgba(158, 147, 166, .14);
  18457. transition: box-shadow .3s ease-in-out
  18458. }
  18459. .deals-for-you-tile__content,
  18460. .deals-for-you-tile__pharmacy {
  18461. height: 316px
  18462. }
  18463. @media(min-width:48em) {
  18464. .deals-for-you-tile__content,
  18465. .deals-for-you-tile__pharmacy {
  18466. height: 326px
  18467. }
  18468. }
  18469. .deals-for-you-tile__content {
  18470. display: flex;
  18471. flex-direction: column;
  18472. padding: 24px 24px 16px
  18473. }
  18474. .deals-for-you-tile__content-img {
  18475. height: 100px;
  18476. width: auto;
  18477. text-align: center
  18478. }
  18479. .deals-for-you-tile__content-img img {
  18480. height: 100%
  18481. }
  18482. .deals-for-you-tile__content-text {
  18483. height: 100%;
  18484. display: flex;
  18485. flex-direction: column;
  18486. justify-content: space-between
  18487. }
  18488. .deals-for-you-tile__content-text-copy {
  18489. display: flex;
  18490. flex-direction: column;
  18491. justify-content: flex-start
  18492. }
  18493. .deals-for-you-tile__price {
  18494. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  18495. font-size: 1.375rem;
  18496. line-height: 1.75rem;
  18497. color: #ac342a;
  18498. margin-top: 16px;
  18499. margin-bottom: 8px;
  18500. font-weight: 600
  18501. }
  18502. @media(min-width:48em) {
  18503. .deals-for-you-tile__price {
  18504. font-size: 1.5rem;
  18505. line-height: 2rem
  18506. }
  18507. }
  18508. .deals-for-you-tile__item {
  18509. display: -webkit-box;
  18510. -webkit-line-clamp: 3;
  18511. -webkit-box-orient: vertical;
  18512. overflow: hidden;
  18513. margin: 0
  18514. }
  18515. .deals-for-you-tile__text-subcopy {
  18516. color: #655c6c;
  18517. margin: 0
  18518. }
  18519. .deals-for-you-tile__shop-now {
  18520. display: flex;
  18521. align-items: center;
  18522. justify-content: center;
  18523. height: 62px;
  18524. text-align: center;
  18525. border-top: 1px solid rgba(158, 147, 166, .2)
  18526. }
  18527. .deals-for-you-feature-highlight {
  18528. width: 100%;
  18529. max-width: 688px;
  18530. margin: auto
  18531. }
  18532. @media(min-width:64em) {
  18533. .deals-for-you-feature-highlight {
  18534. max-width: 780px
  18535. }
  18536. }
  18537. .deals-for-you-feature__badge {
  18538. width: -moz-fit-content;
  18539. width: fit-content;
  18540. background-color: #ffc27b;
  18541. padding: 8px 16px;
  18542. border-radius: 25px;
  18543. margin: 32px auto 0
  18544. }
  18545. @media(min-width:48em) {
  18546. .deals-for-you-feature__badge {
  18547. margin: 35px 0 0
  18548. }
  18549. }
  18550. .scroll-slider-deals-for-you .slider-holder-div {
  18551. width: 100vw
  18552. }
  18553. @media(min-width:48em) {
  18554. .scroll-slider-deals-for-you .slider-holder-div {
  18555. width: 100%
  18556. }
  18557. }
  18558. .scroll-slider-deals-for-you {
  18559. margin: 0 auto 20px
  18560. }
  18561. .scroll-slider-deals-for-you-list--scroll {
  18562. scroll-snap-type: x mandatory;
  18563. padding: 0 0 10px;
  18564. scrollbar-width: none
  18565. }
  18566. @media(min-width:48em) {
  18567. .scroll-slider-deals-for-you-list--scroll {
  18568. margin: 0 calc(-50vw + 343px);
  18569. padding: 0 30px 16px calc(50vw - 343px)
  18570. }
  18571. }
  18572. @media(min-width:64em) {
  18573. .scroll-slider-deals-for-you-list--scroll {
  18574. scrollbar-width: auto;
  18575. margin: 0;
  18576. padding: 0 0 16px
  18577. }
  18578. }
  18579. .scroll-slider-deals-for-you-list--scroll::-webkit-scrollbar {
  18580. height: 7px;
  18581. display: none
  18582. }
  18583. @media(min-width:64em) {
  18584. .scroll-slider-deals-for-you-list--scroll::-webkit-scrollbar {
  18585. height: 12px;
  18586. display: block
  18587. }
  18588. }
  18589. @media(min-width:48em) {
  18590. .scroll-slider-deals-for-you-list--scroll::-webkit-scrollbar-track {
  18591. border-radius: 12px;
  18592. background: #e0e1e3;
  18593. margin: 0 calc(50vw - 343px)
  18594. }
  18595. }
  18596. @media(min-width:64em) {
  18597. .scroll-slider-deals-for-you-list--scroll::-webkit-scrollbar-track {
  18598. margin: 0
  18599. }
  18600. }
  18601. .scroll-slider-deals-for-you-list__item,
  18602. .scroll-slider-deals-for-you-list__item-tile {
  18603. border-radius: 16px;
  18604. margin-right: 16px;
  18605. width: 242px
  18606. }
  18607. @media(min-width:48em) {
  18608. .scroll-slider-deals-for-you-list__item,
  18609. .scroll-slider-deals-for-you-list__item-tile {
  18610. margin-right: 24px;
  18611. width: 249px
  18612. }
  18613. }
  18614. @media(min-width:64em) {
  18615. .scroll-slider-deals-for-you-list__item,
  18616. .scroll-slider-deals-for-you-list__item-tile {
  18617. width: 244px
  18618. }
  18619. }
  18620. .scroll-slider-deals-for-you-list__item {
  18621. scroll-snap-align: start;
  18622. scroll-margin-left: 16px
  18623. }
  18624. @media(min-width:48em) {
  18625. .scroll-slider-deals-for-you-list__item {
  18626. scroll-margin-left: 24px
  18627. }
  18628. }
  18629. @media(min-width:64em) {
  18630. .scroll-slider-deals-for-you-list__item {
  18631. scroll-snap-align: center;
  18632. scroll-margin-left: 0
  18633. }
  18634. }
  18635. .scroll-slider-deals-for-you-list__item:first-child {
  18636. margin-left: 25px;
  18637. scroll-margin-left: 25px
  18638. }
  18639. @media(min-width:48em) {
  18640. .scroll-slider-deals-for-you-list__item:first-child {
  18641. margin-left: 0;
  18642. scroll-margin-left: calc(50vw - 343px)
  18643. }
  18644. }
  18645. @media(min-width:64em) {
  18646. .scroll-slider-deals-for-you-list__item:first-child {
  18647. scroll-margin-left: 0
  18648. }
  18649. }
  18650. .scroll-slider-deals-for-you-list__item:last-child {
  18651. margin-right: 20px
  18652. }
  18653. @media(min-width:48em) {
  18654. .scroll-slider-deals-for-you-list__item:last-child {
  18655. margin-right: 0;
  18656. padding-right: 10px
  18657. }
  18658. }
  18659. .scroll-slider-deals-for-you-list__button-container {
  18660. margin-top: 10px;
  18661. margin-left: 25px
  18662. }
  18663. @media(min-width:48em) {
  18664. .scroll-slider-deals-for-you-list__button-container {
  18665. margin-top: 5px;
  18666. margin-left: 0
  18667. }
  18668. }
  18669. @media(min-width:64em) {
  18670. .scroll-slider-deals-for-you-list__button-container {
  18671. margin-top: 15px
  18672. }
  18673. }
  18674. .your-pco {
  18675. width: 100%;
  18676. max-width: 1920px;
  18677. overflow: hidden
  18678. }
  18679. .your-pco,
  18680. .your-pco__lottie {
  18681. position: relative;
  18682. margin: 0 auto
  18683. }
  18684. .your-pco__lottie {
  18685. z-index: -1;
  18686. height: 160px;
  18687. width: 360px
  18688. }
  18689. .your-pco__lottie--hand {
  18690. margin-top: -10px
  18691. }
  18692. @media(min-width:48em) {
  18693. .your-pco__lottie--hand {
  18694. width: 400px
  18695. }
  18696. }
  18697. @media(prefers-reduced-motion:reduce) {
  18698. .your-pco__lottie--hand {
  18699. text-align: center
  18700. }
  18701. }
  18702. .your-pco__lottie--moonrise {
  18703. width: 1920px;
  18704. left: 50%;
  18705. transform: translateX(-50%)
  18706. }
  18707. @media(prefers-reduced-motion:reduce) {
  18708. .your-pco__lottie--moonrise {
  18709. display: flex;
  18710. align-items: flex-end;
  18711. justify-content: center;
  18712. overflow-x: hidden
  18713. }
  18714. }
  18715. .your-pco__background {
  18716. position: absolute;
  18717. top: 0;
  18718. left: 0;
  18719. z-index: -2;
  18720. width: 100%;
  18721. height: 100%;
  18722. background: snow
  18723. }
  18724. .your-pco__footer {
  18725. overflow: hidden
  18726. }
  18727. .your-pco-section {
  18728. position: relative;
  18729. margin: 28px 0 56px;
  18730. overflow-x: clip
  18731. }
  18732. @media(min-width:48em) {
  18733. .your-pco-section {
  18734. margin: 48px 0 96px
  18735. }
  18736. }
  18737. @media(min-width:64em) {
  18738. .your-pco-section {
  18739. margin: 60px 0 120px
  18740. }
  18741. }
  18742. .your-pco-section__container {
  18743. max-width: 872px;
  18744. width: 100%;
  18745. position: relative
  18746. }
  18747. .your-pco-section__background {
  18748. position: absolute;
  18749. z-index: -1;
  18750. top: 50%;
  18751. left: 50%;
  18752. transform: translate(-50%, -50%);
  18753. height: auto;
  18754. width: 100%
  18755. }
  18756. .your-pco-section__heading {
  18757. margin-bottom: 0
  18758. }
  18759. .your-pco-section__description,
  18760. .your-pco-section__heading+p {
  18761. margin: 5px 0 30px;
  18762. color: #6b6272
  18763. }
  18764. @media(min-width:48em) {
  18765. .your-pco-section__description,
  18766. .your-pco-section__heading+p {
  18767. margin: 8px 0 40px
  18768. }
  18769. }
  18770. .your-pco-section__content {
  18771. margin: 0;
  18772. padding: 0
  18773. }
  18774. .your-pco-section .partnership-tile {
  18775. max-width: 794px
  18776. }
  18777. .your-pco-header-greeting p {
  18778. margin: 40px auto 9px;
  18779. max-width: 792px;
  18780. order: 0;
  18781. flex-grow: 0;
  18782. color: #6c221a
  18783. }
  18784. @media(min-width:64em) {
  18785. .your-pco-header-greeting p {
  18786. margin-top: 64px
  18787. }
  18788. }
  18789. .your-pco-header-greeting h1 {
  18790. margin: 0 auto 0 0;
  18791. order: 1;
  18792. flex-grow: 0;
  18793. color: #ac342a;
  18794. max-width: 230px
  18795. }
  18796. @media(min-width:48em) {
  18797. .your-pco-header-greeting h1 {
  18798. margin: 0 auto;
  18799. max-width: 792px
  18800. }
  18801. }
  18802. .main-header__insiders .your-pco-header-greeting h1,
  18803. .main-header__insiders .your-pco-header-greeting p {
  18804. color: #f9dada
  18805. }
  18806. .messages {
  18807. height: var(--messages-container-height);
  18808. overflow-y: clip;
  18809. transition: all .4s;
  18810. border: 1px solid transparent
  18811. }
  18812. .messages__all-read {
  18813. color: #6b6272;
  18814. animation: fadeIn .8s 1
  18815. }
  18816. @media(min-width:64em) {
  18817. .messages__all-read {
  18818. margin-top: 0;
  18819. margin-bottom: 150px
  18820. }
  18821. }
  18822. .message {
  18823. position: relative;
  18824. top: 0;
  18825. left: 0;
  18826. width: 100%;
  18827. max-width: 792px;
  18828. display: flex;
  18829. align-items: center;
  18830. padding: 16px;
  18831. margin: 0 auto 16px;
  18832. border: 1px solid rgba(97, 83, 149, .08);
  18833. box-sizing: border-box;
  18834. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  18835. border-radius: 8px;
  18836. color: #403840;
  18837. text-decoration: none;
  18838. transition: .3s ease;
  18839. opacity: 1;
  18840. background-color: #fff;
  18841. background-size: cover
  18842. }
  18843. @media(min-width:48em) {
  18844. .message {
  18845. border-radius: 16px
  18846. }
  18847. }
  18848. .message:first-child {
  18849. margin-top: 10px
  18850. }
  18851. .message:hover {
  18852. color: #403840;
  18853. transform: scale(1.03);
  18854. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24)
  18855. }
  18856. .message__cta:focus {
  18857. color: #615395
  18858. }
  18859. .message__cta:focus .message {
  18860. transform: scale(1.03)
  18861. }
  18862. .message__image {
  18863. width: 48px;
  18864. height: 48px
  18865. }
  18866. @media(min-width:48em) {
  18867. .message__image {
  18868. width: 64px;
  18869. height: 64px
  18870. }
  18871. }
  18872. .message__copy {
  18873. margin: 0 0 8px
  18874. }
  18875. .message__content {
  18876. font-family: Inter, sans-serif;
  18877. padding-left: 24px;
  18878. flex: 0 1 calc(100% - 86px)
  18879. }
  18880. @media(min-width:48em) {
  18881. .message__content {
  18882. flex: 0 1 calc(100% - 112px)
  18883. }
  18884. }
  18885. .message__cta {
  18886. margin: 0;
  18887. color: #157a77;
  18888. text-decoration: underline;
  18889. transition: color .2s
  18890. }
  18891. .message__cta:hover {
  18892. color: #615395
  18893. }
  18894. .message__dismiss {
  18895. width: 48px;
  18896. height: 48px;
  18897. display: flex;
  18898. justify-content: center;
  18899. align-items: center;
  18900. position: absolute;
  18901. top: 8px;
  18902. right: 8px;
  18903. background: none;
  18904. border: none;
  18905. padding: 0
  18906. }
  18907. @media(min-width:48em) {
  18908. .message__dismiss {
  18909. width: 34px;
  18910. height: 34px
  18911. }
  18912. }
  18913. .message__dismiss:focus .message__dismiss-inner,
  18914. .message__dismiss:hover .message__dismiss-inner {
  18915. border-color: #615395;
  18916. background: #f4f1f6;
  18917. cursor: pointer
  18918. }
  18919. .message__dismiss:hover .sprite {
  18920. fill: #615395
  18921. }
  18922. .message__dismiss:active .message__dismiss-inner {
  18923. border-color: #403840;
  18924. background: #403840
  18925. }
  18926. .message__dismiss:active .sprite {
  18927. fill: #fff
  18928. }
  18929. .message__dismiss .sprite {
  18930. fill: #655c6c
  18931. }
  18932. .message__dismiss-inner {
  18933. background: #fff;
  18934. width: 34px;
  18935. height: 34px;
  18936. border-radius: 50%;
  18937. display: flex;
  18938. justify-content: center;
  18939. align-items: center;
  18940. transition: all .2s;
  18941. border: 2px solid transparent
  18942. }
  18943. .message__hidden {
  18944. display: none;
  18945. opacity: 0
  18946. }
  18947. .message__dismissed {
  18948. pointer-events: none;
  18949. opacity: 0;
  18950. animation: fadeOut .3s ease 0s forwards
  18951. }
  18952. .message__shift-up {
  18953. top: var(--dismissed-message-height)
  18954. }
  18955. @keyframes fadeOut {
  18956. 0% {
  18957. opacity: 1
  18958. }
  18959. to {
  18960. opacity: 0
  18961. }
  18962. }
  18963. @media(min-width:48em) {
  18964. .my-stores__stores-container {
  18965. display: flex
  18966. }
  18967. }
  18968. .my-stores__store-container {
  18969. flex: 1 1 396px
  18970. }
  18971. .my-stores__store-divider {
  18972. height: 1px;
  18973. background: #9e93a6;
  18974. margin: 10px 0
  18975. }
  18976. .my-stores__store-toggle {
  18977. cursor: pointer;
  18978. position: relative;
  18979. background: none;
  18980. border: none;
  18981. display: block;
  18982. width: 100%;
  18983. text-align: left;
  18984. padding: 15px 0 12px;
  18985. margin: 0
  18986. }
  18987. .my-stores__store-name,
  18988. .my-stores__store-name--toggle {
  18989. margin: 0
  18990. }
  18991. .my-stores__chevron {
  18992. display: inline-block;
  18993. border-color: #157a77;
  18994. border-style: solid;
  18995. border-width: 2px 2px 0 0;
  18996. content: "";
  18997. width: 12px;
  18998. height: 12px;
  18999. position: relative;
  19000. top: 0;
  19001. right: 0;
  19002. transform: rotate(135deg);
  19003. vertical-align: top
  19004. }
  19005. .my-stores__chevron--expanded {
  19006. transform: rotate(-45deg);
  19007. top: -5px
  19008. }
  19009. .my-stores__chevron-container {
  19010. position: absolute;
  19011. top: 21px;
  19012. right: 3px
  19013. }
  19014. .my-stores__store-address {
  19015. color: #157a77;
  19016. margin: 0 0 3px
  19017. }
  19018. @media(min-width:48em) {
  19019. .my-stores__store-address {
  19020. margin: 14px 0 3px
  19021. }
  19022. }
  19023. .my-stores__store-description,
  19024. .my-stores__store-hours {
  19025. color: #6b6272
  19026. }
  19027. .my-stores__store-hours {
  19028. margin: 0
  19029. }
  19030. .my-stores__store-description {
  19031. margin: 16px 0 20px
  19032. }
  19033. @media(min-width:48em) {
  19034. .my-stores__store-description {
  19035. margin: 16px 0 30px
  19036. }
  19037. }
  19038. .my-stores__shop-button {
  19039. font-size: .8125rem;
  19040. font-weight: 600;
  19041. background: transparent;
  19042. border: 1px solid #157a77;
  19043. border-radius: 24px;
  19044. color: #157a77;
  19045. cursor: pointer;
  19046. transition: all .1s;
  19047. padding: 12px 25px 10px;
  19048. margin: 0 0 15px;
  19049. min-width: -moz-fit-content;
  19050. min-width: fit-content
  19051. }
  19052. .my-stores__shop-button:focus,
  19053. .my-stores__shop-button:hover {
  19054. border-color: #615395;
  19055. color: #615395;
  19056. background: #f4f1f6
  19057. }
  19058. .my-stores__shop-button:active {
  19059. color: snow;
  19060. border-color: #403840;
  19061. background: #403840
  19062. }
  19063. @media(min-width:48em) {
  19064. .your-pco-offers-preview {
  19065. margin-bottom: 135px
  19066. }
  19067. }
  19068. @media(min-width:64em) {
  19069. .your-pco-offers-preview {
  19070. margin-bottom: 170px
  19071. }
  19072. }
  19073. .offer-preview-card {
  19074. display: flex;
  19075. flex-direction: column;
  19076. justify-content: flex-start;
  19077. width: 290px;
  19078. height: 152px;
  19079. background-size: cover;
  19080. border: none;
  19081. border-radius: 8px;
  19082. padding: 16px;
  19083. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  19084. cursor: pointer;
  19085. text-decoration: none;
  19086. text-align: left;
  19087. align-items: flex-start;
  19088. transform: scale(1);
  19089. transition: all .2s
  19090. }
  19091. @media(min-width:48em) {
  19092. .offer-preview-card {
  19093. width: 384px;
  19094. height: 196px;
  19095. border-radius: 16px;
  19096. padding: 24px 32px 32px
  19097. }
  19098. }
  19099. .offer-preview-card:focus,
  19100. .offer-preview-card:hover {
  19101. transform: scale(1.05);
  19102. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24)
  19103. }
  19104. .offer-preview-card__logo {
  19105. height: 24px
  19106. }
  19107. .offer-preview-card__title {
  19108. margin: 15px 0
  19109. }
  19110. @media(min-width:48em) {
  19111. .offer-preview-card__title {
  19112. margin: 24px 0 16px
  19113. }
  19114. }
  19115. .offer-preview-card__description {
  19116. margin: 0
  19117. }
  19118. .offer-preview-card__cta {
  19119. display: inline-block;
  19120. padding: 11px 35px;
  19121. background: #157a77;
  19122. border-radius: 30px;
  19123. color: #fff;
  19124. font-weight: 600;
  19125. transition: all .2s
  19126. }
  19127. .offer-preview-card--pco:focus .offer-preview-card__cta,
  19128. .offer-preview-card--pco:hover .offer-preview-card__cta {
  19129. background: #615395;
  19130. border-color: #615395
  19131. }
  19132. .offer-preview-card--pco .offer-preview-card__title {
  19133. color: #ac342a
  19134. }
  19135. .offer-preview-card--pco .offer-preview-card__description {
  19136. color: #6c221a
  19137. }
  19138. .offer-preview-card--pcoi:focus .offer-preview-card__cta,
  19139. .offer-preview-card--pcoi:hover .offer-preview-card__cta {
  19140. color: #fff;
  19141. background: #403840
  19142. }
  19143. .offer-preview-card--pcoi .offer-preview-card__title {
  19144. color: #f9dada
  19145. }
  19146. .offer-preview-card--pcoi .offer-preview-card__description {
  19147. color: #fff
  19148. }
  19149. .offer-preview-card--dark:focus .offer-preview-card__cta,
  19150. .offer-preview-card--dark:hover .offer-preview-card__cta,
  19151. .offer-preview-card--pcoi .offer-preview-card__cta {
  19152. color: #403840;
  19153. background: #fff
  19154. }
  19155. .offer-preview-card--dark .offer-preview-card__description,
  19156. .offer-preview-card--dark .offer-preview-card__title {
  19157. color: #403840
  19158. }
  19159. .offer-preview-card--dark .offer-preview-card__cta,
  19160. .offer-preview-card--light:focus .offer-preview-card__cta,
  19161. .offer-preview-card--light:hover .offer-preview-card__cta {
  19162. background: #403840;
  19163. color: #fff
  19164. }
  19165. .offer-preview-card--light .offer-preview-card__description,
  19166. .offer-preview-card--light .offer-preview-card__title {
  19167. color: #fff
  19168. }
  19169. .offer-preview-card--light .offer-preview-card__cta {
  19170. color: #403840;
  19171. background: #fff
  19172. }
  19173. .scroll-slider-dashboard-inspo-list--scroll,
  19174. .scroll-slider-dashboard-list--scroll {
  19175. scroll-snap-type: x mandatory;
  19176. padding: 10px 6px 24px;
  19177. scrollbar-width: none
  19178. }
  19179. @media(min-width:48em) {
  19180. .scroll-slider-dashboard-inspo-list--scroll,
  19181. .scroll-slider-dashboard-list--scroll {
  19182. padding: 10px 20px 24px
  19183. }
  19184. }
  19185. .scroll-slider-dashboard-inspo-list--scroll::-webkit-scrollbar,
  19186. .scroll-slider-dashboard-list--scroll::-webkit-scrollbar {
  19187. display: none
  19188. }
  19189. .scroll-slider-dashboard-inspo-list__item,
  19190. .scroll-slider-dashboard-list__item {
  19191. scroll-snap-align: start;
  19192. margin-right: 16px;
  19193. border-radius: 8px;
  19194. scroll-margin-left: 20px
  19195. }
  19196. @media(min-width:48em) {
  19197. .scroll-slider-dashboard-inspo-list__item,
  19198. .scroll-slider-dashboard-list__item {
  19199. scroll-margin-left: 40px
  19200. }
  19201. }
  19202. .scroll-slider-dashboard-inspo-list__item:first-child,
  19203. .scroll-slider-dashboard-list__item:first-child {
  19204. scroll-snap-align: center;
  19205. margin-left: 15px
  19206. }
  19207. @media(min-width:48em) {
  19208. .scroll-slider-dashboard-inspo-list__item:first-child,
  19209. .scroll-slider-dashboard-list__item:first-child {
  19210. margin-left: 20px
  19211. }
  19212. }
  19213. @media(min-width:872px) {
  19214. .scroll-slider-dashboard-inspo-list__item:first-child,
  19215. .scroll-slider-dashboard-list__item:first-child {
  19216. margin-left: calc(50vw - 421px)
  19217. }
  19218. }
  19219. @media(min-width:1920px) {
  19220. .scroll-slider-dashboard-inspo-list__item:first-child,
  19221. .scroll-slider-dashboard-list__item:first-child {
  19222. margin-left: 539px
  19223. }
  19224. }
  19225. .scroll-slider-dashboard-list__button-container {
  19226. margin-top: 0;
  19227. margin-left: 20px
  19228. }
  19229. @media(min-width:48em) {
  19230. .scroll-slider-dashboard-list__button-container {
  19231. margin-left: 40px
  19232. }
  19233. }
  19234. @media(min-width:872px) {
  19235. .scroll-slider-dashboard-list__button-container {
  19236. margin-left: calc(50vw - 404px)
  19237. }
  19238. }
  19239. .scroll-slider-dashboard-inspo-list__button-container {
  19240. display: none
  19241. }
  19242. .your-pco-error__wrapper {
  19243. max-width: 792px;
  19244. margin: 0 auto
  19245. }
  19246. .your-pco-error__full,
  19247. .your-pco-error__tile {
  19248. display: flex;
  19249. justify-content: flex-end;
  19250. align-items: center;
  19251. border-radius: 8px;
  19252. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  19253. background-size: cover;
  19254. background-position: 0;
  19255. background-repeat: no-repeat
  19256. }
  19257. .your-pco-error__full {
  19258. height: -moz-fit-content;
  19259. height: fit-content;
  19260. min-height: 186px;
  19261. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/your-pco/empty_state_full_mobile.png);
  19262. margin-top: 18px;
  19263. margin-bottom: 28px
  19264. }
  19265. .your-pco-error__full-content {
  19266. width: 63%
  19267. }
  19268. .your-pco-error__full-content-subtitle,
  19269. .your-pco-error__full-content-title {
  19270. margin-right: 24px
  19271. }
  19272. .your-pco-error__full-content-title {
  19273. margin-top: 24px;
  19274. margin-bottom: 16px
  19275. }
  19276. .your-pco-error__full-content-subtitle {
  19277. margin-bottom: 24px
  19278. }
  19279. @media(min-width:34.375em) {
  19280. .your-pco-error__full {
  19281. margin-top: 38px;
  19282. margin-bottom: 48px;
  19283. border-radius: 16px;
  19284. min-height: 240px;
  19285. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/your-pco/empty_state_full_tablet.png)
  19286. }
  19287. .your-pco-error__full-content {
  19288. width: 68%
  19289. }
  19290. .your-pco-error__full-content-subtitle,
  19291. .your-pco-error__full-content-title {
  19292. margin-right: 34px
  19293. }
  19294. .your-pco-error__full-content-title {
  19295. margin-top: 40px;
  19296. margin-bottom: 24px
  19297. }
  19298. .your-pco-error__full-content-subtitle {
  19299. margin-bottom: 40px
  19300. }
  19301. }
  19302. @media(min-width:64em) {
  19303. .your-pco-error__full {
  19304. margin-top: 66px;
  19305. margin-bottom: 66px;
  19306. min-height: 248px;
  19307. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/your-pco/empty_state_full_desktop.png)
  19308. }
  19309. .your-pco-error__full-content {
  19310. width: 75%
  19311. }
  19312. .your-pco-error__full-content-subtitle,
  19313. .your-pco-error__full-content-title {
  19314. margin-right: 103px
  19315. }
  19316. }
  19317. .your-pco-error__full .your-pco-error-block {
  19318. margin-top: 16px;
  19319. display: block
  19320. }
  19321. @media(min-width:34.375em) {
  19322. .your-pco-error__full .your-pco-error-block {
  19323. margin-top: 32px
  19324. }
  19325. }
  19326. .your-pco-error__tile {
  19327. height: 148px;
  19328. max-width: 328px;
  19329. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/your-pco/your-pco-error-white_mobile.png)
  19330. }
  19331. .your-pco-error__tile-content {
  19332. width: 66%
  19333. }
  19334. .your-pco-error__tile-content-subtitle,
  19335. .your-pco-error__tile-content-title {
  19336. margin-right: 13px
  19337. }
  19338. @media(min-width:48em) {
  19339. .your-pco-error__tile {
  19340. height: 196px;
  19341. max-width: 384px;
  19342. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/your-pco/your-pco-error-white.png)
  19343. }
  19344. .your-pco-error__tile-content {
  19345. width: 63%
  19346. }
  19347. .your-pco-error__tile-content-subtitle,
  19348. .your-pco-error__tile-content-title {
  19349. margin-right: 24px
  19350. }
  19351. }
  19352. .pco-dashboard-header__offer-indicator {
  19353. justify-content: center;
  19354. display: flex;
  19355. margin-top: 24px;
  19356. margin-bottom: -55px
  19357. }
  19358. .pco-dashboard-header__offer-indicator span {
  19359. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  19360. font-size: .8125rem;
  19361. line-height: 1.125rem;
  19362. font-weight: 400;
  19363. margin-bottom: -10px
  19364. }
  19365. @media(min-width:48em) {
  19366. .pco-dashboard-header__offer-indicator span {
  19367. font-size: .875rem;
  19368. line-height: 1.25rem
  19369. }
  19370. }
  19371. @media(max-width:47.99em) {
  19372. .pco-dashboard-header__offer-indicator span {
  19373. margin-bottom: -3px
  19374. }
  19375. }
  19376. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator-loaded,
  19377. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator-loading .header-offer-loading-indicator-error {
  19378. height: 35px;
  19379. transform: translateY(-60px);
  19380. transition: transform .8s ease-out 6s;
  19381. animation: backgroundFadeToWhite 1.5s ease-out
  19382. }
  19383. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator-loading {
  19384. display: inherit;
  19385. height: 35px
  19386. }
  19387. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator-loaded {
  19388. background: #fff;
  19389. color: #f9dada
  19390. }
  19391. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator {
  19392. border-radius: 100px
  19393. }
  19394. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator.header-offer-loading-indicator-error {
  19395. background: #fff;
  19396. height: 35px
  19397. }
  19398. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator--insider.header-offer-loading-indicator-error {
  19399. background-color: inherit
  19400. }
  19401. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator--insider.header-offer-loading-indicator-error span {
  19402. color: #f9dada
  19403. }
  19404. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator--insider.header-offer-loading-indicator-loaded span {
  19405. color: #403840;
  19406. animation: pcoiFontFade 1.5s ease-out
  19407. }
  19408. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator--insider.header-offer-loading-indicator-loaded .lottieAnimation svg path {
  19409. stroke: #403840;
  19410. animation: pcoiFontFade 1.5s ease-out
  19411. }
  19412. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator--insider .lottieAnimation svg path,
  19413. .pco-dashboard-header__offer-indicator .header-offer-loading-indicator--insider span {
  19414. animation: pcoiFontFadeLoading 1.5s ease-out
  19415. }
  19416. @keyframes pcoiFontFadeLoading {
  19417. to {
  19418. color: #fff;
  19419. stroke: #fff
  19420. }
  19421. }
  19422. @keyframes pcoiFontFade {
  19423. 0% {
  19424. color: transparent;
  19425. stroke: transparent
  19426. }
  19427. to {
  19428. color: #403840;
  19429. stroke: #403840
  19430. }
  19431. }
  19432. @keyframes backgroundFadeToWhite {
  19433. 0% {
  19434. background-color: hsla(0, 0%, 100%, 0)
  19435. }
  19436. to {
  19437. background-color: #fff
  19438. }
  19439. }
  19440. .points-overview {
  19441. margin: 32px auto 10px;
  19442. max-width: 792px
  19443. }
  19444. @media(min-width:48em) {
  19445. .points-overview {
  19446. margin-top: 48px
  19447. }
  19448. }
  19449. .points-overview__inner {
  19450. background: #fff;
  19451. border-radius: 8px;
  19452. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  19453. color: #ac342a;
  19454. padding: 16px
  19455. }
  19456. @media(min-width:48em) {
  19457. .points-overview__inner {
  19458. display: flex;
  19459. align-items: center;
  19460. padding: 24px 32px;
  19461. border-radius: 16px
  19462. }
  19463. }
  19464. .points-overview__container {
  19465. white-space: nowrap;
  19466. display: grid;
  19467. grid-template-areas: "balance" "redeemable"
  19468. }
  19469. @media(min-width:48em) {
  19470. .points-overview__container {
  19471. padding-right: 32px
  19472. }
  19473. }
  19474. @media(max-width:47.99em) {
  19475. .points-overview__container {
  19476. padding-bottom: 8px
  19477. }
  19478. }
  19479. .points-overview-balance {
  19480. display: flex;
  19481. align-items: center;
  19482. gap: 4px
  19483. }
  19484. .points-overview-balance__points,
  19485. .points-overview-balance__text {
  19486. margin: 0
  19487. }
  19488. .points-redeemable {
  19489. display: flex;
  19490. align-items: center;
  19491. gap: 4px
  19492. }
  19493. .points-redeemable__text {
  19494. margin: 0;
  19495. color: #655c6c
  19496. }
  19497. .points-overview-question-mark svg {
  19498. width: 16px;
  19499. height: 16px
  19500. }
  19501. .points-overview-error {
  19502. display: flex;
  19503. flex-direction: column
  19504. }
  19505. @media(min-width:48em) {
  19506. .points-overview-error {
  19507. flex-direction: row
  19508. }
  19509. }
  19510. .points-overview-error__message {
  19511. align-self: center
  19512. }
  19513. @media(min-width:48em) {
  19514. .points-overview-error__message {
  19515. margin-right: 32px
  19516. }
  19517. }
  19518. .points-message-tile {
  19519. display: flex;
  19520. background-color: #fdf0f0;
  19521. padding: 16px;
  19522. border-radius: 4px;
  19523. flex-grow: 1
  19524. }
  19525. .points-message-tile__content {
  19526. display: flex;
  19527. flex-direction: column;
  19528. margin-right: 8px;
  19529. width: 100%
  19530. }
  19531. .points-message-tile__content p {
  19532. margin: 0
  19533. }
  19534. .points-message-tile__content .link {
  19535. margin-top: 8px
  19536. }
  19537. @media(min-width:48em) {
  19538. .points-message-tile__content {
  19539. margin-right: 24px
  19540. }
  19541. }
  19542. .points-message-tile__content--bold {
  19543. font-weight: 700
  19544. }
  19545. .points-message-tile__image-container {
  19546. align-self: center;
  19547. height: 60px
  19548. }
  19549. .points-message-tile__image-container img {
  19550. width: 60px
  19551. }
  19552. .commerce-tile-list {
  19553. display: grid;
  19554. grid-gap: 8px;
  19555. grid-template-columns: repeat(3, 1fr);
  19556. padding: 0
  19557. }
  19558. @media(min-width:48em) {
  19559. .commerce-tile-list {
  19560. grid-template-columns: repeat(5, 1fr)
  19561. }
  19562. }
  19563. .commerce-tile-list li {
  19564. display: flex;
  19565. justify-content: center;
  19566. align-items: center
  19567. }
  19568. .commerce-tile {
  19569. display: flex;
  19570. flex-direction: column;
  19571. align-items: center;
  19572. justify-content: space-between;
  19573. text-decoration: none;
  19574. color: #655c6c;
  19575. transition: .2s ease;
  19576. position: relative
  19577. }
  19578. .commerce-tile:focus,
  19579. .commerce-tile:hover {
  19580. transform: scale(1.05)
  19581. }
  19582. .commerce-tile-cta-content {
  19583. padding: 8px 0;
  19584. display: flex;
  19585. justify-content: center
  19586. }
  19587. .commerce-tile-cta-content__img-container {
  19588. width: 64px;
  19589. height: 64px;
  19590. border-radius: 100%;
  19591. background: #fff;
  19592. box-sizing: border-box;
  19593. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  19594. overflow: hidden
  19595. }
  19596. @media(min-width:48em) {
  19597. .commerce-tile-cta-content__img-container {
  19598. width: 80px;
  19599. height: 80px
  19600. }
  19601. }
  19602. .commerce-tile-cta-content__img {
  19603. width: 100%;
  19604. height: 100%
  19605. }
  19606. .commerce-tile-cta-content__cta {
  19607. color: #403840;
  19608. margin: 8px auto 0;
  19609. max-width: 104px;
  19610. text-align: center;
  19611. align-items: center;
  19612. padding: 0;
  19613. height: 32px
  19614. }
  19615. @media(min-width:48em) {
  19616. .commerce-tile-cta-content__cta {
  19617. height: 44px
  19618. }
  19619. }
  19620. .commerce-tile-cta-content__tag {
  19621. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  19622. font-size: .5rem;
  19623. font-weight: 600;
  19624. color: #fff;
  19625. background: #ac342a;
  19626. padding: 4px 6px;
  19627. border-radius: 100px;
  19628. position: absolute;
  19629. top: -1px;
  19630. display: inline-block;
  19631. text-align: center
  19632. }
  19633. @media(min-width:48em) {
  19634. .commerce-tile-cta-content__tag {
  19635. font-size: .6rem;
  19636. padding: 4px 7px;
  19637. top: -2px
  19638. }
  19639. }
  19640. .commerce-tile-modal-content {
  19641. max-width: 400px;
  19642. position: relative;
  19643. border-radius: 16px;
  19644. background-color: #fff;
  19645. margin: 0 20px;
  19646. overflow: hidden
  19647. }
  19648. @media(max-height:672px) {
  19649. .commerce-tile-modal-content {
  19650. height: 85%
  19651. }
  19652. }
  19653. .commerce-tile-modal-content__inner {
  19654. padding: 20px 24px 40px;
  19655. height: 62%
  19656. }
  19657. @media(max-height:672px) {
  19658. .commerce-tile-modal-content__inner {
  19659. padding: 0
  19660. }
  19661. }
  19662. @media(max-height:672px) {
  19663. .commerce-tile-modal-content__inner-text {
  19664. padding: 0 24px;
  19665. height: 65%;
  19666. overflow-x: scroll
  19667. }
  19668. }
  19669. .commerce-tile-modal-content__inner-buttons {
  19670. text-align: center
  19671. }
  19672. @media(max-height:672px) {
  19673. .commerce-tile-modal-content__inner-buttons {
  19674. position: absolute;
  19675. bottom: 0;
  19676. padding: 16px 24px;
  19677. background-color: #fff;
  19678. border-top: 1px solid #9e93a6;
  19679. left: 0;
  19680. right: 0
  19681. }
  19682. }
  19683. .commerce-tile-modal-content img {
  19684. min-height: 38%;
  19685. width: 100%
  19686. }
  19687. .commerce-tile-modal-content p {
  19688. margin-bottom: 30px
  19689. }
  19690. .commerce-tile-modal-content__cta-button {
  19691. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  19692. font-size: 1rem;
  19693. line-height: 1.375rem;
  19694. display: inline-block;
  19695. width: 100%;
  19696. background: #157a77;
  19697. border-radius: 24px;
  19698. padding: 12px 0;
  19699. margin: 0 0 24px;
  19700. color: #fff;
  19701. text-align: center;
  19702. text-decoration: none;
  19703. cursor: pointer;
  19704. transition: all .2s;
  19705. font-weight: 600
  19706. }
  19707. .commerce-tile-modal-content__cta-button:focus,
  19708. .commerce-tile-modal-content__cta-button:hover {
  19709. color: #fff;
  19710. background: #615395
  19711. }
  19712. .commerce-tile-modal-content__cta-button:active {
  19713. background: #403840
  19714. }
  19715. .commerce-tile-modal-content__cta-button--secondary {
  19716. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  19717. font-size: 1rem;
  19718. line-height: 1.375rem;
  19719. text-decoration: underline;
  19720. color: #157a77;
  19721. transition: all .2s;
  19722. font-weight: 600
  19723. }
  19724. .commerce-tile-modal-content__cta-button--secondary:focus,
  19725. .commerce-tile-modal-content__cta-button--secondary:hover {
  19726. color: #615395
  19727. }
  19728. .commerce-tile-modal-content__cta-button--secondary:active {
  19729. color: #403840
  19730. }
  19731. .contentful-item-partnership-perks-container__footnote {
  19732. color: #655c6c;
  19733. margin: 0
  19734. }
  19735. @media(min-width:64em) {
  19736. .contentful-item-partnership-perks-container__footnote {
  19737. margin: 16px 0 0
  19738. }
  19739. }
  19740. .contentful-item-partnership-perks-container__ad-view-wrapper {
  19741. display: flex
  19742. }
  19743. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks {
  19744. margin: 0 auto
  19745. }
  19746. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks .slider-holder-div {
  19747. width: 100vw
  19748. }
  19749. @media(min-width:48em) {
  19750. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks .slider-holder-div {
  19751. width: 100%
  19752. }
  19753. }
  19754. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item {
  19755. margin-right: 16px;
  19756. scroll-snap-align: start;
  19757. scroll-margin-left: 16px
  19758. }
  19759. @media(min-width:48em) {
  19760. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item {
  19761. scroll-margin-left: 32px
  19762. }
  19763. }
  19764. @media(min-width:64em) {
  19765. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item {
  19766. scroll-snap-align: center;
  19767. scroll-margin-left: 0
  19768. }
  19769. }
  19770. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item:first-child {
  19771. margin-left: 21px;
  19772. scroll-margin-left: 21px
  19773. }
  19774. @media(min-width:48em) {
  19775. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item:first-child {
  19776. margin-left: 0;
  19777. scroll-margin-left: calc(50vw - 343px)
  19778. }
  19779. }
  19780. @media(min-width:64em) {
  19781. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item:first-child {
  19782. margin-left: 6px;
  19783. scroll-margin-left: 0
  19784. }
  19785. }
  19786. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item:last-child {
  19787. margin-right: 10px;
  19788. padding-right: 10px
  19789. }
  19790. @media(min-width:48em) {
  19791. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item:last-child {
  19792. margin-right: calc(50vw - 372.5px);
  19793. padding-right: 0
  19794. }
  19795. }
  19796. @media(min-width:64em) {
  19797. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item:last-child {
  19798. margin-right: 6px
  19799. }
  19800. }
  19801. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item-tile {
  19802. display: flex;
  19803. height: 100%
  19804. }
  19805. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__item-tile fieldset {
  19806. display: flex;
  19807. margin: 0
  19808. }
  19809. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll {
  19810. scroll-snap-type: x mandatory;
  19811. padding: 0 0 16px;
  19812. scrollbar-width: none
  19813. }
  19814. @media(min-width:48em) {
  19815. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll {
  19816. margin: 0 calc(-50vw + 343px);
  19817. padding: 0 30px 16px calc(50vw - 343px)
  19818. }
  19819. }
  19820. @media(min-width:64em) {
  19821. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll {
  19822. scrollbar-width: auto;
  19823. margin: 0;
  19824. padding: 0 0 16px
  19825. }
  19826. }
  19827. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll::-webkit-scrollbar {
  19828. display: none;
  19829. height: 8px;
  19830. width: 100%
  19831. }
  19832. @media(min-width:64em) {
  19833. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll::-webkit-scrollbar {
  19834. display: block
  19835. }
  19836. }
  19837. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll::-webkit-scrollbar-thumb {
  19838. border-radius: 10px;
  19839. background: #c2c2c2
  19840. }
  19841. @media(min-width:48em) {
  19842. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll::-webkit-scrollbar-track {
  19843. border-radius: 10px;
  19844. background: #f3f3f3;
  19845. margin: 0 calc(50vw - 343px)
  19846. }
  19847. }
  19848. @media(min-width:64em) {
  19849. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list--scroll::-webkit-scrollbar-track {
  19850. margin: 0
  19851. }
  19852. }
  19853. .contentful-item-partnership-perks-container .scroll-slider-contentful-item-partnership-perks-list__button-container {
  19854. display: none
  19855. }
  19856. .contentful-item-partnership-perks-container__modal-content {
  19857. max-width: 320px;
  19858. position: relative;
  19859. border-radius: 16px;
  19860. background-color: #fff;
  19861. margin: 0 20px;
  19862. overflow: hidden
  19863. }
  19864. @media(min-width:48em) {
  19865. .contentful-item-partnership-perks-container__modal-content {
  19866. max-width: 508px
  19867. }
  19868. }
  19869. .contentful-item-partnership-perks-container__modal-content .pco-modal-content__close {
  19870. top: 10px
  19871. }
  19872. .contentful-item-partnership-redemption-perk-container__footnote {
  19873. color: #655c6c;
  19874. margin: 0
  19875. }
  19876. @media(min-width:64em) {
  19877. .contentful-item-partnership-redemption-perk-container__footnote {
  19878. margin: 16px 0 0
  19879. }
  19880. }
  19881. .contentful-item-partnership-redemption-perk-container__ad-view-wrapper {
  19882. display: flex
  19883. }
  19884. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk {
  19885. margin: 0 auto
  19886. }
  19887. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk .slider-holder-div {
  19888. width: 100vw
  19889. }
  19890. @media(min-width:48em) {
  19891. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk .slider-holder-div {
  19892. width: 100%
  19893. }
  19894. }
  19895. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item {
  19896. margin-right: 16px;
  19897. scroll-snap-align: start;
  19898. scroll-margin-left: 16px
  19899. }
  19900. @media(min-width:48em) {
  19901. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item {
  19902. scroll-margin-left: 32px
  19903. }
  19904. }
  19905. @media(min-width:64em) {
  19906. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item {
  19907. scroll-snap-align: center;
  19908. scroll-margin-left: 0
  19909. }
  19910. }
  19911. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item:first-child {
  19912. margin-left: 21px;
  19913. scroll-margin-left: 21px
  19914. }
  19915. @media(min-width:48em) {
  19916. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item:first-child {
  19917. margin-left: 0;
  19918. scroll-margin-left: calc(50vw - 343px)
  19919. }
  19920. }
  19921. @media(min-width:64em) {
  19922. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item:first-child {
  19923. margin-left: 6px;
  19924. scroll-margin-left: 0
  19925. }
  19926. }
  19927. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item:last-child {
  19928. margin-right: 10px;
  19929. padding-right: 10px
  19930. }
  19931. @media(min-width:48em) {
  19932. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item:last-child {
  19933. margin-right: calc(50vw - 372.5px);
  19934. padding-right: 0
  19935. }
  19936. }
  19937. @media(min-width:64em) {
  19938. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item:last-child {
  19939. margin-right: 6px
  19940. }
  19941. }
  19942. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item-tile {
  19943. display: flex;
  19944. height: 100%
  19945. }
  19946. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__item-tile fieldset {
  19947. display: flex;
  19948. margin: 0
  19949. }
  19950. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll {
  19951. scroll-snap-type: x mandatory;
  19952. padding: 0 0 16px;
  19953. scrollbar-width: none
  19954. }
  19955. @media(min-width:48em) {
  19956. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll {
  19957. margin: 0 calc(-50vw + 343px);
  19958. padding: 0 30px 16px calc(50vw - 343px)
  19959. }
  19960. }
  19961. @media(min-width:64em) {
  19962. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll {
  19963. scrollbar-width: auto;
  19964. margin: 0;
  19965. padding: 0 0 16px
  19966. }
  19967. }
  19968. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll::-webkit-scrollbar {
  19969. display: none;
  19970. height: 8px;
  19971. width: 100%
  19972. }
  19973. @media(min-width:64em) {
  19974. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll::-webkit-scrollbar {
  19975. display: block
  19976. }
  19977. }
  19978. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll::-webkit-scrollbar-thumb {
  19979. border-radius: 10px;
  19980. background: #c2c2c2
  19981. }
  19982. @media(min-width:48em) {
  19983. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll::-webkit-scrollbar-track {
  19984. border-radius: 10px;
  19985. background: #f3f3f3;
  19986. margin: 0 calc(50vw - 343px)
  19987. }
  19988. }
  19989. @media(min-width:64em) {
  19990. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list--scroll::-webkit-scrollbar-track {
  19991. margin: 0
  19992. }
  19993. }
  19994. .contentful-item-partnership-redemption-perk-container .scroll-slider-contentful-item-partnership-redemption-perk-list__button-container {
  19995. display: none
  19996. }
  19997. .contentful-item-partnership-redemption-perk-container__modal-content {
  19998. max-width: 320px;
  19999. position: relative;
  20000. border-radius: 16px;
  20001. background-color: #fff;
  20002. margin: 0 20px;
  20003. overflow: hidden
  20004. }
  20005. @media(min-width:48em) {
  20006. .contentful-item-partnership-redemption-perk-container__modal-content {
  20007. max-width: 508px
  20008. }
  20009. }
  20010. .contentful-item-partnership-redemption-perk-container__modal-content .pco-modal-content__close {
  20011. top: 10px
  20012. }
  20013. .scroll-slider-lifestyle-canvas-list {
  20014. padding-left: 0;
  20015. display: grid;
  20016. grid-template-columns: repeat(9, minmax(auto, 1fr));
  20017. grid-gap: 16px
  20018. }
  20019. .scroll-slider-lifestyle-canvas-list__item {
  20020. height: 100%
  20021. }
  20022. .scroll-slider-lifestyle-canvas-list__item:last-child {
  20023. margin: 0
  20024. }
  20025. .scroll-slider-lifestyle-canvas-list__item-tile {
  20026. height: 100%
  20027. }
  20028. .scroll-slider-lifestyle-canvas-list__item-tile .block-tile,
  20029. .scroll-slider-lifestyle-canvas-list__item-tile .grid-view__container {
  20030. height: calc(100% - 32px);
  20031. min-height: 321px
  20032. }
  20033. .scroll-slider-lifestyle-canvas-list--scroll {
  20034. scroll-snap-type: x mandatory;
  20035. padding-bottom: 16px
  20036. }
  20037. .scroll-slider-lifestyle-canvas-list--scroll::-webkit-scrollbar {
  20038. display: block;
  20039. height: 10px;
  20040. width: 100%
  20041. }
  20042. .scroll-slider-lifestyle-canvas-list--scroll::-webkit-scrollbar-thumb {
  20043. border-radius: 10px;
  20044. background: #c2c2c2
  20045. }
  20046. .scroll-slider-lifestyle-canvas-list--scroll::-webkit-scrollbar-track {
  20047. border-radius: 10px;
  20048. background: #f1f1f1;
  20049. margin: 0
  20050. }
  20051. .scroll-slider-lifestyle-canvas-list__button-container {
  20052. display: none
  20053. }
  20054. .points-days {
  20055. display: flex;
  20056. flex-direction: column;
  20057. justify-content: center;
  20058. align-items: center
  20059. }
  20060. .points-days-cta-section__content .cta-section__link,
  20061. .points-days__cta {
  20062. display: inline-block;
  20063. color: #fff;
  20064. background-color: #007a7c;
  20065. border-radius: 32px;
  20066. border: none
  20067. }
  20068. .points-days-offers-section__container {
  20069. background-color: #da291c;
  20070. background-repeat: no-repeat;
  20071. background-size: contain;
  20072. background-position: 50%;
  20073. border-radius: 24px
  20074. }
  20075. .points-days-offers-section__screen-cards .screen-cards__subtitle,
  20076. .points-days-offers-section__screen-cards .screen-cards__title {
  20077. color: #fff
  20078. }
  20079. .points-days-offers-section__screen-cards .screen-cards__list {
  20080. display: grid;
  20081. margin: 32px auto 0;
  20082. grid-auto-rows: 1fr;
  20083. grid-row-gap: 24px;
  20084. grid-column-gap: 24px
  20085. }
  20086. @media(min-width:48em) {
  20087. .points-days-offers-section__screen-cards .screen-cards__list {
  20088. margin: 20px auto 0;
  20089. grid-template-columns: repeat(2, 1fr);
  20090. max-width: 724px
  20091. }
  20092. }
  20093. @media(min-width:80em) {
  20094. .points-days-offers-section__screen-cards .screen-cards__list {
  20095. margin: 28px auto 0;
  20096. grid-template-columns: repeat(3, 1fr);
  20097. max-width: 1086px
  20098. }
  20099. }
  20100. .points-days-offers-section .pc-card__title {
  20101. color: #ac342a
  20102. }
  20103. .points-days-offers-section--insiders .points-days-offers-section__container {
  20104. background-color: #2d2e39
  20105. }
  20106. .points-days-offers-section--insiders .points-days-offers-section__screen-cards .screen-cards__subtitle,
  20107. .points-days-offers-section--insiders .points-days-offers-section__screen-cards .screen-cards__title {
  20108. color: #fff
  20109. }
  20110. .points-days-offers-section--insiders .pc-card__title {
  20111. color: #2d2e39
  20112. }
  20113. .pc-card-sm {
  20114. min-height: 0;
  20115. height: 100%;
  20116. margin: 12px auto
  20117. }
  20118. .points-days-cta-section__background {
  20119. background-repeat: no-repeat;
  20120. background-size: cover;
  20121. background-position: 50%;
  20122. border-radius: 24px;
  20123. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14)
  20124. }
  20125. .points-days-cta-section__content .cta-section__link {
  20126. width: 100%
  20127. }
  20128. @media(min-width:34.375em) {
  20129. .points-days-cta-section__content .cta-section__link {
  20130. width: 243px
  20131. }
  20132. }
  20133. .points-days-cta-section__content .cta-section__header,
  20134. .points-days-cta-section__content .cta-section__tile--header {
  20135. color: #ac342a
  20136. }
  20137. .points-days-banners-section__background {
  20138. background-repeat: no-repeat;
  20139. background-size: contain;
  20140. background-position: bottom;
  20141. border-radius: 24px;
  20142. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  20143. padding-bottom: 24px
  20144. }
  20145. @media(min-width:48em) {
  20146. .points-days-banners-section__background {
  20147. padding-bottom: 32px
  20148. }
  20149. }
  20150. @media(min-width:64em) {
  20151. .points-days-banners-section__background {
  20152. padding-bottom: 48px
  20153. }
  20154. }
  20155. .points-days-banners-section__logos .logo-section__body-text {
  20156. margin: 0
  20157. }
  20158. .points-days-ts-and-cs__accordion {
  20159. border-top: 1px solid #9e93a6;
  20160. padding: 24px 0
  20161. }
  20162. @media(min-width:48em) {
  20163. .points-days-ts-and-cs__accordion {
  20164. padding: 32px 0
  20165. }
  20166. }
  20167. @media(min-width:64em) {
  20168. .points-days-ts-and-cs__accordion {
  20169. padding: 48px 0
  20170. }
  20171. }
  20172. .points-days-ts-and-cs__accordion .accordion__button {
  20173. color: #000
  20174. }
  20175. .points-days-ts-and-cs__accordion .accordion__button svg {
  20176. fill: #000
  20177. }
  20178. .points-days-ts-and-cs__accordion ol {
  20179. margin: 32px 0 0;
  20180. list-style: none;
  20181. counter-reset: item
  20182. }
  20183. @media(min-width:64em) {
  20184. .points-days-ts-and-cs__accordion ol {
  20185. margin: 56px 0 0
  20186. }
  20187. }
  20188. .points-days-ts-and-cs__accordion ol li {
  20189. display: flex;
  20190. counter-increment: item;
  20191. margin-top: 24px
  20192. }
  20193. .points-days-ts-and-cs__accordion ol li:before {
  20194. margin-right: 16px;
  20195. content: counter(item);
  20196. color: #ee3124;
  20197. text-align: center
  20198. }
  20199. @media(min-width:48em) {
  20200. .points-days-ts-and-cs__accordion ol li:before {
  20201. margin-right: 24px
  20202. }
  20203. }
  20204. .points-days-ts-and-cs__accordion ol li:first-child {
  20205. margin-top: 0
  20206. }
  20207. .points-days-ts-and-cs__accordion ol p {
  20208. margin: 0
  20209. }
  20210. .points-days-ts-and-cs__accordion p {
  20211. margin: 0 0 24px
  20212. }
  20213. .points-days-ts-and-cs__accordion p:first-child {
  20214. margin-top: 32px
  20215. }
  20216. @media(min-width:64em) {
  20217. .points-days-ts-and-cs__accordion p:first-child {
  20218. margin-top: 56px
  20219. }
  20220. }
  20221. .points-days-ts-and-cs__accordion p:last-child {
  20222. margin-bottom: 0
  20223. }
  20224. .points-days-ts-and-cs__accordion p:empty {
  20225. display: none
  20226. }
  20227. .product-love-story-tile {
  20228. position: relative;
  20229. display: flex;
  20230. flex-direction: column;
  20231. justify-content: flex-start;
  20232. width: 298px;
  20233. height: 200px;
  20234. background-size: cover;
  20235. border: none;
  20236. border-radius: 8px;
  20237. padding: 8px 16px 16px;
  20238. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  20239. cursor: pointer;
  20240. text-decoration: none;
  20241. transform: scale(1);
  20242. transition: all .2s
  20243. }
  20244. @media(min-width:48em) {
  20245. .product-love-story-tile {
  20246. width: 384px;
  20247. height: 257px;
  20248. border-radius: 16px
  20249. }
  20250. }
  20251. .product-love-story-tile:focus,
  20252. .product-love-story-tile:hover {
  20253. transform: scale(1.05);
  20254. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24)
  20255. }
  20256. .product-love-story-tile__background {
  20257. width: 100%;
  20258. height: 100%;
  20259. position: absolute;
  20260. top: 0;
  20261. left: 0;
  20262. z-index: -1;
  20263. border-radius: 8px
  20264. }
  20265. .product-love-story-tile__container {
  20266. display: flex;
  20267. align-items: center;
  20268. justify-content: space-between;
  20269. width: 100%
  20270. }
  20271. .product-love-story-tile__like-count-container {
  20272. display: flex;
  20273. align-items: center
  20274. }
  20275. .product-love-story-tile__heart {
  20276. fill: none;
  20277. width: 18px;
  20278. margin-right: 5px
  20279. }
  20280. .product-love-story-tile__like-count {
  20281. margin: 0
  20282. }
  20283. .product-love-story-tile__tag {
  20284. margin: 0;
  20285. padding: 4px 8px;
  20286. border-radius: 16px
  20287. }
  20288. .product-love-story-tile__title {
  20289. height: 94px;
  20290. width: 70%;
  20291. display: flex;
  20292. align-items: center;
  20293. margin: 0
  20294. }
  20295. @media(min-width:48em) {
  20296. .product-love-story-tile__title {
  20297. height: 133px
  20298. }
  20299. }
  20300. .product-love-story-tile__product-container {
  20301. display: flex;
  20302. align-items: center
  20303. }
  20304. .product-love-story-tile__product-image-container {
  20305. background: #fff;
  20306. display: flex;
  20307. justify-content: center;
  20308. align-items: center;
  20309. border-radius: 4px;
  20310. width: 56px;
  20311. height: 56px
  20312. }
  20313. @media(min-width:48em) {
  20314. .product-love-story-tile__product-image-container {
  20315. width: 72px;
  20316. height: 72px
  20317. }
  20318. }
  20319. .product-love-story-tile__product-image {
  20320. background: linear-gradient(0deg, #f4f1f6, #f4f1f6 98%, #fff 99%);
  20321. width: 40px;
  20322. height: 40px
  20323. }
  20324. @media(min-width:48em) {
  20325. .product-love-story-tile__product-image {
  20326. width: 56px;
  20327. height: 56px
  20328. }
  20329. }
  20330. .product-love-story-tile__product-image.image--error {
  20331. padding: 2px
  20332. }
  20333. .product-love-story-tile__product-name {
  20334. width: calc(100% - 64px);
  20335. margin: 0 0 0 8px
  20336. }
  20337. @media(min-width:48em) {
  20338. .product-love-story-tile__product-name {
  20339. width: calc(100% - 80px)
  20340. }
  20341. }
  20342. .product-love-story-tile--dark {
  20343. background-color: #615395
  20344. }
  20345. .product-love-story-tile--dark .product-love-story-tile__like-count,
  20346. .product-love-story-tile--dark .product-love-story-tile__product-name,
  20347. .product-love-story-tile--dark .product-love-story-tile__title,
  20348. .product-love-story-tile--dark:focus,
  20349. .product-love-story-tile--dark:hover {
  20350. color: #fff
  20351. }
  20352. .product-love-story-tile--dark .product-love-story-tile__heart {
  20353. stroke: #fff
  20354. }
  20355. .product-love-story-tile--dark .product-love-story-tile__tag {
  20356. background: #fff;
  20357. color: #403840
  20358. }
  20359. .product-love-story-tile--light {
  20360. background-color: #f4f1f6
  20361. }
  20362. .product-love-story-tile--light .product-love-story-tile__like-count,
  20363. .product-love-story-tile--light .product-love-story-tile__product-name,
  20364. .product-love-story-tile--light .product-love-story-tile__title,
  20365. .product-love-story-tile--light:focus,
  20366. .product-love-story-tile--light:hover {
  20367. color: #403840
  20368. }
  20369. .product-love-story-tile--light .product-love-story-tile__heart {
  20370. stroke: #403840
  20371. }
  20372. .product-love-story-tile--light .product-love-story-tile__tag {
  20373. background: #000;
  20374. color: #fff
  20375. }
  20376. .countdown-timer {
  20377. min-width: 275px;
  20378. margin: 12px 0 0;
  20379. display: flex
  20380. }
  20381. .countdown-timer__duration-group {
  20382. display: flex
  20383. }
  20384. .countdown-timer__duration {
  20385. display: flex;
  20386. flex-direction: column;
  20387. align-items: center
  20388. }
  20389. .countdown-timer__value {
  20390. min-width: 44px;
  20391. text-align: center
  20392. }
  20393. @media(min-width:64em) {
  20394. .countdown-timer__value {
  20395. text-align: left
  20396. }
  20397. }
  20398. .countdown-timer__value--spacer {
  20399. margin: 0 4px
  20400. }
  20401. .marketing-page-header {
  20402. display: grid;
  20403. background-color: #e1251b;
  20404. grid-template-areas: "image" "text"
  20405. }
  20406. @media(min-width:48em) {
  20407. .marketing-page-header {
  20408. grid-template-areas: "text image";
  20409. grid-template-columns: 1fr 40%
  20410. }
  20411. }
  20412. .marketing-page-header__body {
  20413. grid-area: text;
  20414. align-self: center;
  20415. text-align: center;
  20416. padding: 16px 16px 24px;
  20417. display: grid
  20418. }
  20419. @media(min-width:48em) {
  20420. .marketing-page-header__body {
  20421. text-align: left;
  20422. padding: 57px 0 57px 67px
  20423. }
  20424. }
  20425. .cancel-subscription__modal-content .pcoi-error-tile .marketing-page-header__body p:first-of-type,
  20426. .enrol-flow .marketing-page-header__body .flow-progress-bar__title,
  20427. .marketing-page-header__body .activation-card-display__points-label,
  20428. .marketing-page-header__body .billing-history__date,
  20429. .marketing-page-header__body .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type,
  20430. .marketing-page-header__body .category-btn,
  20431. .marketing-page-header__body .deals-for-you-tile__item,
  20432. .marketing-page-header__body .enrol-flow .flow-progress-bar__title,
  20433. .marketing-page-header__body .esso-redemption-earning-card__subtitle,
  20434. .marketing-page-header__body .esso-redemption-pcf__money-subtitle,
  20435. .marketing-page-header__body .esso-redemption-redeem-cards__text,
  20436. .marketing-page-header__body .expandable-form-wrapper__title,
  20437. .marketing-page-header__body .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder,
  20438. .marketing-page-header__body .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder,
  20439. .marketing-page-header__body .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder,
  20440. .marketing-page-header__body .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder,
  20441. .marketing-page-header__body .initial-offers-slider__slider-container__slide-content__question,
  20442. .marketing-page-header__body .no-subscription-plan__content h3,
  20443. .marketing-page-header__body .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned,
  20444. .marketing-page-header__body .offer-content-group-carousel .offer__text,
  20445. .marketing-page-header__body .offer__text--carousel,
  20446. .marketing-page-header__body .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  20447. .marketing-page-header__body .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  20448. .marketing-page-header__body .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  20449. .marketing-page-header__body .quest-offer-child-offer.offer--faded .offer__reward--earned,
  20450. .marketing-page-header__body .quest-offer-child-offer .product-offer__content-group .offer__reward,
  20451. .marketing-page-header__body .subscription-plan__content h3,
  20452. .marketing-page-header__body .type-ds-headline,
  20453. .no-subscription-plan__content .marketing-page-header__body h3,
  20454. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .marketing-page-header__body .offer__reward--earned,
  20455. .offer-content-group-carousel .marketing-page-header__body .offer__text,
  20456. .quest-offer-child-offer .continuity-offer__content-group .marketing-page-header__body .offer__reward,
  20457. .quest-offer-child-offer .hero-continuity-offer__content-group .marketing-page-header__body .offer__reward,
  20458. .quest-offer-child-offer .hero-product-offer__content-group .marketing-page-header__body .offer__reward,
  20459. .quest-offer-child-offer.offer--faded .marketing-page-header__body .offer__reward--earned,
  20460. .quest-offer-child-offer .product-offer__content-group .marketing-page-header__body .offer__reward,
  20461. .subscription-plan__content .marketing-page-header__body h3 {
  20462. margin: 16px 0
  20463. }
  20464. .marketing-page-header__body h1,
  20465. .marketing-page-header__body p {
  20466. color: #fff;
  20467. margin: 0
  20468. }
  20469. .marketing-page-header__link {
  20470. background-color: #191919;
  20471. border-color: #191919;
  20472. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  20473. }
  20474. @media(min-width:48em) {
  20475. .marketing-page-header__link {
  20476. width: -moz-fit-content;
  20477. width: fit-content
  20478. }
  20479. }
  20480. .marketing-page-header__image {
  20481. grid-area: image;
  20482. align-self: center;
  20483. justify-self: center;
  20484. padding: 16px 78px
  20485. }
  20486. @media(min-width:48em) {
  20487. .marketing-page-header__image {
  20488. padding: 32px 40px
  20489. }
  20490. }
  20491. .marketing-page-header .responsive-image__content,
  20492. .marketing-page-header__content {
  20493. max-height: 236px;
  20494. width: 100%
  20495. }
  20496. @media(min-width:48em) {
  20497. .marketing-page-terms-and-conditions {
  20498. margin-top: 32px
  20499. }
  20500. }
  20501. .marketing-page-terms-and-conditions__accordion {
  20502. padding: 24px 16px
  20503. }
  20504. @media(min-width:48em) {
  20505. .marketing-page-terms-and-conditions__accordion {
  20506. padding: 32px 40px;
  20507. border-top: 1px solid #9e93a6
  20508. }
  20509. }
  20510. @media(min-width:64em) {
  20511. .marketing-page-terms-and-conditions__accordion {
  20512. padding: 48px 40px
  20513. }
  20514. }
  20515. .marketing-page-terms-and-conditions__accordion .accordion__button {
  20516. color: #157a77;
  20517. margin: 0
  20518. }
  20519. .marketing-page-terms-and-conditions__accordion .accordion__button svg {
  20520. fill: #157a77;
  20521. height: 15px
  20522. }
  20523. .marketing-page-terms-and-conditions__accordion .accordion__content p {
  20524. color: #403840
  20525. }
  20526. .marketing-page-module {
  20527. display: grid;
  20528. grid-template-areas: "image" "text"
  20529. }
  20530. @media(min-width:48em) {
  20531. .marketing-page-module {
  20532. grid-template-columns: 1fr 1fr;
  20533. grid-template-areas: "image text"
  20534. }
  20535. }
  20536. .marketing-page-module__body {
  20537. grid-area: text;
  20538. margin: 16px 16px 24px;
  20539. display: grid
  20540. }
  20541. @media(min-width:48em) {
  20542. .marketing-page-module__body {
  20543. align-self: center;
  20544. padding: 40px
  20545. }
  20546. }
  20547. .marketing-page-module__link {
  20548. background-color: #191919;
  20549. border-color: #191919;
  20550. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  20551. }
  20552. @media(min-width:48em) {
  20553. .marketing-page-module__link {
  20554. width: -moz-fit-content;
  20555. width: fit-content
  20556. }
  20557. }
  20558. @media(min-width:48em) {
  20559. .marketing-page-module:nth-child(odd) {
  20560. grid-template-areas: "text image"
  20561. }
  20562. }
  20563. .marketing-page-module__image {
  20564. grid-area: image
  20565. }
  20566. .marketing-page-module .responsive-image__content,
  20567. .marketing-page-module__content {
  20568. display: flex;
  20569. justify-content: center;
  20570. width: 100%
  20571. }
  20572. .load-shop-pay {
  20573. max-width: 1280px;
  20574. margin: 0 auto
  20575. }
  20576. .load-shop-pay-header {
  20577. display: grid;
  20578. background-color: #e1251b;
  20579. grid-template-areas: "image" "text"
  20580. }
  20581. @media(min-width:48em) {
  20582. .load-shop-pay-header {
  20583. grid-template-areas: "text image";
  20584. grid-template-columns: 1fr 40%
  20585. }
  20586. }
  20587. .load-shop-pay-header__body {
  20588. grid-area: text;
  20589. align-self: center;
  20590. text-align: center;
  20591. padding: 16px 16px 24px;
  20592. display: grid
  20593. }
  20594. @media(min-width:48em) {
  20595. .load-shop-pay-header__body {
  20596. text-align: left;
  20597. padding: 57px 0 57px 67px
  20598. }
  20599. }
  20600. .cancel-subscription__modal-content .pcoi-error-tile .load-shop-pay-header__body p:first-of-type,
  20601. .enrol-flow .load-shop-pay-header__body .flow-progress-bar__title,
  20602. .load-shop-pay-header__body .activation-card-display__points-label,
  20603. .load-shop-pay-header__body .billing-history__date,
  20604. .load-shop-pay-header__body .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type,
  20605. .load-shop-pay-header__body .category-btn,
  20606. .load-shop-pay-header__body .deals-for-you-tile__item,
  20607. .load-shop-pay-header__body .enrol-flow .flow-progress-bar__title,
  20608. .load-shop-pay-header__body .esso-redemption-earning-card__subtitle,
  20609. .load-shop-pay-header__body .esso-redemption-pcf__money-subtitle,
  20610. .load-shop-pay-header__body .esso-redemption-redeem-cards__text,
  20611. .load-shop-pay-header__body .expandable-form-wrapper__title,
  20612. .load-shop-pay-header__body .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder,
  20613. .load-shop-pay-header__body .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder,
  20614. .load-shop-pay-header__body .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder,
  20615. .load-shop-pay-header__body .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder,
  20616. .load-shop-pay-header__body .initial-offers-slider__slider-container__slide-content__question,
  20617. .load-shop-pay-header__body .no-subscription-plan__content h3,
  20618. .load-shop-pay-header__body .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned,
  20619. .load-shop-pay-header__body .offer-content-group-carousel .offer__text,
  20620. .load-shop-pay-header__body .offer__text--carousel,
  20621. .load-shop-pay-header__body .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  20622. .load-shop-pay-header__body .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  20623. .load-shop-pay-header__body .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  20624. .load-shop-pay-header__body .quest-offer-child-offer.offer--faded .offer__reward--earned,
  20625. .load-shop-pay-header__body .quest-offer-child-offer .product-offer__content-group .offer__reward,
  20626. .load-shop-pay-header__body .subscription-plan__content h3,
  20627. .load-shop-pay-header__body .type-ds-headline,
  20628. .no-subscription-plan__content .load-shop-pay-header__body h3,
  20629. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .load-shop-pay-header__body .offer__reward--earned,
  20630. .offer-content-group-carousel .load-shop-pay-header__body .offer__text,
  20631. .quest-offer-child-offer .continuity-offer__content-group .load-shop-pay-header__body .offer__reward,
  20632. .quest-offer-child-offer .hero-continuity-offer__content-group .load-shop-pay-header__body .offer__reward,
  20633. .quest-offer-child-offer .hero-product-offer__content-group .load-shop-pay-header__body .offer__reward,
  20634. .quest-offer-child-offer.offer--faded .load-shop-pay-header__body .offer__reward--earned,
  20635. .quest-offer-child-offer .product-offer__content-group .load-shop-pay-header__body .offer__reward,
  20636. .subscription-plan__content .load-shop-pay-header__body h3 {
  20637. margin: 16px 0
  20638. }
  20639. .load-shop-pay-header__body h1,
  20640. .load-shop-pay-header__body p {
  20641. color: #fff;
  20642. margin: 0
  20643. }
  20644. .load-shop-pay-header__link {
  20645. background-color: #191919;
  20646. border-color: #191919;
  20647. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  20648. }
  20649. @media(min-width:48em) {
  20650. .load-shop-pay-header__link {
  20651. width: -moz-fit-content;
  20652. width: fit-content
  20653. }
  20654. }
  20655. .load-shop-pay-header__image-container {
  20656. grid-area: image;
  20657. align-self: center;
  20658. justify-self: center;
  20659. padding: 16px 78px
  20660. }
  20661. @media(min-width:48em) {
  20662. .load-shop-pay-header__image-container {
  20663. padding: 32px 40px
  20664. }
  20665. }
  20666. .load-shop-pay-header__image .responsive-image__content {
  20667. max-height: 236px;
  20668. width: 100%
  20669. }
  20670. .load-shop-pay-module {
  20671. display: grid;
  20672. grid-template-areas: "image" "text"
  20673. }
  20674. @media(min-width:48em) {
  20675. .load-shop-pay-module {
  20676. grid-template-columns: 1fr 1fr;
  20677. grid-template-areas: "image text"
  20678. }
  20679. }
  20680. .load-shop-pay-module__body {
  20681. grid-area: text;
  20682. margin: 16px 16px 24px;
  20683. display: grid
  20684. }
  20685. .billing-history-empty-state__message .load-shop-pay-module__body h4,
  20686. .load-shop-pay-module__body .billing-history-empty-state__message h4,
  20687. .load-shop-pay-module__body .deals-for-you__subtitle,
  20688. .load-shop-pay-module__body .download-app__subtitle,
  20689. .load-shop-pay-module__body .esso-redemption-header__subtitle,
  20690. .load-shop-pay-module__body .esso-redemption-pcf__title,
  20691. .load-shop-pay-module__body .esso-redemption-redeem-cards__text-divider,
  20692. .load-shop-pay-module__body .esso-redemption-redeem-cards__title,
  20693. .load-shop-pay-module__body .loadToCard-brand-banner .layoutCard__title,
  20694. .load-shop-pay-module__body .modal-content .offer__text--carousel,
  20695. .load-shop-pay-module__body .offer-standalone__heading,
  20696. .load-shop-pay-module__body .offer__reward--carousel,
  20697. .load-shop-pay-module__body .slider-header__text--heading,
  20698. .load-shop-pay-module__body .type-ds-title-3,
  20699. .load-shop-pay-module__body .your-pco-error__tile-content-title,
  20700. .loadToCard-brand-banner .load-shop-pay-module__body .layoutCard__title,
  20701. .modal-content .load-shop-pay-module__body .offer__text--carousel {
  20702. color: #e1251b;
  20703. margin: 0
  20704. }
  20705. @media(min-width:48em) {
  20706. .load-shop-pay-module__body {
  20707. align-self: center;
  20708. padding: 40px
  20709. }
  20710. }
  20711. .load-shop-pay-module__link {
  20712. background-color: #191919;
  20713. border-color: #191919;
  20714. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  20715. }
  20716. @media(min-width:48em) {
  20717. .load-shop-pay-module__link {
  20718. width: -moz-fit-content;
  20719. width: fit-content
  20720. }
  20721. }
  20722. @media(min-width:48em) {
  20723. .load-shop-pay-module:nth-child(2n) {
  20724. grid-template-areas: "text image"
  20725. }
  20726. }
  20727. .load-shop-pay-module__image-container {
  20728. grid-area: image;
  20729. background-color: #e1251b
  20730. }
  20731. .load-shop-pay-module__image {
  20732. display: flex;
  20733. justify-content: center
  20734. }
  20735. .load-shop-pay-module__image .responsive-image__content {
  20736. width: 100%
  20737. }
  20738. @media(min-width:48em) {
  20739. .load-shop-pay-module__image .responsive-image__content {
  20740. max-width: 640px
  20741. }
  20742. }
  20743. @media(min-width:48em) {
  20744. .load-shop-pay-ts-and-cs {
  20745. margin-top: 32px
  20746. }
  20747. }
  20748. .load-shop-pay-ts-and-cs__accordion {
  20749. padding: 24px 16px
  20750. }
  20751. @media(min-width:48em) {
  20752. .load-shop-pay-ts-and-cs__accordion {
  20753. border-top: 1px solid #9e93a6;
  20754. padding: 32px 40px
  20755. }
  20756. }
  20757. @media(min-width:64em) {
  20758. .load-shop-pay-ts-and-cs__accordion {
  20759. padding: 48px 0
  20760. }
  20761. }
  20762. .load-shop-pay-ts-and-cs__accordion .accordion__button {
  20763. color: #157a77;
  20764. margin: 0
  20765. }
  20766. .load-shop-pay-ts-and-cs__accordion .accordion__button svg {
  20767. fill: #157a77;
  20768. height: 15px
  20769. }
  20770. .load-shop-pay-ts-and-cs__link {
  20771. color: #157a77
  20772. }
  20773. .load-shop-pay-ts-and-cs .accordion__content p {
  20774. color: #403840
  20775. }
  20776. .loadToCard-sign-in-section {
  20777. position: sticky;
  20778. top: 56px;
  20779. bottom: auto;
  20780. display: flex;
  20781. flex-direction: column;
  20782. align-items: flex-start;
  20783. background: rgba(237, 243, 253, .95);
  20784. box-shadow: 0 4px 10px rgba(158, 147, 166, .45);
  20785. border: 1px solid #4a80d2;
  20786. border-radius: 8px;
  20787. padding: 16px;
  20788. z-index: 1;
  20789. max-width: 920px;
  20790. margin: 48px auto 20px
  20791. }
  20792. @media(min-width:48em) {
  20793. .loadToCard-sign-in-section {
  20794. margin: 64px auto 36px
  20795. }
  20796. }
  20797. @media(min-width:64em) {
  20798. .loadToCard-sign-in-section {
  20799. margin: 64px auto;
  20800. top: 82px;
  20801. padding: 16px
  20802. }
  20803. }
  20804. .loadToCard-sign-in-section__title {
  20805. margin-top: 0
  20806. }
  20807. .loadToCard-sign-in-section__title sup {
  20808. line-height: 0;
  20809. font-size: 8px
  20810. }
  20811. .loadToCard-sign-in-section__link {
  20812. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  20813. }
  20814. .load-to-card-section {
  20815. display: flex;
  20816. flex-direction: column;
  20817. max-width: 920px;
  20818. margin: 0 auto
  20819. }
  20820. .load-to-card-section__error-banner {
  20821. margin: 0 auto
  20822. }
  20823. .load-to-card-section__error-banner>.your-pco-error__wrapper {
  20824. max-width: 920px
  20825. }
  20826. .load-to-card-section__error-space {
  20827. margin-top: 50px
  20828. }
  20829. @media(min-width:48em) {
  20830. .load-to-card-section__error-space {
  20831. margin-top: 240px
  20832. }
  20833. }
  20834. @media(min-width:64em) {
  20835. .load-to-card-section__error-space {
  20836. margin-top: 100px
  20837. }
  20838. }
  20839. .load-to-card-section__no-contentful {
  20840. margin-top: 38px
  20841. }
  20842. @media(min-width:64em) {
  20843. .load-to-card-section__no-contentful {
  20844. margin-top: 60px
  20845. }
  20846. }
  20847. .load-to-card-grid {
  20848. width: 100%;
  20849. display: grid;
  20850. grid-template-columns: 1fr;
  20851. -moz-column-gap: 24px;
  20852. column-gap: 24px;
  20853. row-gap: 27px;
  20854. list-style-type: none;
  20855. margin: 0 0 2.375rem;
  20856. padding: 0
  20857. }
  20858. @media(min-width:48em) {
  20859. .load-to-card-grid {
  20860. grid-template-columns: 1fr 1fr;
  20861. margin: 0 0 3.75rem
  20862. }
  20863. }
  20864. @media(min-width:64em) {
  20865. .load-to-card-grid {
  20866. grid-template-columns: 1fr 1fr 1fr;
  20867. margin: 0 0 3.75rem
  20868. }
  20869. }
  20870. .load-to-card-section-header {
  20871. display: flex;
  20872. flex-direction: column;
  20873. align-items: flex-start;
  20874. margin: 0 0 1.25rem
  20875. }
  20876. @media(min-width:48em) {
  20877. .load-to-card-section-header {
  20878. flex-direction: row;
  20879. justify-content: space-between;
  20880. align-items: center;
  20881. margin: 1rem 0 2rem
  20882. }
  20883. }
  20884. @media(min-width:64em) {
  20885. .load-to-card-section-header {
  20886. margin-top: 0
  20887. }
  20888. }
  20889. .load-to-card-section-header__no-title {
  20890. justify-content: flex-end
  20891. }
  20892. .load-to-card-section-header__heading {
  20893. color: #000;
  20894. margin: 0;
  20895. flex-grow: 1
  20896. }
  20897. .load-to-card-section-header .checkbox-group-new-ds__label {
  20898. cursor: pointer
  20899. }
  20900. .loadToCard-header__wrapper {
  20901. max-width: 920px;
  20902. margin: 0 auto
  20903. }
  20904. .loadToCard-header__container {
  20905. position: relative
  20906. }
  20907. .loadToCard-header__title {
  20908. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  20909. font-weight: 600;
  20910. font-size: 2rem;
  20911. line-height: 2.375rem;
  20912. color: #ac342a;
  20913. margin: 48px 0 24px;
  20914. position: relative;
  20915. z-index: 1;
  20916. max-width: 250px
  20917. }
  20918. @media(min-width:48em) {
  20919. .loadToCard-header__title {
  20920. font-size: 2.625rem;
  20921. line-height: 3rem
  20922. }
  20923. }
  20924. @media(min-width:34.375em) {
  20925. .loadToCard-header__title {
  20926. max-width: 100%
  20927. }
  20928. }
  20929. @media(min-width:64em) {
  20930. .loadToCard-header__title {
  20931. margin: 90px 0 32px
  20932. }
  20933. }
  20934. .loadToCard-header__subtitle {
  20935. max-width: 485px;
  20936. font-weight: 400;
  20937. margin: 0;
  20938. position: relative;
  20939. z-index: 1
  20940. }
  20941. .loadToCard-header__subtitle sup {
  20942. line-height: 1
  20943. }
  20944. .load-to-card-tile__wrapper {
  20945. border: 1px solid rgba(158, 147, 166, .2);
  20946. box-sizing: border-box;
  20947. box-shadow: 0 4px 4px rgba(158, 147, 166, .2);
  20948. border-radius: 16px;
  20949. background: #fff;
  20950. transition: all .2s ease
  20951. }
  20952. .load-to-card-tile__offer-details-button {
  20953. background: none;
  20954. border: none;
  20955. padding: 0;
  20956. width: 100%;
  20957. text-align: left;
  20958. border-radius: 1rem 1rem 0 0
  20959. }
  20960. .load-to-card-tile__wrapper:focus-within,
  20961. .load-to-card-tile__wrapper:hover {
  20962. box-shadow: 0 4px 5px rgba(158, 147, 166, .2), 0 3px 14px rgba(158, 147, 166, .12), 0 8px 10px rgba(158, 147, 166, .14);
  20963. transform: scale(1.03)
  20964. }
  20965. .load-to-card-tile__container {
  20966. position: relative;
  20967. display: flex;
  20968. flex-direction: column;
  20969. justify-content: space-between;
  20970. width: 100%;
  20971. border-bottom: 1px solid rgba(158, 147, 166, .2);
  20972. cursor: pointer
  20973. }
  20974. @media(min-width:48em) {
  20975. .load-to-card-tile__container {
  20976. height: 327px
  20977. }
  20978. }
  20979. .load-to-card-tile__offer-details-section {
  20980. display: flex;
  20981. flex-direction: column;
  20982. justify-content: flex-start;
  20983. align-items: center;
  20984. padding: 24px 0 0;
  20985. overflow: hidden
  20986. }
  20987. .load-to-card-tile__offer-details-section .offer__text div {
  20988. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  20989. font-size: 1rem;
  20990. line-height: 1.375rem;
  20991. color: #403840;
  20992. margin: 8px 0 0;
  20993. font-weight: 600
  20994. }
  20995. @media(min-width:48em) {
  20996. .load-to-card-tile__offer-details-section .offer__text div {
  20997. font-size: 1.125rem;
  20998. line-height: 1.5rem
  20999. }
  21000. }
  21001. .load-to-card-tile__hero-offer-layout {
  21002. padding-top: 0;
  21003. border-radius: 1rem 1rem 0 0
  21004. }
  21005. .load-to-card-tile__text-heading {
  21006. margin: 0;
  21007. width: 100%;
  21008. padding: 0 24px
  21009. }
  21010. .load-to-card-tile__reward-text {
  21011. width: 100%;
  21012. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  21013. font-size: 1.375rem;
  21014. line-height: 1.75rem;
  21015. color: #ac342a;
  21016. margin: 16px 0 0
  21017. }
  21018. @media(min-width:48em) {
  21019. .load-to-card-tile__reward-text {
  21020. font-size: 1.5rem;
  21021. line-height: 2rem
  21022. }
  21023. }
  21024. .load-to-card-tile__offer-expiry-date {
  21025. padding: 0 24px 16px;
  21026. color: #655c6c;
  21027. margin: 0
  21028. }
  21029. @media(max-width:47.99em) {
  21030. .load-to-card-tile__offer-expiry-date {
  21031. margin-top: 1rem
  21032. }
  21033. }
  21034. .load-to-card-tile__title {
  21035. display: -webkit-box;
  21036. -webkit-box-orient: vertical;
  21037. -webkit-line-clamp: 3;
  21038. overflow: hidden;
  21039. text-overflow: ellipsis;
  21040. word-break: break-word
  21041. }
  21042. @media(min-width:48em) {
  21043. .load-to-card-tile__title {
  21044. -webkit-line-clamp: 4
  21045. }
  21046. }
  21047. .load-to-card-tile__exclusive {
  21048. -webkit-line-clamp: 3
  21049. }
  21050. @media(min-width:48em) {
  21051. .load-to-card-tile__exclusive {
  21052. -webkit-line-clamp: 2
  21053. }
  21054. }
  21055. .load-to-card-tile__checkbox-container {
  21056. width: 100%;
  21057. height: 62px;
  21058. display: flex;
  21059. justify-content: center;
  21060. align-items: center
  21061. }
  21062. .load-to-card-tile__checkbox-container .checkbox-group-new-ds__label {
  21063. color: #157a77;
  21064. cursor: pointer
  21065. }
  21066. .load-to-card-tile__content-container {
  21067. height: 134px
  21068. }
  21069. .load-to-card-tile__offer-image-container {
  21070. max-height: 108px
  21071. }
  21072. .load-to-card-tile__offer-image-container .offer__image-element {
  21073. max-height: 100%
  21074. }
  21075. .load-to-card-no-offers-left {
  21076. max-width: 920px;
  21077. margin: 0 auto
  21078. }
  21079. .load-to-card-no-offers-left__container {
  21080. position: relative;
  21081. display: flex;
  21082. justify-content: center;
  21083. align-items: center;
  21084. flex-direction: column;
  21085. padding: 32px;
  21086. margin-bottom: 60px;
  21087. text-align: center;
  21088. background: #f4f1f6;
  21089. border-radius: 16px
  21090. }
  21091. .load-to-card-no-offers-left__img {
  21092. width: 80px;
  21093. height: 64px;
  21094. margin-bottom: 24px
  21095. }
  21096. .load-to-card-no-offers-left__title {
  21097. margin: 0 auto 8px
  21098. }
  21099. .load-to-card-no-offers-left__body {
  21100. margin: 0 0 24px
  21101. }
  21102. .load-to-card-no-offers-left__link {
  21103. font-size: 1rem;
  21104. line-height: 1.125rem;
  21105. font-weight: 600;
  21106. color: #403840;
  21107. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  21108. color: #fff
  21109. }
  21110. @media(min-width:48em) {
  21111. .load-to-card-no-offers-left__link {
  21112. line-height: 1.375rem
  21113. }
  21114. }
  21115. .loadToCard-brand-banner {
  21116. margin: 2.375rem auto;
  21117. border-radius: 24px;
  21118. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  21119. max-width: none;
  21120. min-height: 0;
  21121. justify-content: space-between;
  21122. flex-direction: column-reverse
  21123. }
  21124. @media(min-width:48em) {
  21125. .loadToCard-brand-banner {
  21126. flex-direction: row
  21127. }
  21128. }
  21129. @media(min-width:64em) {
  21130. .loadToCard-brand-banner {
  21131. margin: 3.75rem auto
  21132. }
  21133. }
  21134. .loadToCard-brand-banner__section {
  21135. max-width: 920px;
  21136. margin: 0 auto
  21137. }
  21138. .loadToCard-brand-banner__tall .layoutCard__logo-container:nth-of-type(3),
  21139. .loadToCard-brand-banner__tall .layoutCard__logo-container:nth-of-type(4) {
  21140. margin-top: 1.25rem
  21141. }
  21142. @media(min-width:48em) {
  21143. .loadToCard-brand-banner__tall .layoutCard__image-container img {
  21144. height: 352px
  21145. }
  21146. }
  21147. @media(min-width:64em) {
  21148. .loadToCard-brand-banner__tall .layoutCard__image-container img {
  21149. height: 425px
  21150. }
  21151. }
  21152. .loadToCard-brand-banner .layoutCard__body {
  21153. font-weight: 400;
  21154. max-width: none
  21155. }
  21156. .loadToCard-brand-banner .layoutCard__text-container {
  21157. padding: 2rem 1.5rem;
  21158. width: 100%;
  21159. flex-grow: 1
  21160. }
  21161. @media(min-width:48em) {
  21162. .loadToCard-brand-banner .layoutCard__text-container {
  21163. padding: 2rem
  21164. }
  21165. }
  21166. @media(min-width:64em) {
  21167. .loadToCard-brand-banner .layoutCard__text-container {
  21168. padding: 4rem
  21169. }
  21170. }
  21171. .loadToCard-brand-banner .layoutCard__logo-list {
  21172. display: flex;
  21173. justify-content: space-between;
  21174. align-items: center;
  21175. flex-wrap: wrap;
  21176. margin-top: 2rem;
  21177. width: 90%;
  21178. max-width: 270px
  21179. }
  21180. @media(min-width:48em) {
  21181. .loadToCard-brand-banner .layoutCard__logo-list {
  21182. width: 80%;
  21183. margin-top: 0
  21184. }
  21185. }
  21186. .loadToCard-brand-banner .layoutCard__logo-container {
  21187. margin-top: 1rem;
  21188. width: calc(50% - .5rem)
  21189. }
  21190. .loadToCard-brand-banner .layoutCard__logo-container img {
  21191. max-width: 100%
  21192. }
  21193. .loadToCard-brand-banner .layoutCard__image-container {
  21194. width: 100%;
  21195. max-width: none
  21196. }
  21197. @media(min-width:48em) {
  21198. .loadToCard-brand-banner .layoutCard__image-container {
  21199. flex: 0 0 322px
  21200. }
  21201. }
  21202. @media(min-width:64em) {
  21203. .loadToCard-brand-banner .layoutCard__image-container {
  21204. flex: 0 0 455px
  21205. }
  21206. }
  21207. .loadToCard-brand-banner .layoutCard__image-container img {
  21208. position: static
  21209. }
  21210. .load-to-card-tile-brand-banner {
  21211. width: 100%;
  21212. padding: 0 10px;
  21213. margin-top: 16px
  21214. }
  21215. .load-to-card-tile-brand-banner__container {
  21216. height: 30px;
  21217. display: flex;
  21218. flex: 1;
  21219. justify-content: center;
  21220. align-items: center;
  21221. border-radius: 8px
  21222. }
  21223. .load-to-card-tile-brand-banner__banner-exclusive-text {
  21224. margin-top: 2px;
  21225. color: #fff
  21226. }
  21227. .load-to-card-tile-brand-banner__division-market {
  21228. background-color: #000
  21229. }
  21230. .load-to-card-tile-brand-banner__division-discount {
  21231. background-color: #003da5
  21232. }
  21233. .load-to-card-tile-brand-banner__division-shoppers {
  21234. background-color: #c4262e
  21235. }
  21236. .load-to-card-tile-brand-banner__division-beauty_boutique {
  21237. background-color: #8fcae7
  21238. }
  21239. .load-to-card-tile-brand-banner__division-joe_fresh {
  21240. background-color: #ff4713
  21241. }
  21242. .load-to-card-tile-brand-banner__division-murale {
  21243. background-color: #8977ba
  21244. }
  21245. .loadToCard-modal-brand-banner {
  21246. margin-top: 13px
  21247. }
  21248. .loadToCard-modal-brand-banner__modal-container {
  21249. max-width: 367px;
  21250. margin: 0 auto
  21251. }
  21252. .loadToCard-modal-content {
  21253. background: #fff;
  21254. border-radius: 16px;
  21255. max-width: 510px;
  21256. width: 325px;
  21257. max-height: 90vh;
  21258. transform: translate(0);
  21259. overflow: hidden;
  21260. display: flex;
  21261. flex-direction: column;
  21262. padding-bottom: 133px
  21263. }
  21264. @media(max-width:47.99em) {
  21265. .loadToCard-modal-content {
  21266. height: auto
  21267. }
  21268. }
  21269. @media(min-width:34.375em) {
  21270. .loadToCard-modal-content {
  21271. width: 510px;
  21272. padding-bottom: 141px
  21273. }
  21274. }
  21275. .loadToCard-modal-content .offer__image {
  21276. width: 110px;
  21277. aspect-ratio: 1;
  21278. margin: 0 auto;
  21279. padding: 1.5rem 0;
  21280. display: block
  21281. }
  21282. @media(min-width:48em) {
  21283. .loadToCard-modal-content .offer__image {
  21284. width: 144px;
  21285. padding: 3rem 0
  21286. }
  21287. }
  21288. .loadToCard-modal-content .offer__image--carousel {
  21289. height: 200px;
  21290. padding: 50px 0 0
  21291. }
  21292. @media(min-width:48em) {
  21293. .loadToCard-modal-content .offer__image--carousel {
  21294. height: 280px
  21295. }
  21296. }
  21297. .loadToCard-modal-content .offer__image--carousel img {
  21298. width: auto;
  21299. max-width: none;
  21300. height: 150px
  21301. }
  21302. @media(min-width:48em) {
  21303. .loadToCard-modal-content .offer__image--carousel img {
  21304. height: 230px
  21305. }
  21306. }
  21307. .loadToCard-modal-content__title-container {
  21308. text-align: center;
  21309. position: relative;
  21310. padding-bottom: 1.5rem
  21311. }
  21312. .loadToCard-modal-content__title-container:after {
  21313. content: "";
  21314. position: absolute;
  21315. height: 1px;
  21316. width: calc(100% + 48px);
  21317. bottom: 0;
  21318. left: -24px;
  21319. background: rgba(158, 147, 166, .2)
  21320. }
  21321. .loadToCard-modal-content__title-container .offer__text {
  21322. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  21323. font-size: 1.25rem;
  21324. line-height: 1.5rem;
  21325. font-weight: 600;
  21326. color: #403840
  21327. }
  21328. @media(min-width:48em) {
  21329. .loadToCard-modal-content__title-container .offer__text {
  21330. font-size: 1.5rem;
  21331. line-height: 2rem
  21332. }
  21333. }
  21334. .loadToCard-modal-content__points-title {
  21335. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  21336. font-weight: 600;
  21337. font-size: 1.375rem;
  21338. line-height: 1.75rem;
  21339. color: #ac342a;
  21340. margin: .5rem 0
  21341. }
  21342. @media(min-width:48em) {
  21343. .loadToCard-modal-content__points-title {
  21344. font-size: 2rem;
  21345. line-height: 2.25rem
  21346. }
  21347. }
  21348. .loadToCard-modal-content__product-title {
  21349. margin: .5rem 0 0
  21350. }
  21351. .loadToCard-modal-content__body-text {
  21352. margin: 1.5rem 0 1rem
  21353. }
  21354. .loadToCard-modal-content__date-text {
  21355. color: #655c6c;
  21356. margin-bottom: 0
  21357. }
  21358. @media(min-width:34.375em) {
  21359. .loadToCard-modal-content__date-text {
  21360. margin: 1.5rem 0 .75rem
  21361. }
  21362. }
  21363. .loadToCard-modal-content__inner {
  21364. padding: 0 1.5rem;
  21365. height: auto;
  21366. flex-grow: 1
  21367. }
  21368. .loadToCard-modal-content__inner-hero .offer__reward {
  21369. margin-top: 1.5rem
  21370. }
  21371. @media(max-width:47.99em) {
  21372. .loadToCard-modal-content__inner-text {
  21373. height: auto;
  21374. overflow: visible
  21375. }
  21376. }
  21377. .loadToCard-modal-content__inner-text .offer-details__long-text,
  21378. .loadToCard-modal-content__inner-text .offer-details__terms {
  21379. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  21380. font-size: .9375rem;
  21381. line-height: 1.25rem;
  21382. color: #403840;
  21383. padding: 0
  21384. }
  21385. @media(min-width:48em) {
  21386. .loadToCard-modal-content__inner-text .offer-details__long-text,
  21387. .loadToCard-modal-content__inner-text .offer-details__terms {
  21388. font-size: 1rem;
  21389. line-height: 1.375rem
  21390. }
  21391. }
  21392. .loadToCard-modal-content__inner-text .offer-details__long-text strong,
  21393. .loadToCard-modal-content__inner-text .offer-details__terms strong {
  21394. font-family: Noir, Arial, Helvetica Neue, Helvetica, sans-serif;
  21395. font-weight: 600;
  21396. font-size: 1rem;
  21397. line-height: 1.375rem
  21398. }
  21399. @media(min-width:48em) {
  21400. .loadToCard-modal-content__inner-text .offer-details__long-text strong,
  21401. .loadToCard-modal-content__inner-text .offer-details__terms strong {
  21402. font-size: 1.125rem;
  21403. line-height: 1.5rem
  21404. }
  21405. }
  21406. .loadToCard-modal-content__inner-text .offer-details__long-text {
  21407. margin-top: 1.5rem
  21408. }
  21409. .loadToCard-modal-content__inner-buttons {
  21410. display: flex;
  21411. flex-direction: column;
  21412. position: fixed;
  21413. bottom: 0;
  21414. left: 0;
  21415. right: 0;
  21416. padding: 1rem 1.5rem 2rem;
  21417. border: none
  21418. }
  21419. .loadToCard-modal-content__cta-button {
  21420. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  21421. font-size: 1rem;
  21422. line-height: 1.125rem;
  21423. color: #403840;
  21424. font-weight: 600;
  21425. color: #fff;
  21426. background: #157a77;
  21427. border-radius: 32px;
  21428. border: none;
  21429. padding: 12px;
  21430. transition: all .3s ease
  21431. }
  21432. @media(min-width:48em) {
  21433. .loadToCard-modal-content__cta-button {
  21434. line-height: 1.375rem
  21435. }
  21436. }
  21437. .loadToCard-modal-content__cta-button:active,
  21438. .loadToCard-modal-content__cta-button:focus,
  21439. .loadToCard-modal-content__cta-button:hover {
  21440. background: #615395
  21441. }
  21442. .loadToCard-modal-content__cta-button--secondary {
  21443. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  21444. font-size: 1rem;
  21445. line-height: 1.125rem;
  21446. color: #403840;
  21447. font-weight: 600;
  21448. text-decoration: underline;
  21449. align-self: center;
  21450. color: #157a77;
  21451. margin-top: 1.5rem;
  21452. padding: 0 2rem;
  21453. transition: all .3s ease
  21454. }
  21455. @media(min-width:48em) {
  21456. .loadToCard-modal-content__cta-button--secondary {
  21457. line-height: 1.375rem
  21458. }
  21459. }
  21460. .loadToCard-modal-content__cta-button--secondary:active,
  21461. .loadToCard-modal-content__cta-button--secondary:focus,
  21462. .loadToCard-modal-content__cta-button--secondary:hover {
  21463. color: #615395
  21464. }
  21465. .loadToCard-modal__scroll .loadToCard-modal-content__inner {
  21466. overflow-y: scroll;
  21467. overscroll-behavior: none
  21468. }
  21469. .loadToCard-modal__scroll .loadToCard-modal-content__inner-buttons {
  21470. border-top: 1px solid rgba(158, 147, 166, .2)
  21471. }
  21472. @media(max-width:34.365em) {
  21473. .loadToCard-modal__scroll .loadToCard-modal-content__date-text {
  21474. margin-bottom: 1rem
  21475. }
  21476. }
  21477. .initial-offers-slider__slider-container__slide {
  21478. display: flex
  21479. }
  21480. .initial-offers-slider__slider-container__slide-content__offer-button {
  21481. display: inline-flex;
  21482. justify-content: center;
  21483. align-items: center;
  21484. padding: 8px;
  21485. box-sizing: border-box;
  21486. background: #fff;
  21487. border: 2px solid #157a77;
  21488. transition: all .2s
  21489. }
  21490. .initial-offers-slider__slider-container__slide-content__offer-button:focus,
  21491. .initial-offers-slider__slider-container__slide-content__offer-button:hover {
  21492. background: #615395;
  21493. border: 2px solid #615395;
  21494. cursor: pointer
  21495. }
  21496. .initial-offers-slider__slider-container__slide-content__offer-button:active {
  21497. background: #157a77;
  21498. border: 2px solid #157a77;
  21499. cursor: pointer
  21500. }
  21501. .initial-offers-slider__slider-container__slide-content__offer-button:active span,
  21502. .initial-offers-slider__slider-container__slide-content__offer-button:focus span,
  21503. .initial-offers-slider__slider-container__slide-content__offer-button:hover span {
  21504. color: #fff
  21505. }
  21506. .initial-offers-slider__slider-container__slide-content__title {
  21507. font-weight: 400;
  21508. margin: 0 0 8px
  21509. }
  21510. @media(min-width:48em) {
  21511. .initial-offers-slider__slider-container__slide-content__title {
  21512. margin: 0 0 12px
  21513. }
  21514. }
  21515. .initial-offers-slider__slider-container__slide-content__question {
  21516. margin: 0 auto 22px
  21517. }
  21518. @media(min-width:48em) {
  21519. .initial-offers-slider__slider-container__slide-content__question {
  21520. max-width: 360px;
  21521. margin: 0 auto 66px
  21522. }
  21523. }
  21524. .initial-offers-slider__slider-container__slide-content--screen-1 {
  21525. display: flex;
  21526. position: relative;
  21527. flex-direction: column;
  21528. width: 100%
  21529. }
  21530. .initial-offers-slider__slider-container__slide-content--screen-1--optHolder {
  21531. position: relative;
  21532. width: 100%;
  21533. margin-bottom: 29px
  21534. }
  21535. @media(min-width:48em) {
  21536. .initial-offers-slider__slider-container__slide-content--screen-1--optHolder {
  21537. margin-bottom: 55px
  21538. }
  21539. }
  21540. .initial-offers-slider__slider-container__slide-content--screen-1--button {
  21541. position: relative;
  21542. overflow: auto;
  21543. flex-direction: row;
  21544. border-radius: 45px;
  21545. margin-right: 5px;
  21546. margin-bottom: 13px
  21547. }
  21548. @media(min-width:48em) {
  21549. .initial-offers-slider__slider-container__slide-content--screen-1--button {
  21550. margin-right: 18px;
  21551. margin-bottom: 28px;
  21552. padding: 8px 20px 8px 8px
  21553. }
  21554. }
  21555. .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder {
  21556. position: relative;
  21557. overflow: auto;
  21558. display: flex;
  21559. width: 30px;
  21560. height: 30px;
  21561. flex: none;
  21562. border-radius: 50%;
  21563. justify-content: center;
  21564. align-items: center;
  21565. margin: 0 5px 0 0
  21566. }
  21567. @media(min-width:48em) {
  21568. .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder {
  21569. width: 39px;
  21570. height: 37px;
  21571. margin: 0 17px 0 0
  21572. }
  21573. }
  21574. .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder img {
  21575. width: 100%;
  21576. height: 100%
  21577. }
  21578. .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder {
  21579. display: inline-flex;
  21580. height: 100%;
  21581. align-items: center;
  21582. font-size: .9375rem;
  21583. line-height: 1.3125rem;
  21584. margin-top: 3px;
  21585. word-break: break-word
  21586. }
  21587. @media(min-width:48em) {
  21588. .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder {
  21589. font-size: 1rem;
  21590. line-height: 1.5rem
  21591. }
  21592. }
  21593. .initial-offers-slider__slider-container__slide-content--screen-rest {
  21594. display: flex;
  21595. position: relative;
  21596. flex-direction: column;
  21597. width: 100%
  21598. }
  21599. .initial-offers-slider__slider-container__slide-content--screen-rest--optHolder {
  21600. position: relative;
  21601. width: 100%;
  21602. display: flex;
  21603. flex-flow: wrap;
  21604. justify-content: center;
  21605. align-items: center
  21606. }
  21607. .initial-offers-slider__slider-container__slide-content--screen-rest--button {
  21608. position: relative;
  21609. overflow: auto;
  21610. flex-direction: column;
  21611. border-radius: 50%;
  21612. margin-bottom: 0
  21613. }
  21614. .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder {
  21615. position: relative;
  21616. overflow: auto;
  21617. display: flex;
  21618. width: 90px;
  21619. height: 70px;
  21620. flex: none;
  21621. justify-content: center;
  21622. align-items: center;
  21623. margin-bottom: 9px
  21624. }
  21625. @media(min-width:48em) {
  21626. .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder {
  21627. width: 118px;
  21628. height: 92px;
  21629. margin-bottom: 12px
  21630. }
  21631. }
  21632. .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder img {
  21633. width: auto;
  21634. height: 70px
  21635. }
  21636. @media(min-width:48em) {
  21637. .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder img {
  21638. width: auto;
  21639. height: 92px
  21640. }
  21641. }
  21642. .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder {
  21643. font-size: .9375rem;
  21644. line-height: 1.3125rem;
  21645. width: 85%;
  21646. word-break: break-word
  21647. }
  21648. @media(min-width:48em) {
  21649. .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder {
  21650. font-size: 1rem;
  21651. line-height: 1.5rem
  21652. }
  21653. }
  21654. .initial-offers-slider__slider-container__slide-content--screen-rest--button:first-child,
  21655. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(4) {
  21656. height: 148px;
  21657. width: 148px;
  21658. margin-right: 15px;
  21659. margin-left: 15px
  21660. }
  21661. @media(min-width:48em) {
  21662. .initial-offers-slider__slider-container__slide-content--screen-rest--button:first-child,
  21663. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(4) {
  21664. height: 195px;
  21665. width: 195px;
  21666. margin-right: 39px;
  21667. margin-left: 39px;
  21668. margin-bottom: 0
  21669. }
  21670. }
  21671. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(2),
  21672. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(3) {
  21673. height: 100px;
  21674. width: 100px
  21675. }
  21676. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(2) span:first-child,
  21677. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(3) span:first-child {
  21678. display: none
  21679. }
  21680. @media(min-width:48em) {
  21681. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(2),
  21682. .initial-offers-slider__slider-container__slide-content--screen-rest--button:nth-child(3) {
  21683. height: 131px;
  21684. width: 131px;
  21685. margin-bottom: 0
  21686. }
  21687. }
  21688. .initial-offers-slider__slider-container__slide-content--skipButton {
  21689. color: #157a77;
  21690. border: 0;
  21691. background: none;
  21692. text-decoration: underline;
  21693. align-self: center
  21694. }
  21695. .initial-offers-slider__slider-container__slide-content--skipButton:hover {
  21696. color: #615395;
  21697. cursor: pointer
  21698. }
  21699. @keyframes slidein {
  21700. 0% {
  21701. margin-left: 100%;
  21702. width: 100%
  21703. }
  21704. to {
  21705. margin-left: 0;
  21706. width: 100%
  21707. }
  21708. }
  21709. .initial-offers-wrapper {
  21710. width: 100%;
  21711. height: 100%;
  21712. display: flex;
  21713. justify-content: center;
  21714. align-items: center;
  21715. flex-direction: column;
  21716. overflow: hidden
  21717. }
  21718. .initial-offers-wrapper .frame {
  21719. border: none;
  21720. width: 100%;
  21721. overflow: hidden
  21722. }
  21723. .initial-offers-wrapper .box-container {
  21724. display: flex;
  21725. transition: all .2s ease-in-out
  21726. }
  21727. .initial-offers-wrapper .box {
  21728. box-sizing: border-box;
  21729. border: none;
  21730. width: 100%;
  21731. height: 100%;
  21732. flex-shrink: 0;
  21733. display: none;
  21734. justify-content: center;
  21735. align-items: center
  21736. }
  21737. .initial-offers-wrapper .show {
  21738. animation-duration: 1s;
  21739. animation-name: slidein
  21740. }
  21741. .initial-offers-wrapper .active {
  21742. background: #999
  21743. }
  21744. .block-tile {
  21745. max-width: 688px;
  21746. margin: 18px auto 75px;
  21747. border-radius: 8px;
  21748. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14);
  21749. background-color: #fff;
  21750. color: #6b6272
  21751. }
  21752. @media(min-width:64em) {
  21753. .block-tile {
  21754. max-width: 780px
  21755. }
  21756. }
  21757. .your-pco .block-tile {
  21758. max-width: none
  21759. }
  21760. .line-of-business {
  21761. display: flex;
  21762. align-items: center;
  21763. min-height: 24px;
  21764. max-height: 32px;
  21765. padding-bottom: 8px
  21766. }
  21767. .line-of-business__logo {
  21768. display: flex;
  21769. width: 24px;
  21770. height: 24px;
  21771. border-radius: 50%;
  21772. margin-right: 4px
  21773. }
  21774. .scroll-slider-lifestyle-canvas-list__item-tile .block-tile {
  21775. margin: 0;
  21776. min-width: 375px
  21777. }
  21778. .scroll-slider-lifestyle-canvas-list__item-tile .ad-impression-view {
  21779. height: 100%;
  21780. display: flex;
  21781. flex-direction: column;
  21782. justify-content: flex-end
  21783. }
  21784. .lifestyle-canvas-block-tile {
  21785. width: 100%;
  21786. max-width: 780px;
  21787. display: flex;
  21788. height: 100%
  21789. }
  21790. .lifestyle-canvas-block-tile__content {
  21791. width: 50%;
  21792. min-height: 100px;
  21793. display: flex;
  21794. flex-direction: column;
  21795. justify-content: center;
  21796. position: relative;
  21797. padding: 0 16px 0 24px
  21798. }
  21799. .lifestyle-canvas-block-tile__logo {
  21800. display: flex;
  21801. max-height: 73px;
  21802. margin: 0 0 24px
  21803. }
  21804. .lifestyle-canvas-block-tile__copy,
  21805. .lifestyle-canvas-block-tile__logo-image.feature-logo,
  21806. .lifestyle-canvas-block-tile__title {
  21807. margin: 0
  21808. }
  21809. .lifestyle-canvas-block-tile__sub-copy {
  21810. margin-bottom: 0
  21811. }
  21812. .lifestyle-canvas-block-tile__main-image {
  21813. border-radius: 0 8px 8px 0
  21814. }
  21815. .lifestyle-canvas-block-tile__cta {
  21816. width: -moz-fit-content;
  21817. width: fit-content;
  21818. position: relative;
  21819. left: auto;
  21820. bottom: auto
  21821. }
  21822. .lifestyle-canvas-block-tile__cta .donate-banner__fake-cta,
  21823. .lifestyle-canvas-block-tile__cta .new-window-link,
  21824. .lifestyle-canvas-block-tile__cta .tile-item__fake-cta,
  21825. .lifestyle-canvas-block-tile__cta .video-tile__fake-cta {
  21826. text-align: left;
  21827. padding: 0;
  21828. margin-top: 16px
  21829. }
  21830. .lifestyle-canvas-block-tile__footer {
  21831. position: relative
  21832. }
  21833. .lifestyle-canvas-block-tile__footer-copy {
  21834. position: absolute;
  21835. left: 0;
  21836. top: 0
  21837. }
  21838. .lifestyle-canvas-block-tile .image-set {
  21839. width: 50%;
  21840. display: flex
  21841. }
  21842. .grid-view__container {
  21843. position: relative;
  21844. width: 100%;
  21845. max-width: 285px
  21846. }
  21847. .grid-view__lifestyle-canvas-marketing,
  21848. .grid-view__lifestyle-canvas-products {
  21849. display: grid;
  21850. color: #403840;
  21851. margin: 0;
  21852. padding: 0
  21853. }
  21854. .grid-view__lifestyle-canvas-marketing li,
  21855. .grid-view__lifestyle-canvas-products li {
  21856. list-style-type: none
  21857. }
  21858. .grid-view__lifestyle-canvas-products {
  21859. overflow: hidden;
  21860. grid-template-columns: repeat(2, 1fr);
  21861. grid-template-rows: repeat(2, 1fr);
  21862. grid-gap: 1px;
  21863. width: 100%;
  21864. height: 100%;
  21865. border-radius: 8px
  21866. }
  21867. .grid-view__lifestyle-canvas-marketing {
  21868. grid-gap: 16px;
  21869. height: 100%;
  21870. grid-template-rows: 1fr 1fr
  21871. }
  21872. .grid-view__lifestyle-canvas-marketing .grid-marketing-tile {
  21873. height: 100%
  21874. }
  21875. .grid-view__separator {
  21876. position: absolute;
  21877. top: 0;
  21878. left: 0;
  21879. background-color: #9e93a6;
  21880. opacity: .32;
  21881. height: 100%;
  21882. width: 100%;
  21883. z-index: -1;
  21884. border-radius: 8px
  21885. }
  21886. .grid-product-tile {
  21887. padding: 16px;
  21888. height: 100%;
  21889. min-width: 144px;
  21890. text-align: center;
  21891. display: grid;
  21892. align-content: space-evenly
  21893. }
  21894. .grid-product-tile__image {
  21895. width: 80px;
  21896. height: 80px;
  21897. margin: 0 auto 8px
  21898. }
  21899. .grid-product-tile a[type=TEXT] {
  21900. padding: 0;
  21901. text-decoration: none
  21902. }
  21903. .grid-marketing-tile__container {
  21904. display: flex;
  21905. width: 100%;
  21906. height: calc(100% - 32px);
  21907. min-height: 136px;
  21908. align-items: center;
  21909. justify-content: space-between;
  21910. border-radius: 8px
  21911. }
  21912. .grid-marketing-tile__content {
  21913. padding: 16px 16px 16px 24px;
  21914. width: 225px
  21915. }
  21916. .cancel-subscription__modal-content .pcoi-error-tile .grid-marketing-tile__content p:first-of-type,
  21917. .enrol-flow .grid-marketing-tile__content .flow-progress-bar__title,
  21918. .grid-marketing-tile__content .activation-card-display__points-label,
  21919. .grid-marketing-tile__content .billing-history__date,
  21920. .grid-marketing-tile__content .cancel-subscription__modal-content .pcoi-error-tile p:first-of-type,
  21921. .grid-marketing-tile__content .category-btn,
  21922. .grid-marketing-tile__content .deals-for-you-tile__item,
  21923. .grid-marketing-tile__content .enrol-flow .flow-progress-bar__title,
  21924. .grid-marketing-tile__content .esso-redemption-earning-card__subtitle,
  21925. .grid-marketing-tile__content .esso-redemption-pcf__money-subtitle,
  21926. .grid-marketing-tile__content .esso-redemption-redeem-cards__text,
  21927. .grid-marketing-tile__content .expandable-form-wrapper__title,
  21928. .grid-marketing-tile__content .initial-offers-slider__slider-container__slide-content--screen-1--button-imageHolder,
  21929. .grid-marketing-tile__content .initial-offers-slider__slider-container__slide-content--screen-1--button-textHolder,
  21930. .grid-marketing-tile__content .initial-offers-slider__slider-container__slide-content--screen-rest--button-imageHolder,
  21931. .grid-marketing-tile__content .initial-offers-slider__slider-container__slide-content--screen-rest--button-textHolder,
  21932. .grid-marketing-tile__content .initial-offers-slider__slider-container__slide-content__question,
  21933. .grid-marketing-tile__content .no-subscription-plan__content h3,
  21934. .grid-marketing-tile__content .offer-content-group-carousel--faded.offer-content-group-carousel--modal .offer__reward--earned,
  21935. .grid-marketing-tile__content .offer-content-group-carousel .offer__text,
  21936. .grid-marketing-tile__content .offer__text--carousel,
  21937. .grid-marketing-tile__content .quest-offer-child-offer .continuity-offer__content-group .offer__reward,
  21938. .grid-marketing-tile__content .quest-offer-child-offer .hero-continuity-offer__content-group .offer__reward,
  21939. .grid-marketing-tile__content .quest-offer-child-offer .hero-product-offer__content-group .offer__reward,
  21940. .grid-marketing-tile__content .quest-offer-child-offer.offer--faded .offer__reward--earned,
  21941. .grid-marketing-tile__content .quest-offer-child-offer .product-offer__content-group .offer__reward,
  21942. .grid-marketing-tile__content .subscription-plan__content h3,
  21943. .grid-marketing-tile__content .type-ds-headline,
  21944. .no-subscription-plan__content .grid-marketing-tile__content h3,
  21945. .offer-content-group-carousel--faded.offer-content-group-carousel--modal .grid-marketing-tile__content .offer__reward--earned,
  21946. .offer-content-group-carousel .grid-marketing-tile__content .offer__text,
  21947. .quest-offer-child-offer .continuity-offer__content-group .grid-marketing-tile__content .offer__reward,
  21948. .quest-offer-child-offer .hero-continuity-offer__content-group .grid-marketing-tile__content .offer__reward,
  21949. .quest-offer-child-offer .hero-product-offer__content-group .grid-marketing-tile__content .offer__reward,
  21950. .quest-offer-child-offer.offer--faded .grid-marketing-tile__content .offer__reward--earned,
  21951. .quest-offer-child-offer .product-offer__content-group .grid-marketing-tile__content .offer__reward,
  21952. .subscription-plan__content .grid-marketing-tile__content h3 {
  21953. margin: 0
  21954. }
  21955. .grid-marketing-tile__content a {
  21956. margin: 4px 0 0
  21957. }
  21958. .grid-marketing-tile__content a[type=TEXT] {
  21959. padding: 0;
  21960. text-align: left
  21961. }
  21962. .grid-marketing-tile__image {
  21963. width: 120px;
  21964. height: 100%;
  21965. overflow: hidden;
  21966. border-radius: 0 8px 8px 0
  21967. }
  21968. .grid-marketing-tile__image .image-set__image {
  21969. width: 100%
  21970. }
  21971. .partnership-tile {
  21972. max-width: 688px;
  21973. margin: 0 auto 20px
  21974. }
  21975. @media(min-width:64em) {
  21976. .partnership-tile {
  21977. max-width: 780px
  21978. }
  21979. }
  21980. .partnership-tile__inner {
  21981. background-color: #fff;
  21982. display: flex;
  21983. text-decoration: inherit;
  21984. position: relative;
  21985. border-radius: 8px;
  21986. border: 1px solid #efeef1;
  21987. box-shadow: 0 1px 5px rgba(158, 147, 166, .2), 0 3px 4px rgba(158, 147, 166, .12), 0 2px 4px rgba(158, 147, 166, .14)
  21988. }
  21989. .partnership-tile__clickable {
  21990. border-radius: 8px;
  21991. display: flex;
  21992. width: 100%;
  21993. transition: box-shadow .3s ease-in-out
  21994. }
  21995. .partnership-tile__clickable:focus,
  21996. .partnership-tile__clickable:focus-within,
  21997. .partnership-tile__clickable:hover {
  21998. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  21999. cursor: pointer
  22000. }
  22001. .partnership-tile__clickable:focus {
  22002. outline: none
  22003. }
  22004. .partnership-tile__footnote {
  22005. color: #655c6c;
  22006. margin: 16px 0 0
  22007. }
  22008. .partnership-tile__modal-content {
  22009. max-width: 328px;
  22010. position: relative;
  22011. border-radius: 16px;
  22012. background-color: #fff;
  22013. margin: 0 20px;
  22014. overflow: hidden
  22015. }
  22016. @media(min-width:48em) {
  22017. .partnership-tile__modal-content {
  22018. max-width: 508px
  22019. }
  22020. }
  22021. .partnership-tile__modal-content .pco-modal-content__close {
  22022. top: 10px;
  22023. right: 5px
  22024. }
  22025. @media(min-width:48em) {
  22026. .partnership-tile__modal-content .pco-modal-content__close {
  22027. right: 10px
  22028. }
  22029. }
  22030. .partnership-tile__modal-content .pco-modal-content__close svg {
  22031. fill: #191919;
  22032. stroke: #191919
  22033. }
  22034. .partnership-tile__modal-back-button {
  22035. position: absolute;
  22036. top: 10px;
  22037. left: 5px;
  22038. border-radius: 100%;
  22039. background: #fff;
  22040. padding: 8px;
  22041. border: 2px solid #fff
  22042. }
  22043. @media(min-width:48em) {
  22044. .partnership-tile__modal-back-button {
  22045. left: 12px
  22046. }
  22047. }
  22048. .partnership-tile__modal-back-button svg {
  22049. width: 14px;
  22050. height: auto;
  22051. fill: #191919;
  22052. stroke: #191919;
  22053. stroke-width: 0
  22054. }
  22055. .partnership-tile__modal-back-button:focus,
  22056. .partnership-tile__modal-back-button:focus-within,
  22057. .partnership-tile__modal-back-button:hover {
  22058. outline: none;
  22059. padding: 8px;
  22060. border: 2px solid #615395
  22061. }
  22062. .partnership-tile__modal-back-button:focus-within svg,
  22063. .partnership-tile__modal-back-button:focus svg,
  22064. .partnership-tile__modal-back-button:hover svg {
  22065. fill: #615395;
  22066. stroke: #615395
  22067. }
  22068. .partnership-tile__modal-back-button:active {
  22069. background: #403840;
  22070. border: 2px solid #403840
  22071. }
  22072. .partnership-tile__modal-back-button:active svg {
  22073. fill: #fff;
  22074. stroke: #fff
  22075. }
  22076. .partnership-tile-content {
  22077. display: flex;
  22078. justify-content: space-between;
  22079. align-items: flex-start;
  22080. width: 100%
  22081. }
  22082. .partnership-tile-content__content {
  22083. display: flex;
  22084. flex-direction: column;
  22085. text-align: left;
  22086. margin: 16px 8px 16px 16px;
  22087. width: 70%;
  22088. max-width: 70%
  22089. }
  22090. @media(min-width:34.375em) {
  22091. .partnership-tile-content__content {
  22092. margin: 24px 12px 24px 24px
  22093. }
  22094. }
  22095. @media(min-width:48em) {
  22096. .partnership-tile-content__content {
  22097. width: 60%;
  22098. max-width: 60%
  22099. }
  22100. }
  22101. @media(min-width:64em) {
  22102. .partnership-tile-content__content {
  22103. width: 50%;
  22104. max-width: 50%
  22105. }
  22106. }
  22107. .partnership-tile-content__content--inner {
  22108. flex: 1;
  22109. display: flex;
  22110. flex-direction: column;
  22111. justify-content: space-between
  22112. }
  22113. .partnership-tile-content__title {
  22114. color: #403840;
  22115. display: block;
  22116. margin: 0
  22117. }
  22118. .partnership-tile-content__description {
  22119. color: #655c6c;
  22120. margin-bottom: 8px
  22121. }
  22122. @media(min-width:48em) {
  22123. .partnership-tile-content__description {
  22124. display: block;
  22125. margin-bottom: 24px
  22126. }
  22127. }
  22128. .partnership-tile-content__cta {
  22129. text-align: left;
  22130. width: -moz-max-content;
  22131. width: max-content
  22132. }
  22133. .partnership-tile-content__cta:focus {
  22134. color: #615395
  22135. }
  22136. .partnership-tile-content__img-container {
  22137. display: flex;
  22138. justify-content: flex-end;
  22139. margin: 16px 16px 16px 8px;
  22140. width: 30%;
  22141. max-width: 30%
  22142. }
  22143. @media(min-width:34.375em) {
  22144. .partnership-tile-content__img-container {
  22145. margin: 24px 24px 24px 12px
  22146. }
  22147. }
  22148. @media(min-width:48em) {
  22149. .partnership-tile-content__img-container {
  22150. width: 40%;
  22151. max-width: 40%
  22152. }
  22153. }
  22154. @media(min-width:64em) {
  22155. .partnership-tile-content__img-container {
  22156. width: 50%;
  22157. max-width: 50%
  22158. }
  22159. }
  22160. .partnership-tile-content__img {
  22161. display: flex;
  22162. justify-content: flex-end
  22163. }
  22164. .partnership-tile-content__img__content {
  22165. border-radius: 0 8px 8px 0;
  22166. -o-object-fit: contain;
  22167. object-fit: contain;
  22168. display: block;
  22169. max-height: 236px;
  22170. width: 100%
  22171. }
  22172. .partnership-perk {
  22173. background-color: #fff;
  22174. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  22175. box-sizing: border-box;
  22176. border-radius: 8px;
  22177. display: flex;
  22178. flex-direction: column;
  22179. transition: .3s ease;
  22180. width: 252px
  22181. }
  22182. .partnership-perk__clickable {
  22183. cursor: pointer;
  22184. display: flex;
  22185. height: 100%;
  22186. text-align: left;
  22187. border-radius: 8px;
  22188. transition: box-shadow .3s ease-in-out
  22189. }
  22190. .partnership-perk__clickable:focus,
  22191. .partnership-perk__clickable:focus-within,
  22192. .partnership-perk__clickable:hover {
  22193. box-shadow: 0 2px 18px rgba(158, 147, 166, .24), 0 10px 12px rgba(158, 147, 166, .24)
  22194. }
  22195. .partnership-perk-content {
  22196. display: flex;
  22197. flex-direction: column;
  22198. height: 100%
  22199. }
  22200. .partnership-perk-content__hero-image-container {
  22201. display: flex;
  22202. align-items: center;
  22203. justify-content: center;
  22204. height: 140px;
  22205. width: 100%
  22206. }
  22207. .partnership-perk-content__hero-image {
  22208. border-radius: 8px 8px 0 0;
  22209. height: 100%;
  22210. width: auto
  22211. }
  22212. .partnership-perk-content__body {
  22213. height: 100%;
  22214. display: flex;
  22215. flex-direction: column;
  22216. align-items: flex-start;
  22217. padding: 16px 16px 24px
  22218. }
  22219. .partnership-perk-content__pill-text {
  22220. background-color: #fdefd2;
  22221. border-radius: 25px;
  22222. color: #000;
  22223. margin-bottom: 8px;
  22224. padding: 4px 10px;
  22225. width: -moz-fit-content;
  22226. width: fit-content
  22227. }
  22228. .partnership-perk-content__title {
  22229. color: #403840;
  22230. margin-bottom: 12px
  22231. }
  22232. .partnership-perk-content__description {
  22233. color: #655c6c;
  22234. margin-bottom: 18px
  22235. }
  22236. .partnership-perk-content__cta {
  22237. margin-top: auto
  22238. }
  22239. .partnership-perk-content__cta:focus {
  22240. color: #615395
  22241. }
  22242. .redeemable-perk-content__title {
  22243. color: #ac342a
  22244. }
  22245. .redeemable-perk-content__description {
  22246. color: #403840;
  22247. margin: 12px 0
  22248. }
  22249. .redeemable-perk-content__pill-text {
  22250. background-color: #f9dada;
  22251. border-radius: 25px;
  22252. color: #403840;
  22253. padding: 2px 8px;
  22254. margin-bottom: 16px;
  22255. width: -moz-fit-content;
  22256. width: fit-content
  22257. }
  22258. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button,
  22259. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button,
  22260. .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link,
  22261. .redeemable-perk-content__cta.button,
  22262. .redeemable-perk-content__cta.household-grid__invite-button,
  22263. .redeemable-perk-content__cta.link--theme-button,
  22264. .redeemable-perk-content__cta.link--theme-button--large-primary,
  22265. .redeemable-perk-content__cta.link--theme-button--large-secondary,
  22266. .redeemable-perk-content__cta.link--theme-button--small-primary,
  22267. .redeemable-perk-content__cta.link--theme-button--small-secondary,
  22268. .redeemable-perk-content__cta.link--theme-button-gray,
  22269. .redeemable-perk-content__cta.link--theme-button-red,
  22270. .redeemable-perk-content__cta.link--theme-button-transparent,
  22271. .redeemable-perk-content__cta.link--theme-button-transparent-white,
  22272. .redeemable-perk-content__cta.link--theme-button-white,
  22273. .redeemable-perk-content__cta.load-shop-pay-header__link,
  22274. .redeemable-perk-content__cta.load-shop-pay-module__link,
  22275. .redeemable-perk-content__cta.marketing-page-header__link,
  22276. .redeemable-perk-content__cta.marketing-page-module__link,
  22277. .redeemable-perk-content__cta.partnership-perk-details__cta,
  22278. .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta,
  22279. .redeemable-perk-content__cta.points-days__cta {
  22280. color: #157a77;
  22281. margin-top: auto
  22282. }
  22283. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button:active,
  22284. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button:focus,
  22285. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-off-button:hover,
  22286. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button:active,
  22287. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button:focus,
  22288. .account-setting--security .redeemable-perk-content__cta.account-setting__turn-on-button:hover,
  22289. .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link:active,
  22290. .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link:focus,
  22291. .points-days-cta-section__content .redeemable-perk-content__cta.cta-section__link:hover,
  22292. .redeemable-perk-content__cta.button:active,
  22293. .redeemable-perk-content__cta.button:focus,
  22294. .redeemable-perk-content__cta.button:hover,
  22295. .redeemable-perk-content__cta.household-grid__invite-button:active,
  22296. .redeemable-perk-content__cta.household-grid__invite-button:focus,
  22297. .redeemable-perk-content__cta.household-grid__invite-button:hover,
  22298. .redeemable-perk-content__cta.link--theme-button--large-primary:active,
  22299. .redeemable-perk-content__cta.link--theme-button--large-primary:focus,
  22300. .redeemable-perk-content__cta.link--theme-button--large-primary:hover,
  22301. .redeemable-perk-content__cta.link--theme-button--large-secondary:active,
  22302. .redeemable-perk-content__cta.link--theme-button--large-secondary:focus,
  22303. .redeemable-perk-content__cta.link--theme-button--large-secondary:hover,
  22304. .redeemable-perk-content__cta.link--theme-button--small-primary:active,
  22305. .redeemable-perk-content__cta.link--theme-button--small-primary:focus,
  22306. .redeemable-perk-content__cta.link--theme-button--small-primary:hover,
  22307. .redeemable-perk-content__cta.link--theme-button--small-secondary:active,
  22308. .redeemable-perk-content__cta.link--theme-button--small-secondary:focus,
  22309. .redeemable-perk-content__cta.link--theme-button--small-secondary:hover,
  22310. .redeemable-perk-content__cta.link--theme-button-gray:active,
  22311. .redeemable-perk-content__cta.link--theme-button-gray:focus,
  22312. .redeemable-perk-content__cta.link--theme-button-gray:hover,
  22313. .redeemable-perk-content__cta.link--theme-button-red:active,
  22314. .redeemable-perk-content__cta.link--theme-button-red:focus,
  22315. .redeemable-perk-content__cta.link--theme-button-red:hover,
  22316. .redeemable-perk-content__cta.link--theme-button-transparent-white:active,
  22317. .redeemable-perk-content__cta.link--theme-button-transparent-white:focus,
  22318. .redeemable-perk-content__cta.link--theme-button-transparent-white:hover,
  22319. .redeemable-perk-content__cta.link--theme-button-transparent:active,
  22320. .redeemable-perk-content__cta.link--theme-button-transparent:focus,
  22321. .redeemable-perk-content__cta.link--theme-button-transparent:hover,
  22322. .redeemable-perk-content__cta.link--theme-button-white:active,
  22323. .redeemable-perk-content__cta.link--theme-button-white:focus,
  22324. .redeemable-perk-content__cta.link--theme-button-white:hover,
  22325. .redeemable-perk-content__cta.link--theme-button:active,
  22326. .redeemable-perk-content__cta.link--theme-button:focus,
  22327. .redeemable-perk-content__cta.link--theme-button:hover,
  22328. .redeemable-perk-content__cta.load-shop-pay-header__link:active,
  22329. .redeemable-perk-content__cta.load-shop-pay-header__link:focus,
  22330. .redeemable-perk-content__cta.load-shop-pay-header__link:hover,
  22331. .redeemable-perk-content__cta.load-shop-pay-module__link:active,
  22332. .redeemable-perk-content__cta.load-shop-pay-module__link:focus,
  22333. .redeemable-perk-content__cta.load-shop-pay-module__link:hover,
  22334. .redeemable-perk-content__cta.marketing-page-header__link:active,
  22335. .redeemable-perk-content__cta.marketing-page-header__link:focus,
  22336. .redeemable-perk-content__cta.marketing-page-header__link:hover,
  22337. .redeemable-perk-content__cta.marketing-page-module__link:active,
  22338. .redeemable-perk-content__cta.marketing-page-module__link:focus,
  22339. .redeemable-perk-content__cta.marketing-page-module__link:hover,
  22340. .redeemable-perk-content__cta.partnership-perk-details__cta:active,
  22341. .redeemable-perk-content__cta.partnership-perk-details__cta:focus,
  22342. .redeemable-perk-content__cta.partnership-perk-details__cta:hover,
  22343. .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta:active,
  22344. .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta:focus,
  22345. .redeemable-perk-content__cta.partnership-perk-redeemed-success__cta:hover,
  22346. .redeemable-perk-content__cta.points-days__cta:active,
  22347. .redeemable-perk-content__cta.points-days__cta:focus,
  22348. .redeemable-perk-content__cta.points-days__cta:hover {
  22349. color: #615395
  22350. }
  22351. .partnership-perks-list {
  22352. display: flex;
  22353. flex-direction: column;
  22354. height: 80vh;
  22355. width: 328px
  22356. }
  22357. @media(min-width:48em) {
  22358. .partnership-perks-list {
  22359. width: 508px
  22360. }
  22361. }
  22362. .partnership-perks-list__screen-title {
  22363. text-align: center;
  22364. margin: 16px 0 32px
  22365. }
  22366. .partnership-perks-list__container {
  22367. overflow-x: hidden;
  22368. overflow-y: auto;
  22369. padding: 2px 16px 16px
  22370. }
  22371. @media(min-width:48em) {
  22372. .partnership-perks-list__container {
  22373. padding: 2px 24px 24px
  22374. }
  22375. }
  22376. .partnership-perks-list__ad-view-wrapper {
  22377. margin: 0 0 8px;
  22378. width: 296px
  22379. }
  22380. @media(min-width:48em) {
  22381. .partnership-perks-list__ad-view-wrapper {
  22382. width: 460px
  22383. }
  22384. }
  22385. .partnership-perks-list__ad-view-wrapper:last-child {
  22386. margin-bottom: 0
  22387. }
  22388. .partnership-perks-list .partnership-perk {
  22389. width: 296px
  22390. }
  22391. @media(min-width:48em) {
  22392. .partnership-perks-list .partnership-perk {
  22393. width: 460px
  22394. }
  22395. }
  22396. .partnership-perks-list .partnership-perk-content {
  22397. display: flex;
  22398. flex-direction: row;
  22399. align-items: center;
  22400. padding: 15px
  22401. }
  22402. @media(min-width:48em) {
  22403. .partnership-perks-list .partnership-perk-content {
  22404. padding: 20px;
  22405. padding: 20px 24px
  22406. }
  22407. }
  22408. .partnership-perks-list .partnership-perk-content__icon {
  22409. align-self: flex-start;
  22410. width: 79px;
  22411. height: 79px
  22412. }
  22413. @media(min-width:48em) {
  22414. .partnership-perks-list .partnership-perk-content__icon {
  22415. align-self: center;
  22416. width: 109px;
  22417. height: 109px
  22418. }
  22419. }
  22420. .partnership-perks-list .partnership-perk-content__body {
  22421. padding: 0;
  22422. margin-left: 24px
  22423. }
  22424. @media(min-width:48em) {
  22425. .partnership-perks-list .partnership-perk-content__body {
  22426. margin-left: 30px
  22427. }
  22428. }
  22429. .partnership-perks-list .partnership-perk-content__title {
  22430. margin-bottom: 8px
  22431. }
  22432. .partnership-perks-list .partnership-perk-content__description {
  22433. margin-bottom: 0
  22434. }
  22435. .partnership-perks-list .partnership-perk-content__cta {
  22436. margin-top: 8px
  22437. }
  22438. .partnership-perk-details {
  22439. display: flex;
  22440. flex-direction: column;
  22441. padding-top: 16px;
  22442. max-height: 80vh
  22443. }
  22444. .partnership-perk-details__screen-title {
  22445. text-align: center;
  22446. margin: 0 0 24px
  22447. }
  22448. @media(min-width:48em) {
  22449. .partnership-perk-details__screen-title {
  22450. margin: 0 0 32px
  22451. }
  22452. }
  22453. .partnership-perk-details__header {
  22454. display: flex;
  22455. align-items: center;
  22456. padding: 0 16px 24px;
  22457. border-bottom: 1px solid rgba(158, 147, 166, .4)
  22458. }
  22459. @media(min-width:48em) {
  22460. .partnership-perk-details__header {
  22461. padding: 0 24px 24px
  22462. }
  22463. }
  22464. .partnership-perk-details__icon-container {
  22465. height: 64px;
  22466. margin-right: 16px
  22467. }
  22468. .partnership-perk-details__icon {
  22469. width: auto;
  22470. height: 100%
  22471. }
  22472. .partnership-perk-details__header-text {
  22473. display: flex;
  22474. flex-direction: column
  22475. }
  22476. .partnership-perk-details__title {
  22477. margin: 0
  22478. }
  22479. .partnership-perk-details__description {
  22480. margin: 4px 0 0;
  22481. color: #191919
  22482. }
  22483. .partnership-perk-details__details-container {
  22484. overflow-y: auto
  22485. }
  22486. .partnership-perk-details__redemption-details {
  22487. padding: 0 16px
  22488. }
  22489. .partnership-perk-details__details {
  22490. padding: 0 16px;
  22491. color: #403840
  22492. }
  22493. @media(min-width:48em) {
  22494. .partnership-perk-details__details {
  22495. padding: 0 24px
  22496. }
  22497. }
  22498. .partnership-perk-details__button-container {
  22499. border-top: 1px solid rgba(158, 147, 166, .4);
  22500. position: relative;
  22501. bottom: 0;
  22502. left: 0;
  22503. padding: 16px;
  22504. width: 100%
  22505. }
  22506. @media(min-width:48em) {
  22507. .partnership-perk-details__button-container {
  22508. padding: 16px 24px
  22509. }
  22510. }
  22511. .partnership-perk-details__button {
  22512. width: 100%
  22513. }
  22514. .partnership-perk-details__button:disabled:active,
  22515. .partnership-perk-details__button:disabled:focus,
  22516. .partnership-perk-details__button:disabled:hover {
  22517. border-color: #9e93a6;
  22518. background: #9e93a6;
  22519. color: #fff
  22520. }
  22521. .partnership-perk-details__cta-container {
  22522. border-top: 1px solid rgba(158, 147, 166, .4);
  22523. text-align: center;
  22524. padding: 16px;
  22525. width: 100%;
  22526. position: relative;
  22527. bottom: 0
  22528. }
  22529. @media(min-width:48em) {
  22530. .partnership-perk-details__cta-container {
  22531. padding: 16px 24px
  22532. }
  22533. }
  22534. .partnership-perk-details__cta-container p {
  22535. color: #655c6c;
  22536. margin-top: 0;
  22537. margin-bottom: 12px
  22538. }
  22539. @media(min-width:48em) {
  22540. .partnership-perk-details__cta-container p {
  22541. margin-bottom: 16px
  22542. }
  22543. }
  22544. .partnership-perk-details__cta {
  22545. text-decoration: none;
  22546. width: 100%
  22547. }
  22548. .partnership-perk-details__cta:focus,
  22549. .partnership-perk-details__cta:hover {
  22550. border-color: #615395;
  22551. background: #615395;
  22552. color: #fff
  22553. }
  22554. .partnership-perk-details__cta:active {
  22555. border-color: #403840;
  22556. background: #403840;
  22557. color: #fff
  22558. }
  22559. .partnership-perk-details__cta:disabled {
  22560. cursor: not-allowed;
  22561. background: #9e93a6;
  22562. border-color: #9e93a6;
  22563. color: #fff
  22564. }
  22565. .redemption-perk-details {
  22566. background-color: #fdf0f0;
  22567. border-radius: 16px;
  22568. margin: 24px 0;
  22569. padding: 16px 24px
  22570. }
  22571. .redemption-perk-details__province-container {
  22572. display: flex;
  22573. flex-direction: column
  22574. }
  22575. .redemption-perk-details__province-title {
  22576. color: #191919
  22577. }
  22578. .redemption-perk-details__input-horizontal {
  22579. margin-top: 0;
  22580. margin-bottom: 16px
  22581. }
  22582. .redemption-perk-details .dropdown-group__label {
  22583. display: block;
  22584. padding-bottom: 4px
  22585. }
  22586. .redemption-perk-details .dropdown-group__label span {
  22587. color: #655c6c;
  22588. letter-spacing: normal
  22589. }
  22590. .redemption-perk-details .text-group__input-icon {
  22591. fill: #655c6c;
  22592. width: 16px;
  22593. height: 16px
  22594. }
  22595. .redemption-perk-details .dropdown-group__dropdown {
  22596. border-radius: 4px;
  22597. border: 1px solid #655c6c;
  22598. background-color: #fff;
  22599. margin-right: 0
  22600. }
  22601. .redemption-perk-details .dropdown-group__dropdown:invalid {
  22602. color: #655c6c
  22603. }
  22604. .redemption-perk-details .dropdown-group__item {
  22605. -moz-text-align-last: start;
  22606. text-align-last: start
  22607. }
  22608. .redemption-perk-subscription-cost {
  22609. display: flex;
  22610. flex-direction: column;
  22611. border-top: 1px solid #c4c4c4;
  22612. border-bottom: 1px solid #c4c4c4;
  22613. padding: 16px 0;
  22614. margin: 0
  22615. }
  22616. .redemption-perk-subscription-cost__perk-cost,
  22617. .redemption-perk-subscription-cost__tax,
  22618. .redemption-perk-subscription-cost__total {
  22619. display: flex;
  22620. justify-content: space-between;
  22621. margin: 0
  22622. }
  22623. .redemption-perk-subscription-cost__perk-cost-title,
  22624. .redemption-perk-subscription-cost__perk-cost-value,
  22625. .redemption-perk-subscription-cost__provincial-tax-title,
  22626. .redemption-perk-subscription-cost__provincial-tax-value {
  22627. color: #655c6c
  22628. }
  22629. .redemption-perk-subscription-cost__perk-cost-title,
  22630. .redemption-perk-subscription-cost__provincial-tax-title,
  22631. .redemption-perk-subscription-cost__total-title {
  22632. padding-right: 16px
  22633. }
  22634. .redemption-perk-subscription-cost__tax {
  22635. padding: 8px 0
  22636. }
  22637. .redemption-perk-subscription-cost__total-title,
  22638. .redemption-perk-subscription-cost__total-value {
  22639. color: #403840;
  22640. font-weight: 700
  22641. }
  22642. .redemption-perk-subscription-cost dd {
  22643. margin: 0
  22644. }
  22645. .redemption-perk-points {
  22646. display: flex;
  22647. flex-direction: column;
  22648. padding-top: 16px
  22649. }
  22650. .redemption-perk-points__your-points--error .redemption-perk-points__your-points-title,
  22651. .redemption-perk-points__your-points--error .redemption-perk-points__your-points-value {
  22652. color: #970012
  22653. }
  22654. .redemption-perk-points__required-points,
  22655. .redemption-perk-points__your-points {
  22656. display: flex;
  22657. justify-content: space-between
  22658. }
  22659. .redemption-perk-points__your-points-title,
  22660. .redemption-perk-points__your-points-value {
  22661. color: #403840
  22662. }
  22663. .redemption-perk-points__required-points-title,
  22664. .redemption-perk-points__your-points-title {
  22665. padding-right: 16px
  22666. }
  22667. .redemption-perk-points__required-points-title,
  22668. .redemption-perk-points__required-points-value {
  22669. color: #403840;
  22670. font-weight: 700
  22671. }
  22672. .redemption-perk-points__error {
  22673. padding-top: 4px
  22674. }
  22675. .redemption-perk-points__error-message {
  22676. color: #970012
  22677. }
  22678. .redemption-perk-points__required-points {
  22679. padding-top: 8px
  22680. }
  22681. .partnership-perk-redeemed-success {
  22682. display: flex;
  22683. flex-direction: column;
  22684. justify-content: center;
  22685. max-height: 80vh;
  22686. text-align: center
  22687. }
  22688. .partnership-perk-redeemed-success__container {
  22689. overflow-y: auto
  22690. }
  22691. .partnership-perk-redeemed-success__header-container {
  22692. padding: 16px 0 0;
  22693. background-size: cover;
  22694. background-position: 50%
  22695. }
  22696. @media(min-width:48em) {
  22697. .partnership-perk-redeemed-success__header-container {
  22698. background-size: cover
  22699. }
  22700. }
  22701. .partnership-perk-redeemed-success__screen-title {
  22702. margin: 0 0 16px
  22703. }
  22704. @media(min-width:48em) {
  22705. .partnership-perk-redeemed-success__screen-title {
  22706. margin: 0 0 24px
  22707. }
  22708. }
  22709. .partnership-perk-redeemed-success__icon-container {
  22710. height: 112px
  22711. }
  22712. .partnership-perk-redeemed-success__icon {
  22713. width: auto;
  22714. height: 100%
  22715. }
  22716. .partnership-perk-redeemed-success__body-container {
  22717. padding: 0 16px
  22718. }
  22719. .partnership-perk-redeemed-success__title {
  22720. margin: 0
  22721. }
  22722. .partnership-perk-redeemed-success__description {
  22723. margin: 4px 0 0
  22724. }
  22725. .partnership-perk-redeemed-success__footer-description {
  22726. margin: 24px 0
  22727. }
  22728. .partnership-perk-redeemed-success__cta-container {
  22729. border-top: 1px solid rgba(158, 147, 166, .4);
  22730. padding: 16px;
  22731. width: 100%;
  22732. position: relative;
  22733. bottom: 0
  22734. }
  22735. @media(min-width:48em) {
  22736. .partnership-perk-redeemed-success__cta-container {
  22737. padding: 16px 24px
  22738. }
  22739. }
  22740. .partnership-perk-redeemed-success__cta {
  22741. text-decoration: none;
  22742. width: 100%
  22743. }
  22744. .partnership-perk-redeemed-success__cta:focus,
  22745. .partnership-perk-redeemed-success__cta:hover {
  22746. border-color: #615395;
  22747. background: #615395;
  22748. color: #fff
  22749. }
  22750. .partnership-perk-redeemed-success__cta:active {
  22751. border-color: #403840;
  22752. background: #403840;
  22753. color: #fff
  22754. }
  22755. .partnership-perk-redeemed-success__cta:disabled {
  22756. cursor: not-allowed;
  22757. background: #9e93a6;
  22758. border-color: #9e93a6;
  22759. color: #fff
  22760. }
  22761. .partnership-perk-confirm-dialog {
  22762. display: flex;
  22763. flex-direction: column;
  22764. justify-content: center;
  22765. text-align: left;
  22766. max-width: 328px;
  22767. overflow-y: auto
  22768. }
  22769. @media(min-width:48em) {
  22770. .partnership-perk-confirm-dialog {
  22771. max-width: 384px
  22772. }
  22773. }
  22774. .partnership-perk-confirm-dialog__image-container {
  22775. height: 144px;
  22776. display: flex;
  22777. box-sizing: border-box;
  22778. margin: 24px 24px 0
  22779. }
  22780. .partnership-perk-confirm-dialog__image {
  22781. width: 100%;
  22782. max-height: 100%;
  22783. -o-object-fit: contain;
  22784. object-fit: contain
  22785. }
  22786. .partnership-perk-confirm-dialog__content-container {
  22787. margin: 24px 24px 8px
  22788. }
  22789. @media(min-width:48em) {
  22790. .partnership-perk-confirm-dialog__content-container {
  22791. margin: 32px 24px 8px
  22792. }
  22793. }
  22794. .partnership-perk-confirm-dialog__title {
  22795. margin: 0
  22796. }
  22797. .partnership-perk-confirm-dialog__description {
  22798. margin: 12px 0 32px
  22799. }
  22800. @media(min-width:48em) {
  22801. .partnership-perk-confirm-dialog__description {
  22802. margin: 16px 0 32px
  22803. }
  22804. }
  22805. .partnership-perk-confirm-dialog__cancel-button,
  22806. .partnership-perk-confirm-dialog__continue-button {
  22807. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  22808. width: 100%
  22809. }
  22810. .partnership-perk-confirm-dialog__cancel-button {
  22811. padding-top: 18px;
  22812. padding-bottom: 8px
  22813. }
  22814. .partnership-perk-redeemed-success-details {
  22815. background-color: #fdf0f0;
  22816. border-radius: 16px;
  22817. margin: 24px 0 0;
  22818. padding: 16px;
  22819. width: 100%
  22820. }
  22821. @media(min-width:48em) {
  22822. .partnership-perk-redeemed-success-details {
  22823. padding: 16px 24px
  22824. }
  22825. }
  22826. .partnership-perk-redeemed-success-details__redemption-info {
  22827. border-top: 1px solid rgba(158, 147, 166, .4);
  22828. display: flex;
  22829. flex-direction: column;
  22830. margin: 0;
  22831. padding-top: 16px
  22832. }
  22833. .partnership-perk-redeemed-success-details__redemption-info-item {
  22834. display: flex;
  22835. justify-content: space-between
  22836. }
  22837. .partnership-perk-redeemed-success-details__redemption-info-item:nth-child(2) {
  22838. padding: 8px 0
  22839. }
  22840. .partnership-perk-redeemed-success-details__redemption-info-key {
  22841. text-align: left
  22842. }
  22843. .partnership-perk-redeemed-success-details__redemption-info-key--bold {
  22844. font-weight: 700
  22845. }
  22846. .partnership-perk-redeemed-success-details__redemption-info-value {
  22847. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  22848. text-align: right
  22849. }
  22850. .partnership-perk-redeemed-success-details__redemption-info-value--bold {
  22851. font-weight: 700
  22852. }
  22853. .partnership-perk-redeemed-success-details__copy-code-cta {
  22854. display: flex;
  22855. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  22856. font-weight: 700;
  22857. text-decoration: none
  22858. }
  22859. .partnership-perk-redeemed-success-details__copy-code-cta:focus,
  22860. .partnership-perk-redeemed-success-details__copy-code-cta:focus-within,
  22861. .partnership-perk-redeemed-success-details__copy-code-cta:hover {
  22862. color: #615395
  22863. }
  22864. .partnership-perk-redeemed-success-details__copy-code-cta:focus-within svg,
  22865. .partnership-perk-redeemed-success-details__copy-code-cta:focus svg,
  22866. .partnership-perk-redeemed-success-details__copy-code-cta:hover svg {
  22867. stroke: #615395
  22868. }
  22869. .partnership-perk-redeemed-success-details__copy-code-icon {
  22870. width: 15px;
  22871. height: 17px;
  22872. margin: 2px 0 0 8px
  22873. }
  22874. .partnership-perk-redeemed-success-details .redemption-perk-subscription-cost {
  22875. border: 0;
  22876. padding-top: 0
  22877. }
  22878. .marketing-campaign-hero {
  22879. width: 100%;
  22880. display: flex;
  22881. flex-direction: column;
  22882. justify-content: center
  22883. }
  22884. .marketing-campaign-hero__content {
  22885. width: 100%;
  22886. min-height: 100px;
  22887. display: flex;
  22888. flex-direction: column;
  22889. padding: 16px 16px 8px;
  22890. position: relative
  22891. }
  22892. @media(min-width:48em) {
  22893. .marketing-campaign-hero__content {
  22894. padding: 30px;
  22895. max-width: 50%
  22896. }
  22897. }
  22898. .marketing-campaign-hero__logo {
  22899. display: flex;
  22900. max-height: 73px;
  22901. margin: 0 0 24px
  22902. }
  22903. .marketing-campaign-hero__logo-image.feature-logo {
  22904. margin: 0
  22905. }
  22906. .marketing-campaign-hero__title {
  22907. margin: 0 0 16px
  22908. }
  22909. .marketing-campaign-hero__copy {
  22910. margin: 0
  22911. }
  22912. .marketing-campaign-hero__sub-copy {
  22913. margin: 12px 0 32px
  22914. }
  22915. @media(min-width:48em) {
  22916. .marketing-campaign-hero__sub-copy {
  22917. margin-bottom: 0
  22918. }
  22919. }
  22920. .marketing-campaign-hero--margin {
  22921. margin-bottom: 44px
  22922. }
  22923. @media(min-width:48em) {
  22924. .marketing-campaign-hero--margin {
  22925. margin-bottom: 32px
  22926. }
  22927. }
  22928. .marketing-campaign-hero__main-image {
  22929. border-radius: 0 0 8px 8px
  22930. }
  22931. .marketing-campaign-hero__button {
  22932. width: calc(100% - 32px);
  22933. position: absolute;
  22934. bottom: -25px;
  22935. left: 16px
  22936. }
  22937. .marketing-campaign-hero__footer {
  22938. position: relative
  22939. }
  22940. .marketing-campaign-hero__footer-copy {
  22941. position: absolute;
  22942. left: 0;
  22943. top: 0
  22944. }
  22945. @media(min-width:48em) {
  22946. .marketing-campaign-hero {
  22947. flex-direction: row
  22948. }
  22949. .marketing-campaign-hero__content {
  22950. justify-content: center
  22951. }
  22952. .marketing-campaign-hero__button {
  22953. width: -moz-fit-content;
  22954. width: fit-content;
  22955. position: relative;
  22956. left: auto;
  22957. bottom: auto
  22958. }
  22959. .marketing-campaign-hero .image-set {
  22960. width: 50%
  22961. }
  22962. .marketing-campaign-hero__main-image {
  22963. border-radius: 0 8px 8px 0;
  22964. width: 100%
  22965. }
  22966. }
  22967. @media(min-width:64em) {
  22968. .marketing-campaign-hero {
  22969. width: 100%;
  22970. max-width: 780px
  22971. }
  22972. }
  22973. .block-tile-marketing_campaign_hero {
  22974. margin-bottom: 50px
  22975. }
  22976. @media(min-width:64em) {
  22977. .your-pco-section .marketing-campaign-hero {
  22978. width: 100%;
  22979. max-width: 100%
  22980. }
  22981. }
  22982. .slider-header {
  22983. display: flex;
  22984. position: relative;
  22985. width: 100%;
  22986. justify-content: center;
  22987. max-width: 688px;
  22988. margin: 0 auto
  22989. }
  22990. @media(min-width:64em) {
  22991. .slider-header {
  22992. max-width: 780px
  22993. }
  22994. }
  22995. .slider-header__text {
  22996. display: flex;
  22997. width: 100%;
  22998. justify-content: flex-start;
  22999. z-index: 3
  23000. }
  23001. .slider-header__text--heading {
  23002. margin: 0
  23003. }
  23004. .marketing-campaign-carousel__container {
  23005. margin: 0 auto
  23006. }
  23007. @media(min-width:48em) {
  23008. .marketing-campaign-carousel__container {
  23009. max-width: 688px
  23010. }
  23011. }
  23012. @media(min-width:64em) {
  23013. .marketing-campaign-carousel__container {
  23014. max-width: 780px
  23015. }
  23016. }
  23017. .marketing-campaign-carousel__container .your-pco-error__full {
  23018. margin-top: 8px
  23019. }
  23020. @media(min-width:48em) {
  23021. .marketing-campaign-carousel__container .your-pco-error__full {
  23022. margin-top: 16px
  23023. }
  23024. }
  23025. .scroll-slider-marketing-campaign .slider-holder-div {
  23026. display: block;
  23027. width: 100%
  23028. }
  23029. .scroll-slider-marketing-campaign {
  23030. margin: 16px auto
  23031. }
  23032. @media(min-width:48em) {
  23033. .scroll-slider-marketing-campaign {
  23034. margin: 23.5px auto
  23035. }
  23036. }
  23037. .scroll-slider-marketing-campaign-list--scroll {
  23038. scroll-snap-type: x mandatory;
  23039. padding: 0 0 10px
  23040. }
  23041. @media(min-width:48em) {
  23042. .scroll-slider-marketing-campaign-list--scroll {
  23043. margin: 0 calc(-50vw + 343px);
  23044. padding: 0 30px 16px calc(50vw - 343px)
  23045. }
  23046. }
  23047. @media(min-width:64em) {
  23048. .scroll-slider-marketing-campaign-list--scroll {
  23049. scrollbar-width: auto;
  23050. margin: 0;
  23051. padding: 0 0 16px
  23052. }
  23053. }
  23054. .scroll-slider-marketing-campaign-list--scroll::-webkit-scrollbar {
  23055. display: block;
  23056. height: 7px;
  23057. width: 100%
  23058. }
  23059. @media(min-width:64em) {
  23060. .scroll-slider-marketing-campaign-list--scroll::-webkit-scrollbar {
  23061. height: 12px
  23062. }
  23063. }
  23064. @media(min-width:48em) {
  23065. .scroll-slider-marketing-campaign-list--scroll::-webkit-scrollbar-track {
  23066. border-radius: 12px;
  23067. background: #e0e1e3;
  23068. margin: 0 calc(50vw - 343px)
  23069. }
  23070. }
  23071. @media(min-width:64em) {
  23072. .scroll-slider-marketing-campaign-list--scroll::-webkit-scrollbar-track {
  23073. margin: 0
  23074. }
  23075. }
  23076. .scroll-slider-marketing-campaign-list__item,
  23077. .scroll-slider-marketing-campaign-list__item-tile {
  23078. border-radius: 16px;
  23079. margin-right: 16px;
  23080. width: 272px;
  23081. height: 439px
  23082. }
  23083. @media(min-width:48em) {
  23084. .scroll-slider-marketing-campaign-list__item,
  23085. .scroll-slider-marketing-campaign-list__item-tile {
  23086. margin-right: 24px;
  23087. height: 455px
  23088. }
  23089. }
  23090. .scroll-slider-marketing-campaign-list__item {
  23091. scroll-snap-align: start;
  23092. scroll-margin-left: 16px
  23093. }
  23094. @media(min-width:48em) {
  23095. .scroll-slider-marketing-campaign-list__item {
  23096. scroll-margin-left: 24px
  23097. }
  23098. }
  23099. @media(min-width:64em) {
  23100. .scroll-slider-marketing-campaign-list__item {
  23101. scroll-snap-align: center;
  23102. scroll-margin-left: 0
  23103. }
  23104. }
  23105. .scroll-slider-marketing-campaign-list__item:first-child {
  23106. margin-left: 0
  23107. }
  23108. @media(min-width:48em) {
  23109. .scroll-slider-marketing-campaign-list__item:first-child {
  23110. margin-left: 0;
  23111. scroll-margin-left: calc(50vw - 343px)
  23112. }
  23113. }
  23114. @media(min-width:64em) {
  23115. .scroll-slider-marketing-campaign-list__item:first-child {
  23116. scroll-margin-left: 0
  23117. }
  23118. }
  23119. .scroll-slider-marketing-campaign-list__item:last-child {
  23120. margin-right: 20px
  23121. }
  23122. @media(min-width:48em) {
  23123. .scroll-slider-marketing-campaign-list__item:last-child {
  23124. margin-right: 0;
  23125. padding-right: 10px
  23126. }
  23127. }
  23128. .scroll-slider-marketing-campaign-list__button-container {
  23129. position: unset;
  23130. z-index: unset;
  23131. display: flex;
  23132. margin-top: 10px;
  23133. margin-left: 0
  23134. }
  23135. @media(min-width:48em) {
  23136. .scroll-slider-marketing-campaign-list__button-container {
  23137. margin-top: 5px
  23138. }
  23139. }
  23140. @media(min-width:64em) {
  23141. .scroll-slider-marketing-campaign-list__button-container {
  23142. margin-top: 15px
  23143. }
  23144. }
  23145. .offers-filter {
  23146. max-width: 688px;
  23147. margin: 0 auto
  23148. }
  23149. @media(min-width:64em) {
  23150. .offers-filter {
  23151. max-width: 780px
  23152. }
  23153. }
  23154. .category-btn {
  23155. color: #ac342a;
  23156. font-weight: 700;
  23157. flex: none;
  23158. padding: 8px 16px;
  23159. margin-right: 8px;
  23160. border-radius: 100px;
  23161. background-color: transparent;
  23162. border: 2px solid #ac342a
  23163. }
  23164. .category-btn:hover {
  23165. cursor: pointer
  23166. }
  23167. .category-btn-container {
  23168. margin-bottom: 12px;
  23169. padding: 12px 0;
  23170. display: flex;
  23171. flex-flow: row nowrap;
  23172. align-items: flex-start;
  23173. overflow-x: auto;
  23174. max-width: 100%
  23175. }
  23176. .category-btn:last-child {
  23177. margin-right: 0
  23178. }
  23179. .category-btn__active {
  23180. background: #f9dada;
  23181. color: #ac342a;
  23182. border-color: #f9dada;
  23183. animation: fadeIn .8s 1
  23184. }
  23185. .category-btn__active:focus {
  23186. outline: none
  23187. }
  23188. @keyframes fadeIn {
  23189. 0% {
  23190. opacity: 0
  23191. }
  23192. to {
  23193. opacity: 1
  23194. }
  23195. }
  23196. .shopping-list-header {
  23197. padding: 40px 0 0;
  23198. text-align: center;
  23199. min-height: 305px
  23200. }
  23201. .shopping-list-header__title {
  23202. color: #ac342a;
  23203. margin: 0 0 4px
  23204. }
  23205. .shopping-list-header__subTitle {
  23206. color: #6c221a;
  23207. margin: 0 auto;
  23208. max-width: 590px
  23209. }
  23210. @media(min-width:48em) {
  23211. .shopping-list-header {
  23212. min-height: 345px
  23213. }
  23214. }
  23215. @media(min-width:64em) {
  23216. .shopping-list-header {
  23217. padding: 65px 0 0
  23218. }
  23219. }
  23220. .main-header__insiders .shopping-list-header__subTitle,
  23221. .main-header__insiders .shopping-list-header__title {
  23222. color: #f9dada
  23223. }
  23224. .shopping-list__item-section {
  23225. width: 100%;
  23226. align-self: flex-start
  23227. }
  23228. .shopping-list__item-section-header {
  23229. width: 100%;
  23230. padding: 16px 24px;
  23231. background-color: #fdf0f0;
  23232. display: flex;
  23233. justify-content: space-between;
  23234. align-items: center
  23235. }
  23236. .shopping-list__item-section-header h2 {
  23237. margin: 0
  23238. }
  23239. .shopping-list__item-section--checked .shopping-list-item:last-child {
  23240. border-bottom-left-radius: 16px;
  23241. border-bottom-right-radius: 16px
  23242. }
  23243. .shopping-list__items {
  23244. padding: 0;
  23245. margin: 0
  23246. }
  23247. .shopping-list__items-banners.shopping-list-item--no-checked-items .shopping-list__items:last-child .shopping-list-item--draggable:last-child .shopping-list-item {
  23248. border-bottom-left-radius: 16px;
  23249. border-bottom-right-radius: 16px
  23250. }
  23251. .shopping-list__items-banner {
  23252. padding: 0 24px;
  23253. background-color: snow;
  23254. min-height: 52px
  23255. }
  23256. .shopping-list__items-banner svg {
  23257. max-height: 100%;
  23258. width: 100px;
  23259. padding: 10px 0;
  23260. height: 52px
  23261. }
  23262. .shopping-list__items .shopping-list-item--draggable:last-child .shopping-list-item {
  23263. border-bottom: 2px solid transparent
  23264. }
  23265. .shopping-list__items .shopping-list-item--draggable:last-child .shopping-list-item:hover {
  23266. border: 2px solid #615395
  23267. }
  23268. .search-item-card {
  23269. display: flex;
  23270. flex-direction: column;
  23271. width: 100%
  23272. }
  23273. .search-item-card__content {
  23274. display: flex;
  23275. flex-direction: column;
  23276. justify-content: center;
  23277. margin: 32px 24px 0
  23278. }
  23279. @media(min-width:48em) {
  23280. .search-item-card__content {
  23281. max-width: 304px;
  23282. margin: 32px 24px
  23283. }
  23284. }
  23285. .search-item-card__copy {
  23286. margin: 0 0 16px
  23287. }
  23288. .search-item-card__asset {
  23289. width: 375px;
  23290. max-width: 375px;
  23291. display: flex;
  23292. justify-content: center;
  23293. align-items: center;
  23294. padding: 16px 0;
  23295. margin: 0 auto
  23296. }
  23297. .search-item-card__asset .image-set {
  23298. max-width: 264px
  23299. }
  23300. @media(min-width:48em) {
  23301. .search-item-card__asset {
  23302. margin: 0 32px 0 0
  23303. }
  23304. }
  23305. @media(min-width:48em) {
  23306. .search-item-card {
  23307. flex-direction: row;
  23308. justify-content: space-between
  23309. }
  23310. }
  23311. .shopping-list-item {
  23312. display: flex;
  23313. justify-content: space-between;
  23314. align-items: center;
  23315. background-color: transparent;
  23316. border: 2px solid transparent;
  23317. border-bottom-color: rgba(158, 147, 166, .32);
  23318. padding: 18px 20px;
  23319. overflow: hidden
  23320. }
  23321. .shopping-list-item,
  23322. .shopping-list-item--draggable {
  23323. list-style-type: none
  23324. }
  23325. .shopping-list-item:active,
  23326. .shopping-list-item:hover {
  23327. border: 2px solid #615395
  23328. }
  23329. .shopping-list-item .item-button {
  23330. display: flex;
  23331. min-width: 40px;
  23332. height: 40px;
  23333. border-radius: 50%;
  23334. align-items: center;
  23335. justify-content: center;
  23336. background-color: transparent;
  23337. border: none;
  23338. cursor: pointer
  23339. }
  23340. .shopping-list-item .item-button:active,
  23341. .shopping-list-item .item-button:focus {
  23342. background-color: rgba(97, 83, 149, .0784313725);
  23343. outline: none
  23344. }
  23345. .shopping-list-item .item-button__remove-icon {
  23346. color: #655c6c;
  23347. fill: #655c6c
  23348. }
  23349. .shopping-list-item .item-button__remove-icon:active,
  23350. .shopping-list-item .item-button__remove-icon:focus {
  23351. background-color: transparent
  23352. }
  23353. .shopping-list-item .item-checkbox {
  23354. margin: 0 8px 0 0
  23355. }
  23356. .shopping-list-item .item-checkbox__icon {
  23357. display: inline-block;
  23358. overflow: hidden;
  23359. vertical-align: text-bottom;
  23360. background: #fff;
  23361. border: 2px solid #655c6c;
  23362. border-radius: 2px;
  23363. width: 20px;
  23364. height: 20px
  23365. }
  23366. .shopping-list-item .item-checkbox__icon .sprite {
  23367. position: relative;
  23368. width: 20px;
  23369. height: 20px;
  23370. left: -2px;
  23371. top: -2px;
  23372. fill: #fff
  23373. }
  23374. .shopping-list-item .item-checkbox:active .item-checkbox__icon,
  23375. .shopping-list-item .item-checkbox:focus .item-checkbox__icon {
  23376. border-color: #615395;
  23377. background-color: rgba(97, 83, 149, .0784313725)
  23378. }
  23379. .shopping-list-item .item-checkbox:active .item-checkbox__icon--checked,
  23380. .shopping-list-item .item-checkbox:focus .item-checkbox__icon--checked {
  23381. border-color: #615395;
  23382. background-color: #615395
  23383. }
  23384. .shopping-list-item .item-checkbox__icon--checked {
  23385. border: 2px solid #157a77;
  23386. background-color: #157a77
  23387. }
  23388. .shopping-list-item__flyer,
  23389. .shopping-list-item__offer {
  23390. display: flex
  23391. }
  23392. .shopping-list-item__content {
  23393. display: flex;
  23394. flex-direction: column;
  23395. flex-grow: 1;
  23396. word-break: break-word
  23397. }
  23398. .shopping-list-item__content-text {
  23399. flex-grow: 1;
  23400. padding-right: 20px
  23401. }
  23402. .shopping-list-item__content-text p {
  23403. margin: 0 0 4px
  23404. }
  23405. .shopping-list-item__content-text p:last-child {
  23406. margin-bottom: 0
  23407. }
  23408. .shopping-list-item__content-text-price {
  23409. font-weight: 600;
  23410. color: #ac342a
  23411. }
  23412. .shopping-list-item__content-text-expire,
  23413. .shopping-list-item__content-text-redeemed,
  23414. .shopping-list-item__content-text-status,
  23415. .shopping-list-item__content-text .offer-footer-date {
  23416. font-weight: 600;
  23417. color: #655c6c
  23418. }
  23419. .shopping-list-item__content-text-redeemed {
  23420. color: #157a77
  23421. }
  23422. .shopping-list-item__content-thumbnail {
  23423. display: flex;
  23424. align-items: center
  23425. }
  23426. .shopping-list-item__content-thumbnail img {
  23427. max-height: 40px;
  23428. max-width: 40px
  23429. }
  23430. .shopping-list-item__title {
  23431. cursor: pointer;
  23432. flex: 1
  23433. }
  23434. .shopping-list-item__content-name--line-through,
  23435. .shopping-list-item__content-text-price--line-through,
  23436. .shopping-list-item__title--line-through {
  23437. color: #655c6c;
  23438. text-decoration: line-through
  23439. }
  23440. .shopping-list-item__content-name--line-through,
  23441. .shopping-list-item__title--line-through {
  23442. color: #403840
  23443. }
  23444. .shopping-list-item__title-line-through {
  23445. cursor: not-allowed
  23446. }
  23447. .shopping-list-item__view-details {
  23448. cursor: pointer
  23449. }
  23450. .shopping-list-error {
  23451. display: flex;
  23452. width: 100%;
  23453. max-width: 792px;
  23454. background-color: #feeeeb;
  23455. border: 1px solid #c42d0c;
  23456. border-radius: 8px;
  23457. padding: 20px 24px;
  23458. margin: 0 auto 163px
  23459. }
  23460. .shopping-list-error__icon-container {
  23461. display: flex;
  23462. align-items: center;
  23463. justify-content: center;
  23464. width: 60px;
  23465. height: 60px;
  23466. border-radius: 50%;
  23467. background-color: #fff;
  23468. margin-right: 24px
  23469. }
  23470. .shopping-list-error__icon {
  23471. width: 40px;
  23472. height: 40px
  23473. }
  23474. .shopping-list-error__title {
  23475. margin: 0
  23476. }
  23477. .shopping-list-error__message {
  23478. margin: 8px 0
  23479. }
  23480. .shopping-list-error__reload-button {
  23481. color: #157a77
  23482. }
  23483. .text-page {
  23484. text-align: center;
  23485. width: 100%
  23486. }
  23487. .text-page__body {
  23488. padding: 32px 0
  23489. }
  23490. @media(min-width:48em) {
  23491. .text-page__body {
  23492. padding: 48px 0
  23493. }
  23494. }
  23495. .text-page__body p {
  23496. margin: 10px 0
  23497. }
  23498. .text-page__bold {
  23499. font-weight: 700
  23500. }
  23501. .text-page__link {
  23502. font-weight: 400
  23503. }
  23504. .contest-rules-page {
  23505. margin: 38px 0 80px
  23506. }
  23507. @media(min-width:48em) {
  23508. .contest-rules-page {
  23509. margin-top: 70px
  23510. }
  23511. }
  23512. .contest-rules-page__header {
  23513. margin-bottom: 35px
  23514. }
  23515. @media(min-width:48em) {
  23516. .contest-rules-page__header {
  23517. display: flex
  23518. }
  23519. }
  23520. .contest-rules-page__icon {
  23521. display: block;
  23522. margin: 0 auto 30px;
  23523. width: 130px;
  23524. height: 62px
  23525. }
  23526. @media(min-width:48em) {
  23527. .contest-rules-page__icon {
  23528. margin: 0 0 0 auto;
  23529. width: 154px;
  23530. height: 74px;
  23531. order: 2;
  23532. flex-shrink: 0
  23533. }
  23534. }
  23535. @media(min-width:48em) {
  23536. .contest-rules-page__header-content {
  23537. order: 1
  23538. }
  23539. }
  23540. .contest-rules-page__header-content .loading-placeholder {
  23541. text-align: center
  23542. }
  23543. .contest-rules-page__heading {
  23544. margin-top: 0;
  23545. text-align: center
  23546. }
  23547. .contest-rules-page__subheading {
  23548. text-align: left;
  23549. font-weight: 700
  23550. }
  23551. .contest-rules-page__section {
  23552. background-color: #fff;
  23553. padding: 30px 18px;
  23554. margin-bottom: 10px
  23555. }
  23556. @media(min-width:48em) {
  23557. .contest-rules-page__section {
  23558. padding: 40px;
  23559. margin-bottom: 20px
  23560. }
  23561. }
  23562. .contest-rules-page__section-title {
  23563. margin-top: 0
  23564. }
  23565. .contest-rules-page__body {
  23566. font-size: .875rem;
  23567. line-height: 1.571428571
  23568. }
  23569. @media(min-width:48em) {
  23570. .contest-rules-page__body {
  23571. line-height: 1.857142857
  23572. }
  23573. }
  23574. .contest-rules-page__alpha-list {
  23575. list-style-type: lower-alpha
  23576. }
  23577. .contest-rules-page__custom-ol {
  23578. list-style-type: none;
  23579. position: relative
  23580. }
  23581. .contest-rules-page__custom-ol li:before {
  23582. content: attr(data-section-number);
  23583. position: absolute;
  23584. left: 0;
  23585. width: 40px;
  23586. padding-right: 8px;
  23587. text-align: right
  23588. }
  23589. .contest-rules-page h3 {
  23590. text-decoration: underline
  23591. }
  23592. .contest-rules-page__indented-paragraph {
  23593. margin-right: 20px;
  23594. margin-left: 20px
  23595. }
  23596. @media(min-width:48em) {
  23597. .contest-rules-page__indented-paragraph {
  23598. margin-right: 40px;
  23599. margin-left: 40px
  23600. }
  23601. }
  23602. .product-love-story-details__header-container {
  23603. width: 100%;
  23604. height: 500px;
  23605. position: relative
  23606. }
  23607. .product-love-story-details__header-container:after {
  23608. content: "";
  23609. display: block;
  23610. position: absolute;
  23611. bottom: 0;
  23612. left: 0;
  23613. width: 100%;
  23614. height: 50%;
  23615. background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .8))
  23616. }
  23617. .product-love-story-details__header-image {
  23618. width: 100%;
  23619. height: 500px;
  23620. position: fixed;
  23621. display: flex;
  23622. justify-content: center;
  23623. align-items: center
  23624. }
  23625. .product-love-story-details__header-image .image {
  23626. -o-object-fit: cover;
  23627. object-fit: cover;
  23628. width: 100%;
  23629. height: 100%
  23630. }
  23631. .product-love-story-details__header-image .image.image--error {
  23632. -o-object-fit: none;
  23633. object-fit: none;
  23634. width: auto;
  23635. height: auto
  23636. }
  23637. .product-love-story-details__container,
  23638. .product-love-story-details__hero-overlay-container {
  23639. max-width: 794px;
  23640. padding: 0 16px
  23641. }
  23642. .product-love-story-details__container {
  23643. margin: 0 auto
  23644. }
  23645. .product-love-story-details__hero-overlay-container {
  23646. z-index: 2;
  23647. position: absolute;
  23648. bottom: 24px;
  23649. right: 50%;
  23650. transform: translateX(50%);
  23651. width: 100%
  23652. }
  23653. .product-love-story-details__hero-overlay {
  23654. display: flex;
  23655. flex-direction: column
  23656. }
  23657. .product-love-story-details__badge {
  23658. background-color: #fff;
  23659. color: #403840;
  23660. padding: 4px 8px;
  23661. text-align: center;
  23662. border-radius: 25px;
  23663. font-weight: 700
  23664. }
  23665. .product-love-story-details__heading {
  23666. border-bottom: 1px solid #fff;
  23667. color: #fff;
  23668. margin: 0 0 16px;
  23669. padding-bottom: 16px
  23670. }
  23671. .product-love-story-details__product-information {
  23672. display: flex;
  23673. gap: 10px;
  23674. align-items: center
  23675. }
  23676. .product-love-story-details__product-image {
  23677. width: 48px;
  23678. height: 48px;
  23679. background-color: #f4f1f6;
  23680. margin: 0 auto
  23681. }
  23682. .product-love-story-details__product-image img {
  23683. width: 100%
  23684. }
  23685. .product-love-story-details__product-image-container {
  23686. width: 64px;
  23687. height: 64px;
  23688. background-color: #fff;
  23689. text-align: center;
  23690. border-radius: 5px;
  23691. padding-top: 7px
  23692. }
  23693. .product-love-story-details__title {
  23694. margin: 0;
  23695. color: #fff
  23696. }
  23697. .product-love-story-details__link.product-love-story-details__link {
  23698. color: #fff;
  23699. text-align: left
  23700. }
  23701. .product-love-story-details__background-container {
  23702. background: #fff;
  23703. z-index: 2;
  23704. margin-top: -8px;
  23705. border-radius: 8px 8px 0 0
  23706. }
  23707. .product-love-story-details__content {
  23708. padding-top: 32px
  23709. }
  23710. .product-love-story-details__content img {
  23711. -o-object-fit: cover;
  23712. object-fit: cover;
  23713. margin-bottom: 32px;
  23714. width: 100%
  23715. }
  23716. .product-love-story-details__body,
  23717. .product-love-story-details__headline {
  23718. margin-top: 0
  23719. }
  23720. .product-love-story-details__headline {
  23721. margin-bottom: 4px
  23722. }
  23723. .product-love-story-details__body {
  23724. margin-bottom: 32px
  23725. }
  23726. .product-love-story-details__shop-product-cta-container {
  23727. width: -moz-fit-content;
  23728. width: fit-content;
  23729. z-index: 5;
  23730. position: sticky;
  23731. margin-bottom: 32px;
  23732. left: 50%;
  23733. transform: translateX(-50%);
  23734. bottom: 32px
  23735. }
  23736. .product-love-story-placeholder__hero {
  23737. width: 100%;
  23738. height: 500px;
  23739. background-color: #f4f1f6;
  23740. margin-bottom: 32px
  23741. }
  23742. .product-love-story-placeholder__content {
  23743. max-width: 794px;
  23744. margin: 0 auto
  23745. }
  23746. @media(max-width:47.99em) {
  23747. .product-love-story-placeholder__content {
  23748. padding: 0 16px
  23749. }
  23750. }
  23751. @media(min-width:48em)and (max-width:63.99em) {
  23752. .product-love-story-placeholder__content {
  23753. margin: 0 16px
  23754. }
  23755. }
  23756. .product-love-story-placeholder__container {
  23757. margin-bottom: 30px
  23758. }
  23759. .product-love-story-placeholder__loading-circle-container {
  23760. margin-bottom: 24px
  23761. }
  23762. .product-love-story-placeholder__loading-circle {
  23763. width: 48px;
  23764. height: 48px;
  23765. background-color: #f4f1f6;
  23766. border-radius: 50%
  23767. }
  23768. .product-love-story-placeholder__loading-actions-container {
  23769. display: flex;
  23770. justify-content: space-around;
  23771. border-bottom: 1px solid #f4f1f6;
  23772. margin: 0 0 24px
  23773. }
  23774. @media(max-width:47.99em) {
  23775. .product-love-story-placeholder__placeholder-content {
  23776. width: 60%
  23777. }
  23778. }
  23779. .ad-unit {
  23780. display: block;
  23781. width: 100%;
  23782. margin: 30px 0
  23783. }
  23784. .ad-unit__inner {
  23785. width: 100%;
  23786. display: flex;
  23787. flex-direction: column;
  23788. align-items: center
  23789. }
  23790. .ad-unit--forecast {
  23791. margin: 0
  23792. }
  23793. .ad-unit--dashboard {
  23794. margin: -28px 0 -56px
  23795. }
  23796. @media(min-width:64em) {
  23797. .ad-unit--dashboard {
  23798. margin: -45px 0 -60px
  23799. }
  23800. }
  23801. .ad-unit__link-wrapper {
  23802. position: relative;
  23803. min-width: -moz-fit-content;
  23804. min-width: fit-content;
  23805. min-height: -moz-fit-content;
  23806. min-height: fit-content
  23807. }
  23808. .ad-unit__link {
  23809. position: absolute;
  23810. width: 100%;
  23811. height: 100%;
  23812. top: 0;
  23813. left: 0;
  23814. z-index: 1;
  23815. text-indent: -99999px;
  23816. overflow: hidden
  23817. }
  23818. .ad-unit__sponsored-label {
  23819. text-align: right;
  23820. margin-top: 6px;
  23821. color: #655c6c;
  23822. text-transform: capitalize
  23823. }
  23824. .esso-redemption {
  23825. position: relative;
  23826. overflow: hidden;
  23827. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/esso-redemption/esso-redemption-header-swoop-mobile.svg);
  23828. background-size: 100%;
  23829. background-repeat: no-repeat;
  23830. background-position: top;
  23831. background-color: snow
  23832. }
  23833. @media(min-width:48em) {
  23834. .esso-redemption {
  23835. background-image: url(https://dis-prod.assetful.loblaw.ca/content/dam/loblaw-companies-limited/creative-assets/pc-optimum/esso-redemption/esso-redemption-header-swoop-desktop.svg)
  23836. }
  23837. }
  23838. .esso-redemption-header {
  23839. padding: 40px 0 64px
  23840. }
  23841. @media(min-width:64em) {
  23842. .esso-redemption-header {
  23843. padding: 80px 0 170px
  23844. }
  23845. }
  23846. .esso-redemption-header__inner-container {
  23847. display: flex;
  23848. flex-direction: column;
  23849. justify-content: center;
  23850. align-items: center;
  23851. position: relative;
  23852. margin: 0 auto;
  23853. min-height: 585px
  23854. }
  23855. @media(min-width:48em) {
  23856. .esso-redemption-header__inner-container {
  23857. flex-direction: row;
  23858. justify-content: space-between;
  23859. max-width: 996px;
  23860. min-height: 504px
  23861. }
  23862. }
  23863. .esso-redemption-header__body {
  23864. display: flex;
  23865. flex-direction: column;
  23866. justify-content: center;
  23867. max-width: 100%
  23868. }
  23869. @media(min-width:48em) {
  23870. .esso-redemption-header__body {
  23871. max-width: 486px
  23872. }
  23873. }
  23874. .esso-redemption-header__title {
  23875. margin: 8px 0 16px
  23876. }
  23877. @media(min-width:64em) {
  23878. .esso-redemption-header__title {
  23879. margin: 8px 0 32px
  23880. }
  23881. }
  23882. .esso-redemption-header__title sup {
  23883. font-size: 2rem
  23884. }
  23885. .esso-redemption-header__subtitle {
  23886. color: #655c6c;
  23887. margin: 0
  23888. }
  23889. .esso-redemption-header__image-container {
  23890. height: auto;
  23891. max-width: 560px;
  23892. margin: 40px auto 0
  23893. }
  23894. @media(min-width:48em) {
  23895. .esso-redemption-header__image-container {
  23896. margin: 0 -35px 0 0
  23897. }
  23898. }
  23899. .esso-redemption-header__image {
  23900. max-width: 100%
  23901. }
  23902. .esso-redemption-header__sprite {
  23903. position: absolute;
  23904. bottom: -180px;
  23905. right: -30px;
  23906. display: none;
  23907. height: 242px;
  23908. width: 887px
  23909. }
  23910. @media(min-width:64em) {
  23911. .esso-redemption-header__sprite {
  23912. display: block
  23913. }
  23914. }
  23915. .esso-redemption-redeem-cards {
  23916. margin-top: 0
  23917. }
  23918. .esso-redemption-redeem-cards__inner-container {
  23919. box-sizing: border-box;
  23920. margin: 0 auto;
  23921. max-width: 390px
  23922. }
  23923. @media(min-width:48em) {
  23924. .esso-redemption-redeem-cards__inner-container {
  23925. max-width: 996px
  23926. }
  23927. }
  23928. .esso-redemption-redeem-cards__body {
  23929. display: flex;
  23930. flex-direction: column;
  23931. justify-content: space-between;
  23932. align-items: center
  23933. }
  23934. @media(min-width:48em) {
  23935. .esso-redemption-redeem-cards__body {
  23936. flex-direction: row
  23937. }
  23938. }
  23939. .esso-redemption-redeem-cards__card {
  23940. border-radius: 16px;
  23941. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  23942. width: 100%;
  23943. max-width: 390px;
  23944. min-height: 380px;
  23945. position: relative
  23946. }
  23947. @media(min-width:48em) {
  23948. .esso-redemption-redeem-cards__card {
  23949. width: calc(50% - 16px);
  23950. max-width: 471px;
  23951. min-height: 505px
  23952. }
  23953. }
  23954. .esso-redemption-redeem-cards__card:first-child {
  23955. background-color: #f9dada
  23956. }
  23957. .esso-redemption-redeem-cards__card:last-child {
  23958. background-color: #ac342a
  23959. }
  23960. .esso-redemption-redeem-cards__text-container {
  23961. padding: 32px
  23962. }
  23963. @media(min-width:48em) {
  23964. .esso-redemption-redeem-cards__text-container {
  23965. padding: 40px
  23966. }
  23967. }
  23968. .esso-redemption-redeem-cards__subtitle,
  23969. .esso-redemption-redeem-cards__text,
  23970. .esso-redemption-redeem-cards__title {
  23971. margin: 0
  23972. }
  23973. .esso-redemption-redeem-cards__subtitle {
  23974. font-size: 32px;
  23975. line-height: 38px
  23976. }
  23977. @media(min-width:48em) {
  23978. .esso-redemption-redeem-cards__subtitle {
  23979. font-size: 42px;
  23980. line-height: 48px
  23981. }
  23982. }
  23983. .esso-redemption-redeem-cards__text {
  23984. color: #655c6c
  23985. }
  23986. .esso-redemption-redeem-cards__subtitle-dark,
  23987. .esso-redemption-redeem-cards__title-dark {
  23988. color: #403840
  23989. }
  23990. .esso-redemption-redeem-cards__subtitle-light,
  23991. .esso-redemption-redeem-cards__title.esso-redemption-redeem-cards__title-light {
  23992. color: #fff
  23993. }
  23994. .esso-redemption-redeem-cards__image-container {
  23995. max-width: 300px;
  23996. position: absolute;
  23997. right: 0;
  23998. bottom: 0;
  23999. padding: 32px 0 0 32px
  24000. }
  24001. @media(min-width:48em) {
  24002. .esso-redemption-redeem-cards__image-container {
  24003. max-width: 350px;
  24004. padding: 40px 0 0 40px
  24005. }
  24006. }
  24007. @media(min-width:64em) {
  24008. .esso-redemption-redeem-cards__image-container {
  24009. max-width: 400px
  24010. }
  24011. }
  24012. .esso-redemption-redeem-cards__image-container img {
  24013. display: block;
  24014. border-radius: 0 0 16px 0;
  24015. max-width: 100%
  24016. }
  24017. .esso-redemption-redeem-cards__text-divider {
  24018. color: #6c221a;
  24019. align-self: center;
  24020. text-transform: uppercase;
  24021. margin: 16px auto 8px
  24022. }
  24023. @media(min-width:48em) {
  24024. .esso-redemption-redeem-cards__text-divider {
  24025. margin: auto 10px
  24026. }
  24027. }
  24028. .esso-redemption-redeem-cards__subtext {
  24029. color: #655c6c;
  24030. margin: 16px 0 0
  24031. }
  24032. .esso-redemption-earning-card {
  24033. padding: 40px 0 120px
  24034. }
  24035. .esso-redemption-earning-card__body {
  24036. box-sizing: border-box;
  24037. background-color: #6c221a;
  24038. margin: 0 auto;
  24039. border-radius: 16px;
  24040. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  24041. width: 100%;
  24042. max-width: 390px;
  24043. min-height: 458px;
  24044. display: flex;
  24045. flex-direction: column;
  24046. justify-content: space-between
  24047. }
  24048. @media(min-width:48em) {
  24049. .esso-redemption-earning-card__body {
  24050. flex-direction: row;
  24051. max-width: 996px;
  24052. min-height: 406px
  24053. }
  24054. }
  24055. .esso-redemption-earning-card__text-container {
  24056. color: #fff;
  24057. max-width: 585px;
  24058. padding: 32px
  24059. }
  24060. @media(min-width:48em) {
  24061. .esso-redemption-earning-card__text-container {
  24062. width: 585px;
  24063. padding: 40px
  24064. }
  24065. }
  24066. .esso-redemption-earning-card__text-body {
  24067. display: flex;
  24068. flex-direction: column
  24069. }
  24070. @media(min-width:48em) {
  24071. .esso-redemption-earning-card__text-body {
  24072. align-items: flex-start
  24073. }
  24074. }
  24075. .esso-redemption-earning-card__title {
  24076. color: #fff;
  24077. margin: 0
  24078. }
  24079. .esso-redemption-earning-card__title sup {
  24080. font-size: 1rem
  24081. }
  24082. .esso-redemption-earning-card__subtitle,
  24083. .esso-redemption-earning-card__text {
  24084. color: #fff;
  24085. margin: 24px 0 0
  24086. }
  24087. .esso-redemption-earning-card__learn-more-link {
  24088. color: #fff
  24089. }
  24090. .esso-redemption-earning-card__learn-more-link:hover {
  24091. color: #f9dada
  24092. }
  24093. .esso-redemption-earning-card__cta {
  24094. text-align: center;
  24095. background-color: transparent;
  24096. padding: 10px 20px 11px;
  24097. border-radius: 47px;
  24098. border: 1px solid #fff;
  24099. color: #fff;
  24100. margin-top: 20px;
  24101. text-decoration: none
  24102. }
  24103. .esso-redemption-earning-card__cta:hover {
  24104. color: #fff;
  24105. background: hsla(0, 0%, 100%, .2)
  24106. }
  24107. .esso-redemption-earning-card__cta:active {
  24108. background: #fff;
  24109. color: #403840
  24110. }
  24111. .esso-redemption-earning-card__image-container {
  24112. max-width: 456px
  24113. }
  24114. .esso-redemption-earning-card__image-container img {
  24115. display: block;
  24116. width: 100%;
  24117. height: 285px;
  24118. border-radius: 0 0 16px 16px;
  24119. -o-object-fit: cover;
  24120. object-fit: cover
  24121. }
  24122. @media(min-width:48em) {
  24123. .esso-redemption-earning-card__image-container img {
  24124. border-radius: 0 16px 16px 0;
  24125. height: 100%
  24126. }
  24127. }
  24128. .esso-redemption-pcf {
  24129. background-color: #f4f1f6
  24130. }
  24131. .esso-redemption-pcf__body {
  24132. box-sizing: border-box;
  24133. display: flex;
  24134. flex-direction: column;
  24135. margin: 0 auto;
  24136. padding: 0;
  24137. max-width: 390px
  24138. }
  24139. @media(min-width:48em) {
  24140. .esso-redemption-pcf__body {
  24141. max-width: 996px
  24142. }
  24143. }
  24144. .esso-redemption-pcf__heading {
  24145. font-size: 2rem;
  24146. line-height: 38px;
  24147. color: #403840;
  24148. text-align: center;
  24149. align-self: center;
  24150. max-width: 677px;
  24151. margin: 40px 0 24px
  24152. }
  24153. @media(min-width:48em) {
  24154. .esso-redemption-pcf__heading {
  24155. font-size: 2.625rem;
  24156. line-height: 48px;
  24157. margin: 120px 0 72px
  24158. }
  24159. }
  24160. .esso-redemption-pcf__heading sup {
  24161. font-size: 1.25rem
  24162. }
  24163. .esso-redemption-pcf__sprite-container {
  24164. position: relative
  24165. }
  24166. .esso-redemption-pcf__sprite {
  24167. position: absolute;
  24168. display: none
  24169. }
  24170. @media(min-width:80em) {
  24171. .esso-redemption-pcf__sprite {
  24172. display: block;
  24173. opacity: .4
  24174. }
  24175. }
  24176. .esso-redemption-pcf__gas-sprite-left {
  24177. left: -64px;
  24178. top: -95px;
  24179. width: 90px;
  24180. height: 70px
  24181. }
  24182. .esso-redemption-pcf__car-sprite-left {
  24183. left: -113px;
  24184. top: -4px;
  24185. width: 90px;
  24186. height: 80px
  24187. }
  24188. .esso-redemption-pcf__title {
  24189. margin: 0
  24190. }
  24191. .esso-redemption-pcf__title sup {
  24192. font-size: .8rem
  24193. }
  24194. .esso-redemption-pcf__mscard-container {
  24195. margin: 8px 0 32px;
  24196. padding: 32px
  24197. }
  24198. @media(min-width:48em) {
  24199. .esso-redemption-pcf__mscard-container {
  24200. margin: 16px 0 48px;
  24201. padding: 40px 40px 30px
  24202. }
  24203. }
  24204. .esso-redemption-pcf__mscard-top-cards {
  24205. display: flex;
  24206. flex-direction: column;
  24207. justify-content: space-between
  24208. }
  24209. @media(min-width:48em) {
  24210. .esso-redemption-pcf__mscard-top-cards {
  24211. flex-direction: row
  24212. }
  24213. }
  24214. .esso-redemption-pcf__mscard-top-card {
  24215. display: flex;
  24216. flex-direction: column;
  24217. position: relative;
  24218. box-sizing: border-box;
  24219. border: 1px solid rgba(158, 147, 166, .16);
  24220. border-radius: 16px;
  24221. width: 100%;
  24222. padding: 24px;
  24223. margin-bottom: 24px
  24224. }
  24225. @media(min-width:48em) {
  24226. .esso-redemption-pcf__mscard-top-card {
  24227. width: calc(50% - 1rem);
  24228. max-width: 445px;
  24229. padding: 32px
  24230. }
  24231. }
  24232. .esso-redemption-pcf__mscard-image {
  24233. width: 100%;
  24234. order: 1;
  24235. margin-top: 16px
  24236. }
  24237. @media(min-width:48em) {
  24238. .esso-redemption-pcf__mscard-image {
  24239. order: 0;
  24240. margin-top: 0
  24241. }
  24242. }
  24243. .esso-redemption-pcf__mscard-label {
  24244. text-transform: uppercase;
  24245. background: #ac342a;
  24246. border-radius: 25px;
  24247. padding: 4px 8px;
  24248. position: absolute;
  24249. top: -15px;
  24250. left: 50%;
  24251. transform: translateX(-50%);
  24252. color: #fff
  24253. }
  24254. @media(min-width:48em) {
  24255. .esso-redemption-pcf__mscard-label {
  24256. transform-origin: left;
  24257. left: 15px;
  24258. top: 15px;
  24259. transform: translateX(0)
  24260. }
  24261. }
  24262. .esso-redemption-pcf__mscard-subtitle,
  24263. .esso-redemption-pcf__mscard-title {
  24264. position: relative;
  24265. line-height: 1.25rem
  24266. }
  24267. @media(min-width:48em) {
  24268. .esso-redemption-pcf__mscard-subtitle,
  24269. .esso-redemption-pcf__mscard-title {
  24270. line-height: normal
  24271. }
  24272. }
  24273. .esso-redemption-pcf__mscard-subtitle sup,
  24274. .esso-redemption-pcf__mscard-title sup {
  24275. font-size: .65rem
  24276. }
  24277. .esso-redemption-pcf__mscard-title {
  24278. margin: 12px 0 0
  24279. }
  24280. @media(min-width:48em) {
  24281. .esso-redemption-pcf__mscard-title {
  24282. line-height: 1.75rem
  24283. }
  24284. }
  24285. .esso-redemption-pcf__mscard-subtitle {
  24286. margin: 12px 0;
  24287. color: #655c6c
  24288. }
  24289. .esso-redemption-pcf__mscard-subtext,
  24290. .esso-redemption-pcf__mscard-subtext-2 {
  24291. color: #655c6c
  24292. }
  24293. .esso-redemption-pcf__mscard-subtext {
  24294. line-height: 1.25rem;
  24295. margin: 0
  24296. }
  24297. @media(min-width:48em) {
  24298. .esso-redemption-pcf__mscard-subtext {
  24299. line-height: 1.375rem
  24300. }
  24301. }
  24302. .esso-redemption-pcf__mscard-subtext-2 {
  24303. margin-bottom: 16px
  24304. }
  24305. .esso-redemption-pcf__link-container {
  24306. margin-top: 16px
  24307. }
  24308. @media(min-width:48em) {
  24309. .esso-redemption-pcf__link-container {
  24310. margin-top: 8px
  24311. }
  24312. }
  24313. .esso-redemption-pcf__link {
  24314. display: block;
  24315. color: #157a77
  24316. }
  24317. .esso-redemption-pcf__link:hover {
  24318. color: #615395
  24319. }
  24320. .esso-redemption-pcf__money {
  24321. display: flex;
  24322. flex-direction: column;
  24323. justify-content: space-between;
  24324. margin: 8px 0 40px
  24325. }
  24326. @media(min-width:48em) {
  24327. .esso-redemption-pcf__money {
  24328. flex-direction: row;
  24329. min-height: 176px;
  24330. margin: 16px 0 176px
  24331. }
  24332. }
  24333. .esso-redemption-pcf__money-text {
  24334. padding: 32px 32px 0
  24335. }
  24336. @media(min-width:48em) {
  24337. .esso-redemption-pcf__money-text {
  24338. padding: 40px 32px 25px 40px
  24339. }
  24340. }
  24341. .esso-redemption-pcf__money-subtitle {
  24342. margin: 0 0 16px;
  24343. max-width: 568px
  24344. }
  24345. .esso-redemption-pcf__money-img-container {
  24346. display: flex;
  24347. max-width: 200px;
  24348. min-height: 176px;
  24349. margin: -40px auto 0
  24350. }
  24351. @media(min-width:48em) {
  24352. .esso-redemption-pcf__money-img-container {
  24353. max-width: 220px;
  24354. margin: 0 -1px 0 0
  24355. }
  24356. }
  24357. .esso-redemption-pcf__money-img-container img {
  24358. display: block;
  24359. border-radius: 0;
  24360. -o-object-fit: cover;
  24361. object-fit: cover;
  24362. height: 100%;
  24363. width: 100%
  24364. }
  24365. @media(min-width:48em) {
  24366. .esso-redemption-pcf__money-img-container img {
  24367. border-radius: 0 16px 16px 0
  24368. }
  24369. }
  24370. .esso-redemption-pcf__money-img-container-fr {
  24371. max-width: 240px
  24372. }
  24373. .esso-redemption-pcf__car-sprite-right {
  24374. right: -10px;
  24375. bottom: 301px;
  24376. width: 90px;
  24377. height: 80px
  24378. }
  24379. .esso-redemption-pcf__gas-sprite-right {
  24380. position: absolute;
  24381. right: -28px;
  24382. bottom: 175px;
  24383. width: 90px;
  24384. height: 70px
  24385. }
  24386. .layout-card {
  24387. background-color: #fff;
  24388. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  24389. border-radius: 16px
  24390. }
  24391. p sup {
  24392. font-size: .5rem;
  24393. line-height: 0
  24394. }
  24395. .esso-redemption-ts-and-cs {
  24396. background-color: #fff;
  24397. border-top: 1px solid #f0f0f0
  24398. }
  24399. @media(min-width:64em) {
  24400. .esso-redemption-ts-and-cs {
  24401. border-top: none;
  24402. padding-bottom: 110px
  24403. }
  24404. }
  24405. .esso-redemption-ts-and-cs__accordion {
  24406. margin: 0 auto;
  24407. max-width: 1048px;
  24408. padding: 20px 0
  24409. }
  24410. @media(min-width:64em) {
  24411. .esso-redemption-ts-and-cs__accordion {
  24412. border: 1px solid #f0f0f0;
  24413. border-radius: 8px;
  24414. padding: 18px 40px
  24415. }
  24416. }
  24417. .esso-redemption-ts-and-cs__accordion h3,
  24418. .esso-redemption-ts-and-cs__accordion h4,
  24419. .esso-redemption-ts-and-cs__accordion p {
  24420. color: #655c6c;
  24421. margin: 16px 0 0
  24422. }
  24423. @media(min-width:64em) {
  24424. .esso-redemption-ts-and-cs__accordion h3,
  24425. .esso-redemption-ts-and-cs__accordion h4,
  24426. .esso-redemption-ts-and-cs__accordion p {
  24427. margin: 18px 0 0
  24428. }
  24429. }
  24430. .esso-redemption-ts-and-cs__accordion a {
  24431. color: #157a77
  24432. }
  24433. .shopping-list-item-container-button {
  24434. display: flex;
  24435. align-items: center;
  24436. background: transparent;
  24437. overflow: hidden
  24438. }
  24439. .shopping-list-item-container-button:focus,
  24440. .shopping-list-item-container-button:hover,
  24441. .shopping-list-item-container-button button:focus,
  24442. .shopping-list-item-container-button button:hover {
  24443. background: transparent
  24444. }
  24445. .shopping-list-item-container-button svg {
  24446. margin-right: 5px;
  24447. width: 18px;
  24448. height: 18px
  24449. }
  24450. .shopping-list-item-container-button .add-button-icon {
  24451. transform: rotate(45deg)
  24452. }
  24453. .success-toast {
  24454. position: fixed;
  24455. bottom: 24px;
  24456. left: 50%;
  24457. transform: translateX(-50%);
  24458. width: calc(100% - 32px);
  24459. padding: 16px 24px;
  24460. margin: 0 auto;
  24461. background-color: #ebf1fa;
  24462. border: 1px solid #4a80d2;
  24463. border-radius: 8px;
  24464. z-index: 1000;
  24465. animation: success-visible .3s ease-out forwards
  24466. }
  24467. .success-toast p {
  24468. margin: 0
  24469. }
  24470. @media(min-width:48em) {
  24471. .success-toast {
  24472. margin: 0 auto;
  24473. max-width: 977px;
  24474. bottom: 55px
  24475. }
  24476. }
  24477. @keyframes success-visible {
  24478. 0% {
  24479. bottom: 0;
  24480. opacity: 0
  24481. }
  24482. to {
  24483. bottom: 24px;
  24484. opacity: 1
  24485. }
  24486. }
  24487. .account-management__cards-list {
  24488. margin: 0 auto
  24489. }
  24490. .device-list__block-link {
  24491. display: block;
  24492. margin-top: 30px
  24493. }
  24494. .device-list__block-link--text-wrap {
  24495. white-space: pre-wrap
  24496. }
  24497. .device-list__block-link--placeholder {
  24498. pointer-events: none
  24499. }
  24500. .device-list__plain-link {
  24501. margin-top: 16px
  24502. }
  24503. .donate-points__content {
  24504. padding-top: 35px
  24505. }
  24506. @media(min-width:48em) {
  24507. .donate-points__content {
  24508. padding-top: 50px
  24509. }
  24510. }
  24511. .donate-points__charity-heading {
  24512. font-weight: 700;
  24513. padding-top: 0;
  24514. max-width: 380px;
  24515. margin: auto
  24516. }
  24517. @media(max-width:47.99em) {
  24518. .donate-points__charity-heading {
  24519. font-size: 1.25rem
  24520. }
  24521. }
  24522. .donate-points__charity-subheading {
  24523. max-width: 380px;
  24524. margin: 16px auto 35px
  24525. }
  24526. @media(min-width:48em) {
  24527. .donate-points__charity-subheading {
  24528. margin-bottom: 50px
  24529. }
  24530. }
  24531. .donate-points__confirm-heading {
  24532. margin: 0 auto;
  24533. max-width: 250px
  24534. }
  24535. @media(min-width:48em) {
  24536. .donate-points__confirm-heading {
  24537. max-width: 520px
  24538. }
  24539. }
  24540. .donate-points__body {
  24541. margin: 35px auto
  24542. }
  24543. .donate-points__ribbon {
  24544. width: 80px;
  24545. height: 118px
  24546. }
  24547. .donate-points__refresh .flow-form-submit__content {
  24548. margin-top: 0
  24549. }
  24550. .donate-points .donate-points-form {
  24551. text-align: left;
  24552. margin-top: 70px;
  24553. max-width: 440px
  24554. }
  24555. .donate-points .donate-points-form .text-group__label {
  24556. padding-bottom: 10px
  24557. }
  24558. @media(min-width:48em) {
  24559. .donate-points .donate-points-form .text-group__label {
  24560. padding-bottom: 12px
  24561. }
  24562. }
  24563. .donate-points .donate-points-form .text-group {
  24564. margin-top: 20px;
  24565. margin-bottom: 10px
  24566. }
  24567. @media(min-width:48em) {
  24568. .donate-points .donate-points-form .text-group {
  24569. margin-top: 40px
  24570. }
  24571. }
  24572. @media(min-width:48em) {
  24573. .donate-points .donate-points-form .password-group .text-group {
  24574. margin-top: 30px
  24575. }
  24576. }
  24577. @media(min-width:48em) {
  24578. .donate-points .donate-points-form__forgot-password {
  24579. font-size: .875rem
  24580. }
  24581. }
  24582. .donate-points .flow-form-submit {
  24583. text-align: center
  24584. }
  24585. .point-events__list {
  24586. background-color: #fff;
  24587. padding: 0;
  24588. margin: 0 0 16px
  24589. }
  24590. @media(min-width:48em) {
  24591. .point-events__list {
  24592. margin: 0 0 32px
  24593. }
  24594. }
  24595. .point-events__list-item {
  24596. padding: 20px;
  24597. list-style: none;
  24598. background-color: #fff
  24599. }
  24600. .point-events__list-item:not(:last-child) {
  24601. border-bottom: 1px solid #ddd
  24602. }
  24603. @media(min-width:48em) {
  24604. .point-events__list-item {
  24605. padding: 40px
  24606. }
  24607. }
  24608. .point-events__load-more {
  24609. display: block;
  24610. margin: 0 auto;
  24611. color: #000;
  24612. border: 1px solid #bcbcbc
  24613. }
  24614. .point-events__back-to-top {
  24615. background: #fff;
  24616. position: fixed;
  24617. bottom: 32px;
  24618. right: 40px;
  24619. display: none;
  24620. align-items: center;
  24621. z-index: 2;
  24622. transition: opacity, .2s ease;
  24623. opacity: 1
  24624. }
  24625. @media(min-width:48em) {
  24626. .point-events__back-to-top {
  24627. display: flex;
  24628. bottom: 115px
  24629. }
  24630. }
  24631. @media(min-width:64em) {
  24632. .point-events__back-to-top {
  24633. bottom: 100px
  24634. }
  24635. }
  24636. .point-events__back-to-top .sprite {
  24637. transform: rotate(270deg);
  24638. margin-right: 5px
  24639. }
  24640. .point-events__back-to-top.hidden {
  24641. transition: opacity, .2s ease;
  24642. opacity: 0
  24643. }
  24644. .account-setting--security .point-events__back-to-top.account-setting__turn-off-button,
  24645. .account-setting--security .point-events__back-to-top.account-setting__turn-on-button,
  24646. .point-events__back-to-top.button--theme-base,
  24647. .point-events__back-to-top.household-grid__invite-button,
  24648. .point-events__back-to-top.link--theme-button,
  24649. .point-events__back-to-top.link--theme-button-gray,
  24650. .point-events__back-to-top.link--theme-button-red,
  24651. .point-events__back-to-top.link--theme-button-transparent,
  24652. .point-events__back-to-top.link--theme-button-transparent-white,
  24653. .point-events__back-to-top.link--theme-button-white,
  24654. .point-events__back-to-top.points-days__cta,
  24655. .points-days-cta-section__content .point-events__back-to-top.cta-section__link {
  24656. padding: 16px
  24657. }
  24658. .no-transactions {
  24659. padding: 8px 10%;
  24660. text-align: center
  24661. }
  24662. .no-transactions .sprite {
  24663. width: 64px;
  24664. height: 64px
  24665. }
  24666. .no-transactions__header {
  24667. margin: 5px 0
  24668. }
  24669. .no-transactions span .link {
  24670. display: inline;
  24671. margin: 0 0 0 5px
  24672. }
  24673. .no-transactions .link {
  24674. display: block;
  24675. margin: 30px auto;
  24676. max-width: 250px
  24677. }
  24678. .utility-section.scroll-to-transactions {
  24679. margin-top: 0;
  24680. padding-top: 65px
  24681. }
  24682. .point-summary {
  24683. padding: 75px 0;
  24684. text-align: center
  24685. }
  24686. .point-summary__title {
  24687. font-size: 3rem;
  24688. margin-bottom: 15px;
  24689. margin-top: 0
  24690. }
  24691. .point-summary__inner {
  24692. display: flex;
  24693. justify-content: center
  24694. }
  24695. .point-summary__inner--redeemable {
  24696. border-left: 1px solid #ddd
  24697. }
  24698. .point-summary__inner--balance,
  24699. .point-summary__inner--redeemable {
  24700. display: flex;
  24701. flex-direction: column;
  24702. flex-basis: 185px
  24703. }
  24704. .point-summary__inner--balance .loading-placeholder,
  24705. .point-summary__inner--redeemable .loading-placeholder {
  24706. margin-bottom: 10px
  24707. }
  24708. .point-summary__inner--balance h2,
  24709. .point-summary__inner--redeemable h2 {
  24710. font-size: 2rem;
  24711. margin: 0
  24712. }
  24713. .point-summary.utility-header__inner {
  24714. height: 300px
  24715. }
  24716. .point-summary.utility-header__inner .no-balance,
  24717. .point-summary.utility-header__inner .point-summary__inner,
  24718. .point-summary.utility-header__inner .point-summary__title {
  24719. color: #ac342a
  24720. }
  24721. .point-summary .points-dashboard-error__inner {
  24722. margin: 0 auto
  24723. }
  24724. .point-summary .points-dashboard-error__inner .sprite {
  24725. fill: #bb2620
  24726. }
  24727. .points-summary-header__insiders .utility-header__inner.point-summary .no-balance,
  24728. .points-summary-header__insiders .utility-header__inner.point-summary .point-summary__inner,
  24729. .points-summary-header__insiders .utility-header__inner.point-summary .point-summary__title {
  24730. color: #fff
  24731. }
  24732. .no-balance {
  24733. padding: 0 10%
  24734. }
  24735. .points-dashboard {
  24736. display: flex;
  24737. justify-content: space-between;
  24738. flex-wrap: wrap
  24739. }
  24740. .points-dashboard-layout {
  24741. padding-bottom: 115px
  24742. }
  24743. .points-dashboard__summary-tile {
  24744. margin: 0 auto
  24745. }
  24746. .points-dashboard__filter {
  24747. display: flex;
  24748. flex-wrap: wrap;
  24749. justify-content: space-between
  24750. }
  24751. .points-dashboard__filter--title {
  24752. display: flex;
  24753. flex-direction: column
  24754. }
  24755. .points-dashboard__filter--title .sprite {
  24756. margin-bottom: 8px
  24757. }
  24758. .points-dashboard__filter--chip {
  24759. margin: 30px 0 8px;
  24760. display: flex;
  24761. flex-wrap: wrap
  24762. }
  24763. .points-dashboard__filter--placeholder {
  24764. margin: 55px auto 0
  24765. }
  24766. .points-dashboard__filter--placeholder .loading-placeholder {
  24767. margin-bottom: 10px
  24768. }
  24769. .points-dashboard__filter--tile {
  24770. height: 184px;
  24771. display: flex;
  24772. flex-direction: column;
  24773. margin-bottom: 15px;
  24774. box-shadow: 0 4px 0 0 #bcbcbc;
  24775. font-size: .75rem;
  24776. text-align: left;
  24777. justify-content: space-between;
  24778. flex: 0 1;
  24779. flex-basis: calc(50% - 1em)
  24780. }
  24781. @media screen and (max-width:380px) {
  24782. .points-dashboard__filter--tile {
  24783. flex-basis: 100%
  24784. }
  24785. }
  24786. @media(min-width:48em) {
  24787. .points-dashboard__filter--tile {
  24788. font-size: .875rem
  24789. }
  24790. }
  24791. @media(min-width:64em) {
  24792. .points-dashboard__filter--tile {
  24793. flex-basis: calc(25% - 1em);
  24794. padding: 20px
  24795. }
  24796. }
  24797. .points-dashboard__filter--tile.placeholder {
  24798. background: #fff;
  24799. padding: 15px;
  24800. display: flex;
  24801. justify-content: space-between;
  24802. flex-direction: column
  24803. }
  24804. .points-dashboard__filter--tile .groceryClass,
  24805. .points-dashboard__filter--tile .groceryClass:active,
  24806. .points-dashboard__filter--tile .houseClass,
  24807. .points-dashboard__filter--tile .houseClass:active {
  24808. fill: #ff9192;
  24809. color: #ee3124
  24810. }
  24811. .points-dashboard__filter--tile .gasClass,
  24812. .points-dashboard__filter--tile .gasClass:active,
  24813. .points-dashboard__filter--tile .pcfClass,
  24814. .points-dashboard__filter--tile .pcfClass:active {
  24815. color: #ee3124;
  24816. fill: #fbd2d3
  24817. }
  24818. .points-dashboard__filter--tile:hover .gasClass,
  24819. .points-dashboard__filter--tile:hover .houseClass,
  24820. .points-dashboard__filter--tile:hover .pcfClass {
  24821. color: #fbd2d3;
  24822. fill: #fff
  24823. }
  24824. .points-dashboard__filter--tile:hover .groceryClass {
  24825. fill: #fbd2d3;
  24826. color: #fff
  24827. }
  24828. .points-dashboard__filter--points {
  24829. font-size: 1.5rem;
  24830. font-weight: bolder
  24831. }
  24832. .points-dashboard__filter--dropdown {
  24833. flex-grow: 1
  24834. }
  24835. @media(min-width:48em) {
  24836. .points-dashboard__filter--dropdown {
  24837. display: none;
  24838. visibility: hidden
  24839. }
  24840. }
  24841. .points-dashboard__filter--dropdown .dropdown-group__button {
  24842. background: #fff;
  24843. border: 1px solid #ddd;
  24844. color: #000
  24845. }
  24846. .points-dashboard__filter--dropdown .dropdown-group__button:focus {
  24847. background: #ddd
  24848. }
  24849. .points-dashboard__filter--dropdown .dropdown-group__button svg {
  24850. fill: #000
  24851. }
  24852. .points-dashboard__filter--dropdown .dropdown-group__dropdown:invalid {
  24853. color: #000
  24854. }
  24855. .points-dashboard__subtitle {
  24856. display: flex;
  24857. margin-bottom: 16px;
  24858. flex-direction: column;
  24859. align-items: flex-start
  24860. }
  24861. @media(min-width:48em) {
  24862. .points-dashboard__subtitle {
  24863. flex-direction: row;
  24864. justify-content: space-between
  24865. }
  24866. }
  24867. .account-setting--security .points-dashboard__subtitle .account-setting__turn-off-button,
  24868. .account-setting--security .points-dashboard__subtitle .account-setting__turn-on-button,
  24869. .points-dashboard__subtitle .account-setting--security .account-setting__turn-off-button,
  24870. .points-dashboard__subtitle .account-setting--security .account-setting__turn-on-button,
  24871. .points-dashboard__subtitle .button,
  24872. .points-dashboard__subtitle .household-grid__invite-button,
  24873. .points-dashboard__subtitle .link--theme-button,
  24874. .points-dashboard__subtitle .link--theme-button--large-primary,
  24875. .points-dashboard__subtitle .link--theme-button--large-secondary,
  24876. .points-dashboard__subtitle .link--theme-button--small-primary,
  24877. .points-dashboard__subtitle .link--theme-button--small-secondary,
  24878. .points-dashboard__subtitle .link--theme-button-gray,
  24879. .points-dashboard__subtitle .link--theme-button-red,
  24880. .points-dashboard__subtitle .link--theme-button-transparent,
  24881. .points-dashboard__subtitle .link--theme-button-transparent-white,
  24882. .points-dashboard__subtitle .link--theme-button-white,
  24883. .points-dashboard__subtitle .load-shop-pay-header__link,
  24884. .points-dashboard__subtitle .load-shop-pay-module__link,
  24885. .points-dashboard__subtitle .marketing-page-header__link,
  24886. .points-dashboard__subtitle .marketing-page-module__link,
  24887. .points-dashboard__subtitle .partnership-perk-details__cta,
  24888. .points-dashboard__subtitle .partnership-perk-redeemed-success__cta,
  24889. .points-dashboard__subtitle .points-days-cta-section__content .cta-section__link,
  24890. .points-dashboard__subtitle .points-days__cta,
  24891. .points-days-cta-section__content .points-dashboard__subtitle .cta-section__link {
  24892. margin-top: 15px
  24893. }
  24894. @media(min-width:48em) {
  24895. .account-setting--security .points-dashboard__subtitle .account-setting__turn-off-button,
  24896. .account-setting--security .points-dashboard__subtitle .account-setting__turn-on-button,
  24897. .points-dashboard__subtitle .account-setting--security .account-setting__turn-off-button,
  24898. .points-dashboard__subtitle .account-setting--security .account-setting__turn-on-button,
  24899. .points-dashboard__subtitle .button,
  24900. .points-dashboard__subtitle .household-grid__invite-button,
  24901. .points-dashboard__subtitle .link--theme-button,
  24902. .points-dashboard__subtitle .link--theme-button--large-primary,
  24903. .points-dashboard__subtitle .link--theme-button--large-secondary,
  24904. .points-dashboard__subtitle .link--theme-button--small-primary,
  24905. .points-dashboard__subtitle .link--theme-button--small-secondary,
  24906. .points-dashboard__subtitle .link--theme-button-gray,
  24907. .points-dashboard__subtitle .link--theme-button-red,
  24908. .points-dashboard__subtitle .link--theme-button-transparent,
  24909. .points-dashboard__subtitle .link--theme-button-transparent-white,
  24910. .points-dashboard__subtitle .link--theme-button-white,
  24911. .points-dashboard__subtitle .load-shop-pay-header__link,
  24912. .points-dashboard__subtitle .load-shop-pay-module__link,
  24913. .points-dashboard__subtitle .marketing-page-header__link,
  24914. .points-dashboard__subtitle .marketing-page-module__link,
  24915. .points-dashboard__subtitle .partnership-perk-details__cta,
  24916. .points-dashboard__subtitle .partnership-perk-redeemed-success__cta,
  24917. .points-dashboard__subtitle .points-days-cta-section__content .cta-section__link,
  24918. .points-dashboard__subtitle .points-days__cta,
  24919. .points-days-cta-section__content .points-dashboard__subtitle .cta-section__link {
  24920. margin-top: 0
  24921. }
  24922. }
  24923. .points-dashboard__subtitle .loading-placeholder:first-of-type {
  24924. margin-top: 10px
  24925. }
  24926. .points-dashboard__points-events {
  24927. margin: 0 auto
  24928. }
  24929. .points-dashboard-chip--selected,
  24930. .points-dashboard-chip--selected:focus {
  24931. background: #157a77;
  24932. color: #fff
  24933. }
  24934. .points-dashboard-chip:hover {
  24935. color: #fff;
  24936. background: #615395
  24937. }
  24938. .points-dashboard-chip,
  24939. .points-dashboard-chip--selected {
  24940. margin: 0 15px 16px 0;
  24941. min-width: auto;
  24942. font-weight: bolder
  24943. }
  24944. @media(max-width:47.99em) {
  24945. .points-dashboard-chip,
  24946. .points-dashboard-chip--selected {
  24947. display: none;
  24948. visibility: hidden
  24949. }
  24950. }
  24951. .point-history-title {
  24952. margin-bottom: 16px
  24953. }
  24954. .account-settings-page {
  24955. margin: 0 auto
  24956. }
  24957. .account-settings-page__pcid-logo {
  24958. display: inline-block;
  24959. width: 58px;
  24960. height: 30px;
  24961. margin-right: 18px
  24962. }
  24963. .account-setting {
  24964. flex-grow: 1;
  24965. padding: 20px
  24966. }
  24967. .account-setting__inner {
  24968. width: 100%;
  24969. word-break: break-word
  24970. }
  24971. @media(min-width:48em) {
  24972. .account-setting__inner {
  24973. display: flex;
  24974. align-items: center
  24975. }
  24976. }
  24977. .account-setting__inner--expanded {
  24978. padding: 20px;
  24979. margin-top: 20px;
  24980. width: 100%;
  24981. border-left: 4px solid #007a7c
  24982. }
  24983. @media(min-width:48em) {
  24984. .account-setting__inner--expanded {
  24985. padding: 20px 40px
  24986. }
  24987. }
  24988. .account-setting__inner--try-again-link {
  24989. cursor: pointer
  24990. }
  24991. .account-setting__inner--layout {
  24992. display: flex;
  24993. flex-direction: column
  24994. }
  24995. @media(min-width:48em) {
  24996. .account-setting__inner--layout {
  24997. flex-direction: row;
  24998. flex-grow: 1;
  24999. justify-content: space-between;
  25000. align-items: center
  25001. }
  25002. }
  25003. .account-setting__inner--button {
  25004. display: block;
  25005. margin-top: 20px;
  25006. width: 100%
  25007. }
  25008. @media(min-width:48em) {
  25009. .account-setting__inner--button {
  25010. width: auto;
  25011. margin-top: 0;
  25012. flex-basis: 225px
  25013. }
  25014. }
  25015. .account-setting__value {
  25016. color: #191919;
  25017. display: block;
  25018. word-break: break-all
  25019. }
  25020. .account-setting__value--break-word {
  25021. word-break: break-word
  25022. }
  25023. .account-setting__form-info {
  25024. line-height: 1.8;
  25025. font-size: .9rem;
  25026. margin-top: 0
  25027. }
  25028. @media(min-width:48em) {
  25029. .account-setting__form-info {
  25030. margin: 0 0 30px
  25031. }
  25032. }
  25033. .account-setting__form-info--error {
  25034. color: #970012
  25035. }
  25036. .account-setting__label,
  25037. .account-setting__title {
  25038. margin: 0 0 14px;
  25039. font-weight: 700;
  25040. flex-shrink: 0;
  25041. float: none
  25042. }
  25043. @media(min-width:48em) {
  25044. .account-setting__label,
  25045. .account-setting__title {
  25046. flex-basis: 160px;
  25047. margin: 0 40px 0 0;
  25048. float: left
  25049. }
  25050. }
  25051. @media(min-width:48em) {
  25052. .account-setting__content {
  25053. flex-basis: 360px
  25054. }
  25055. }
  25056. .account-setting__content-title {
  25057. margin-top: 0;
  25058. margin-bottom: 10px;
  25059. font-size: 16px
  25060. }
  25061. .account-setting__row-wrapper {
  25062. display: flex;
  25063. justify-content: space-between
  25064. }
  25065. @media(min-width:48em) {
  25066. .account-setting__fields {
  25067. max-width: 460px
  25068. }
  25069. }
  25070. .account-setting__fields .text-group:first-child {
  25071. margin-top: 0
  25072. }
  25073. @media(min-width:48em) {
  25074. .account-setting__submit-button {
  25075. display: inline-block;
  25076. width: auto;
  25077. margin-top: 20px
  25078. }
  25079. }
  25080. .account-setting__cancel-button {
  25081. display: block;
  25082. width: 100%;
  25083. text-align: center;
  25084. margin-top: .9375rem
  25085. }
  25086. @media(min-width:48em) {
  25087. .account-setting__cancel-button {
  25088. display: inline-block;
  25089. width: auto;
  25090. text-align: left;
  25091. margin-left: 30px
  25092. }
  25093. }
  25094. .account-setting__new-password-policy-announcement {
  25095. color: #8a8a8a;
  25096. font-size: 13px;
  25097. text-align: left;
  25098. margin-top: 10px
  25099. }
  25100. @media(max-width:47.99em) {
  25101. .account-setting--address .account-setting__row-wrapper {
  25102. display: block
  25103. }
  25104. }
  25105. @media(min-width:48em) {
  25106. .account-setting--address .account-setting__dropdown--province,
  25107. .account-setting--address .account-setting__postal-code {
  25108. width: 48%;
  25109. margin-top: 0
  25110. }
  25111. }
  25112. .account-setting--address .dropdown-group__button {
  25113. padding: 16px 60px 16px 22px
  25114. }
  25115. .account-setting--communication .account-setting__content {
  25116. flex-basis: auto
  25117. }
  25118. .account-setting--communication .account-setting__option--offers {
  25119. padding-bottom: 26px;
  25120. border-bottom: 1px solid #ddd;
  25121. margin-bottom: 30px;
  25122. margin-top: 20px
  25123. }
  25124. @media(min-width:48em) {
  25125. .account-setting--communication .account-setting__option--offers {
  25126. margin-top: 0
  25127. }
  25128. }
  25129. .account-setting--communication .account-setting__option--surveys {
  25130. margin-bottom: 30px
  25131. }
  25132. @media(min-width:48em) {
  25133. .account-setting--communication .account-setting__option--surveys {
  25134. margin-bottom: 0
  25135. }
  25136. }
  25137. .account-setting--communication .account-setting__terms {
  25138. margin: 0 0 12px 34px
  25139. }
  25140. .account-setting--communication .account-setting__opt-in-link {
  25141. margin-left: 34px
  25142. }
  25143. .account-setting--communication .checkbox-group,
  25144. .account-setting--communication .refine-search__services-radio-group-single {
  25145. margin: 0 0 12px
  25146. }
  25147. .account-setting-update-email {
  25148. flex-direction: column
  25149. }
  25150. @media(min-width:48em) {
  25151. .account-setting-update-email {
  25152. padding: 20px 40px
  25153. }
  25154. }
  25155. .account-setting-update-email--button {
  25156. white-space: normal
  25157. }
  25158. .account-setting-update-email--contact-support {
  25159. display: block;
  25160. margin-top: 15px;
  25161. margin-bottom: 0
  25162. }
  25163. @media(min-width:48em) {
  25164. .account-setting-update-email--contact-support {
  25165. margin-top: 0
  25166. }
  25167. }
  25168. .account-setting--language-preferences .account-setting__content {
  25169. margin-top: 20px
  25170. }
  25171. @media(min-width:48em) {
  25172. .account-setting--language-preferences .account-setting__content {
  25173. margin-top: 0
  25174. }
  25175. }
  25176. .account-setting--password .text-group--block {
  25177. margin-bottom: 10px
  25178. }
  25179. .account-setting--security .account-setting__content {
  25180. margin-top: 10px
  25181. }
  25182. @media(min-width:48em) {
  25183. .account-setting--security .account-setting__content {
  25184. margin-top: 0
  25185. }
  25186. }
  25187. .account-setting--security .account-setting__actions {
  25188. display: flex;
  25189. flex-direction: column;
  25190. margin-top: 20px
  25191. }
  25192. @media(min-width:48em) {
  25193. .account-setting--security .account-setting__actions {
  25194. flex-direction: row;
  25195. align-items: center
  25196. }
  25197. }
  25198. .account-setting--security .account-setting__learn-more-button,
  25199. .account-setting--security .account-setting__turn-on-button {
  25200. display: block;
  25201. width: auto
  25202. }
  25203. @media(min-width:48em) {
  25204. .account-setting--security .account-setting__learn-more-button,
  25205. .account-setting--security .account-setting__turn-on-button {
  25206. display: inline-block
  25207. }
  25208. }
  25209. .account-setting--security .account-setting__cancel-button {
  25210. margin-top: 15px;
  25211. align-self: center
  25212. }
  25213. @media(min-width:48em) {
  25214. .account-setting--security .account-setting__cancel-button {
  25215. display: inline-block;
  25216. margin-top: 0;
  25217. margin-left: 30px
  25218. }
  25219. }
  25220. .account-setting .two-factor-toggle__read-only {
  25221. display: inline-block
  25222. }
  25223. .account-setting .two-factor-toggle__editable {
  25224. display: none
  25225. }
  25226. @media(min-width:48em) {
  25227. .account-setting .two-factor-toggle__editable {
  25228. display: inline-block
  25229. }
  25230. }
  25231. .toggleable-container .account-setting {
  25232. display: flex
  25233. }
  25234. .toggleable-container .account-setting--read-only {
  25235. padding-right: 0
  25236. }
  25237. @media(min-width:48em) {
  25238. .toggleable-container .account-setting {
  25239. align-items: center;
  25240. padding: 30px 20px 30px 40px
  25241. }
  25242. }
  25243. .toggleable-container .account-setting--fieldset,
  25244. .toggleable-container .account-setting--form {
  25245. width: 100%
  25246. }
  25247. .toggleable-container .account-setting--editable {
  25248. display: block;
  25249. width: 100%
  25250. }
  25251. @media(min-width:48em) {
  25252. .toggleable-container .account-setting--editable {
  25253. display: flex;
  25254. align-items: flex-start
  25255. }
  25256. }
  25257. @media(min-width:48em) {
  25258. .toggleable-container .account-setting--editable .account-setting__title {
  25259. margin-top: 10px
  25260. }
  25261. }
  25262. @media(min-width:48em) {
  25263. .toggleable-container .account-setting--editable.account-setting--address>* {
  25264. margin-top: 0
  25265. }
  25266. }
  25267. .toggleable-container .account-setting__error {
  25268. position: relative
  25269. }
  25270. .pcinsider-section {
  25271. display: flex;
  25272. flex-direction: column
  25273. }
  25274. @media(min-width:48em) {
  25275. .pcinsider-section {
  25276. flex-direction: row;
  25277. align-items: center;
  25278. justify-content: space-between;
  25279. padding: 30px 35px 30px 40px
  25280. }
  25281. }
  25282. .pcinsider-section__logo {
  25283. height: 35px;
  25284. width: 90px
  25285. }
  25286. .pcinsider-section__text {
  25287. margin: 45px 0 0;
  25288. padding: 0;
  25289. line-height: 1.1;
  25290. text-align: left
  25291. }
  25292. @media(min-width:48em) {
  25293. .pcinsider-section__text {
  25294. margin: 0
  25295. }
  25296. }
  25297. .pcinsider-section__text p {
  25298. max-width: 320px;
  25299. margin: 0
  25300. }
  25301. @media(min-width:64em) {
  25302. .pcinsider-section__text p {
  25303. max-width: 400px
  25304. }
  25305. }
  25306. .pcinsider-section__text p:first-of-type {
  25307. margin-bottom: 15px
  25308. }
  25309. @media(min-width:48em) {
  25310. .pcinsider-section__text p:first-of-type {
  25311. margin-bottom: 0
  25312. }
  25313. }
  25314. .pcinsider-section__button {
  25315. display: flex;
  25316. justify-content: center;
  25317. margin-top: 40px
  25318. }
  25319. @media(min-width:48em) {
  25320. .pcinsider-section__button {
  25321. width: 155px;
  25322. margin-top: 0
  25323. }
  25324. }
  25325. .pcinsider-section__enrolled-checkmark {
  25326. font-size: 16px;
  25327. position: absolute;
  25328. right: 20px
  25329. }
  25330. @media(min-width:48em) {
  25331. .pcinsider-section__enrolled-checkmark {
  25332. position: relative;
  25333. right: 0
  25334. }
  25335. }
  25336. .pcinsider-section__enrolled-checkmark .sprite {
  25337. width: 15px;
  25338. height: 15px;
  25339. position: relative;
  25340. top: 2px;
  25341. margin: 0 10px 0 40px
  25342. }
  25343. .update-email-form__info {
  25344. line-height: 1.8;
  25345. font-size: .9rem
  25346. }
  25347. .update-email-form__submit {
  25348. margin-top: -25px
  25349. }
  25350. .account-container {
  25351. background-color: #f0f0f0
  25352. }
  25353. .subscription-container {
  25354. width: 100%;
  25355. margin: 0 auto;
  25356. padding: 24px 16px
  25357. }
  25358. @media(min-width:48em) {
  25359. .subscription-container {
  25360. max-width: 688px;
  25361. padding: 48px 16px
  25362. }
  25363. }
  25364. .checklist-container {
  25365. background-color: #fff;
  25366. display: none;
  25367. padding-bottom: 32px
  25368. }
  25369. @media(min-width:64.0625em) {
  25370. .checklist-container {
  25371. display: block;
  25372. border-left: 1px solid rgba(158, 147, 166, .4)
  25373. }
  25374. }
  25375. .checklist-container__error-tile {
  25376. padding: 40px 20px
  25377. }
  25378. .checklist-container .loading-tile {
  25379. text-align: center
  25380. }
  25381. .checklist__header {
  25382. padding: 32px 32px 0
  25383. }
  25384. .checklist__header .loading-placeholder {
  25385. margin-bottom: 8px
  25386. }
  25387. .checklist__header .loading-placeholder__inner {
  25388. line-height: 32px
  25389. }
  25390. .checklist__header h2 {
  25391. color: #403840;
  25392. font-weight: 600;
  25393. margin: 0
  25394. }
  25395. .checklist__items-container {
  25396. list-style-type: none;
  25397. margin: 0;
  25398. padding: 0
  25399. }
  25400. .checklist__items-container .loading-placeholder__inner {
  25401. line-height: 28px
  25402. }
  25403. .checklist__item-wrapper {
  25404. border-bottom: 1px solid rgba(158, 147, 166, .4);
  25405. padding: 32px
  25406. }
  25407. .checklist__item-wrapper:first-child {
  25408. padding-top: 24px
  25409. }
  25410. .checklist__item-wrapper--placeholder:first-child {
  25411. padding-top: 16px
  25412. }
  25413. @media(min-width:64em) {
  25414. .confirm-points .flow-tile>* {
  25415. max-width: 550px
  25416. }
  25417. }
  25418. .confirm-points__confirm+.toggleable-drawer {
  25419. margin-top: 40px
  25420. }
  25421. .confirm-points__conversion-title {
  25422. max-width: 620px
  25423. }
  25424. .confirm-points__description,
  25425. .confirm-points__sub-description,
  25426. .confirm-points__title {
  25427. text-align: left
  25428. }
  25429. .account-setting--security .confirm-points__description+.account-setting__turn-off-button,
  25430. .account-setting--security .confirm-points__description+.account-setting__turn-on-button,
  25431. .confirm-points__description+.button,
  25432. .confirm-points__description+.household-grid__invite-button,
  25433. .confirm-points__description+.link--theme-button,
  25434. .confirm-points__description+.link--theme-button--large-primary,
  25435. .confirm-points__description+.link--theme-button--large-secondary,
  25436. .confirm-points__description+.link--theme-button--small-primary,
  25437. .confirm-points__description+.link--theme-button--small-secondary,
  25438. .confirm-points__description+.link--theme-button-gray,
  25439. .confirm-points__description+.link--theme-button-red,
  25440. .confirm-points__description+.link--theme-button-transparent,
  25441. .confirm-points__description+.link--theme-button-transparent-white,
  25442. .confirm-points__description+.link--theme-button-white,
  25443. .confirm-points__description+.load-shop-pay-header__link,
  25444. .confirm-points__description+.load-shop-pay-module__link,
  25445. .confirm-points__description+.marketing-page-header__link,
  25446. .confirm-points__description+.marketing-page-module__link,
  25447. .confirm-points__description+.partnership-perk-details__cta,
  25448. .confirm-points__description+.partnership-perk-redeemed-success__cta,
  25449. .confirm-points__description+.points-days__cta,
  25450. .points-days-cta-section__content .confirm-points__description+.cta-section__link {
  25451. margin-bottom: 15px
  25452. }
  25453. .confirm-points .toggleable-drawer__close-button {
  25454. display: block;
  25455. top: 20px;
  25456. right: 20px
  25457. }
  25458. .confirm-points__deadline {
  25459. padding-top: 40px;
  25460. max-width: 320px;
  25461. margin: 0 auto
  25462. }
  25463. .confirm-points__form-submit {
  25464. width: -moz-fit-content;
  25465. width: fit-content
  25466. }
  25467. @media(min-width:48em) {
  25468. .confirm-points__form-submit {
  25469. margin-bottom: 40px
  25470. }
  25471. }
  25472. .confirm-points__form-submit .flow-form-submit {
  25473. text-align: center
  25474. }
  25475. .confirm-points__form-submit .flow-form-submit__content {
  25476. margin-top: 24px
  25477. }
  25478. .confirm-points__form-submit .flow-form-submit__cancel,
  25479. .confirm-points__form-submit .flow-form-submit__submit {
  25480. display: block;
  25481. margin-left: auto;
  25482. margin-right: auto
  25483. }
  25484. .confirm-points__form-submit .flow-form-submit__submit {
  25485. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  25486. padding: 12px 24px
  25487. }
  25488. .confirm-points__form-submit .flow-form-submit__cancel {
  25489. margin-top: 30px
  25490. }
  25491. .confirm-points .link-more-cards {
  25492. max-width: 100%;
  25493. margin: 40px 20px 0;
  25494. padding: 30px 24px;
  25495. background-color: #f0f0f0
  25496. }
  25497. .confirm-points__link-more-cards--legacy {
  25498. margin-top: 20px;
  25499. margin-bottom: -30px
  25500. }
  25501. .confirm-points__flow-tile {
  25502. padding: 30px;
  25503. text-align: left
  25504. }
  25505. @media(min-width:48em) {
  25506. .confirm-points__flow-tile {
  25507. padding: 60px 30px
  25508. }
  25509. }
  25510. .confirm-points__reminder {
  25511. background-color: #0075ff;
  25512. color: #fff;
  25513. -webkit-font-smoothing: antialiased;
  25514. padding-top: 30px;
  25515. padding-bottom: 30px
  25516. }
  25517. .confirm-points .activate-card {
  25518. max-width: 100%
  25519. }
  25520. .confirm-points .activation-card-display__card-graphic {
  25521. width: auto
  25522. }
  25523. .confirm-points__headline {
  25524. margin-bottom: 8px
  25525. }
  25526. .confirm-points__point-summary--title {
  25527. margin-top: 16px
  25528. }
  25529. .confirm-points__point-summary--sub-title {
  25530. margin-top: 8px;
  25531. margin-bottom: 0
  25532. }
  25533. .confirm-points-placeholder--header {
  25534. padding: 55px 0 46px
  25535. }
  25536. .confirm-points-placeholder--progress-bar {
  25537. margin-top: 20px
  25538. }
  25539. .confirm-points-placeholder--copy {
  25540. margin: 35px auto 20px
  25541. }
  25542. .already-claimed__title {
  25543. margin-bottom: 10px
  25544. }
  25545. .already-claimed__link {
  25546. margin: 40px auto 20px
  25547. }
  25548. .already-claimed__support-link {
  25549. margin-bottom: 40px
  25550. }
  25551. .already-claimed__link-more-cards {
  25552. max-width: none;
  25553. margin: 0 10px
  25554. }
  25555. .accept-invitation-full-house__title {
  25556. margin-bottom: 15px
  25557. }
  25558. .accept-invitation-full-house__body {
  25559. margin-bottom: 30px;
  25560. max-width: 455px
  25561. }
  25562. .accept-invitation-full-house__links {
  25563. display: flex;
  25564. flex-direction: column
  25565. }
  25566. .accept-invitation-full-house__learn-more-button {
  25567. display: block;
  25568. margin-left: auto;
  25569. margin-right: auto;
  25570. margin-top: 30px;
  25571. border: none;
  25572. cursor: pointer;
  25573. padding: 16px 26px;
  25574. background: #191919;
  25575. color: #fff
  25576. }
  25577. .accept-invitation-full-house__contact-support-button {
  25578. margin-top: 20px
  25579. }
  25580. .accept-invitation-full-house__info .accept-invitation-info__drawer {
  25581. margin: 30px auto 0
  25582. }
  25583. .accept-invitation-full-house__info .accept-invitation-info__drawer:after {
  25584. display: none
  25585. }
  25586. .accept-invitation-full-house__points-summary .points-summary__container--precombined:after {
  25587. margin-top: 0
  25588. }
  25589. .send-invitation-container__header .flow-header__sub-title,
  25590. .send-invitation-container__header .flow-header__title {
  25591. color: #000
  25592. }
  25593. .login-page__pcid-title {
  25594. display: flex;
  25595. align-items: center;
  25596. justify-content: center;
  25597. max-width: 460px
  25598. }
  25599. .login-page__pcid-logo {
  25600. width: 40px;
  25601. height: 40px;
  25602. flex-shrink: 0
  25603. }
  25604. .login-page__title {
  25605. font-size: 1.125rem;
  25606. text-align: center;
  25607. margin-left: 15px
  25608. }
  25609. @media(max-width:34.365em) {
  25610. .login-page__title {
  25611. font-size: 1rem
  25612. }
  25613. }
  25614. .login-page__footer {
  25615. text-align: center;
  25616. margin-bottom: 27px
  25617. }
  25618. @media(min-width:64em) {
  25619. .login-page__footer {
  25620. margin-bottom: 57px
  25621. }
  25622. }
  25623. .login-page .flow-header__sub-title {
  25624. font-weight: 400;
  25625. color: #585858;
  25626. max-width: 460px;
  25627. margin: 0 auto
  25628. }
  25629. .offers-preview li {
  25630. list-style: none
  25631. }
  25632. .offers-preview__title {
  25633. text-align: center
  25634. }
  25635. .offers-preview .offer--invalid {
  25636. min-height: 205px
  25637. }
  25638. .offers-preview__additional-data {
  25639. padding: 0;
  25640. margin: 0 1em 5em;
  25641. list-style: none;
  25642. display: flex;
  25643. flex-wrap: wrap
  25644. }
  25645. .offers-preview__additional-data-item {
  25646. padding: 10px;
  25647. border-bottom: 5px solid rgba(0, 0, 0, .15);
  25648. flex: 1 1 50%;
  25649. display: flex
  25650. }
  25651. .offers-preview__additional-data-item p {
  25652. margin: 0
  25653. }
  25654. .offers-preview__image-gallery {
  25655. margin: 0 1em 5em
  25656. }
  25657. .offers-preview__image-gallery ul {
  25658. padding: 0;
  25659. list-style: none;
  25660. display: flex;
  25661. flex-wrap: wrap
  25662. }
  25663. .offers-preview__image-gallery-item {
  25664. padding: 10px;
  25665. border-bottom: 5px solid rgba(0, 0, 0, .15);
  25666. flex: 1 1 auto
  25667. }
  25668. .offers-preview__image-gallery-item-label {
  25669. display: block;
  25670. margin-bottom: 10px
  25671. }
  25672. .offers-mobile-preview {
  25673. display: flex;
  25674. flex-direction: column;
  25675. flex: 1;
  25676. background-color: #f0f0f0;
  25677. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  25678. }
  25679. .registration-page__header {
  25680. text-align: center
  25681. }
  25682. .registration-page__all-fields-required {
  25683. margin-bottom: 30px
  25684. }
  25685. .registration-page__footer {
  25686. text-align: center;
  25687. margin-bottom: 27px
  25688. }
  25689. @media(min-width:64em) {
  25690. .registration-page__footer {
  25691. margin-bottom: 57px
  25692. }
  25693. }
  25694. .conversion-failure .flow-header__title {
  25695. margin: 0 auto;
  25696. max-width: 400px
  25697. }
  25698. @media(min-width:48em) {
  25699. .conversion-failure .flow-header__title {
  25700. max-width: 600px
  25701. }
  25702. }
  25703. .legacy-transfer__pcf-card-link {
  25704. display: block;
  25705. width: 218px;
  25706. margin: 0 auto 30px
  25707. }
  25708. .legacy-transfer__pcf-card-link img {
  25709. display: block;
  25710. width: 100%;
  25711. max-width: 100%;
  25712. box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
  25713. border-radius: 9px
  25714. }
  25715. .legacy-transfer__button-row {
  25716. display: flex;
  25717. flex-direction: row;
  25718. justify-content: space-between;
  25719. max-width: 240px;
  25720. margin: 40px auto
  25721. }
  25722. @media(min-width:48em) {
  25723. .legacy-transfer__button-row {
  25724. max-width: 350px
  25725. }
  25726. }
  25727. .legacy-transfer__button {
  25728. min-width: 110px;
  25729. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  25730. padding: 12px 24px
  25731. }
  25732. .legacy-transfer__button--spacing {
  25733. padding-left: 12px
  25734. }
  25735. @media(min-width:48em) {
  25736. .legacy-transfer__button {
  25737. min-width: 160px
  25738. }
  25739. }
  25740. .legacy-transfer__link-more-cards {
  25741. max-width: 560px
  25742. }
  25743. @media(min-width:48em) {
  25744. .pco-digital-card {
  25745. padding: 40px 90px
  25746. }
  25747. }
  25748. .pco-digital-card img {
  25749. max-width: 100%
  25750. }
  25751. .pco-digital-card__download-app {
  25752. display: flex;
  25753. margin-bottom: 35px;
  25754. flex-direction: column;
  25755. border-bottom: 1px solid rgba(158, 147, 166, .25);
  25756. padding: 10px 15px 30px;
  25757. align-items: center
  25758. }
  25759. @media(min-width:48em) {
  25760. .pco-digital-card__download-app {
  25761. flex-direction: row;
  25762. justify-content: center;
  25763. padding: 0 15px 35px
  25764. }
  25765. }
  25766. .pco-digital-card__download-app .donate-banner__fake-cta,
  25767. .pco-digital-card__download-app .new-window-link,
  25768. .pco-digital-card__download-app .tile-item__fake-cta,
  25769. .pco-digital-card__download-app .video-tile__fake-cta {
  25770. display: flex;
  25771. margin: 10px
  25772. }
  25773. .pco-digital-card__download-app .donate-banner__fake-cta:first-of-type,
  25774. .pco-digital-card__download-app .new-window-link:first-of-type,
  25775. .pco-digital-card__download-app .tile-item__fake-cta:first-of-type,
  25776. .pco-digital-card__download-app .video-tile__fake-cta:first-of-type {
  25777. width: 125px;
  25778. height: 40px
  25779. }
  25780. .pco-digital-card__download-app .donate-banner__fake-cta:first-of-type>svg,
  25781. .pco-digital-card__download-app .new-window-link:first-of-type>svg,
  25782. .pco-digital-card__download-app .tile-item__fake-cta:first-of-type>svg,
  25783. .pco-digital-card__download-app .video-tile__fake-cta:first-of-type>svg {
  25784. max-width: 100%;
  25785. height: 40px
  25786. }
  25787. .pco-digital-card__description,
  25788. .pco-digital-card__title {
  25789. text-align: left
  25790. }
  25791. .pco-digital-card--view-offers {
  25792. margin-top: 20px;
  25793. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif;
  25794. width: -moz-fit-content;
  25795. width: fit-content;
  25796. padding: 12px 24px
  25797. }
  25798. .enrol-flow .pco-digital-card__header {
  25799. max-width: 710px
  25800. }
  25801. .flow-tile--initial-offers {
  25802. padding: 40px 5px
  25803. }
  25804. @media(min-width:48em) {
  25805. .flow-tile--initial-offers {
  25806. padding: 40px 90px
  25807. }
  25808. }
  25809. .activate-card {
  25810. display: flex;
  25811. flex-direction: column;
  25812. justify-content: space-evenly;
  25813. max-width: 100%
  25814. }
  25815. @media(min-width:64em) {
  25816. .activate-card {
  25817. flex-direction: row
  25818. }
  25819. }
  25820. .activate-card__inner {
  25821. text-align: center
  25822. }
  25823. .activate-card__inner:last-of-type {
  25824. margin-top: 30px
  25825. }
  25826. @media(min-width:64em) {
  25827. .activate-card__inner:last-of-type {
  25828. margin-top: 0
  25829. }
  25830. }
  25831. .activate-card__inner .link {
  25832. display: block;
  25833. margin: 0 auto;
  25834. width: -moz-fit-content;
  25835. width: fit-content;
  25836. white-space: normal
  25837. }
  25838. .activate-card__inner .link sup {
  25839. font-size: 10px
  25840. }
  25841. .activate-card__image {
  25842. display: block;
  25843. width: 237px;
  25844. margin: 0 auto 16px
  25845. }
  25846. @media(min-width:48em) {
  25847. .activate-card__image {
  25848. margin-bottom: 24px
  25849. }
  25850. }
  25851. .activate-card__subtitle {
  25852. max-width: 390px;
  25853. margin-top: 24px;
  25854. line-height: 1.3
  25855. }
  25856. .link-cards .flow-header__title {
  25857. margin-bottom: 8px
  25858. }
  25859. .link-cards__digital-card {
  25860. font-family: Inter, Arial, Helvetica Neue, Helvetica, sans-serif
  25861. }
  25862. .link-cards__separator-line {
  25863. margin: 24px auto;
  25864. background-color: #9e93a6;
  25865. opacity: .25
  25866. }
  25867. .store-map__inner {
  25868. background-color: #e5e3df;
  25869. display: flex;
  25870. padding: 0;
  25871. height: auto;
  25872. flex-wrap: wrap
  25873. }
  25874. @media(min-width:64em) {
  25875. .store-map__inner {
  25876. height: 600px
  25877. }
  25878. }
  25879. .store-map--hidden {
  25880. display: none
  25881. }
  25882. .stores {
  25883. background-color: #f0f0f0;
  25884. display: flex;
  25885. flex-direction: column
  25886. }
  25887. @media(min-width:48em) {
  25888. .stores {
  25889. flex-flow: row wrap;
  25890. align-content: flex-start
  25891. }
  25892. }
  25893. .stores__header {
  25894. z-index: 2
  25895. }
  25896. @media(min-width:48em) {
  25897. .stores__header {
  25898. flex: 1 0 100%
  25899. }
  25900. }
  25901. .stores__refine {
  25902. order: 2
  25903. }
  25904. @media(min-width:48em) {
  25905. .stores__refine {
  25906. order: 1;
  25907. flex: 1 0 100%
  25908. }
  25909. }
  25910. .stores__map {
  25911. flex-grow: 1;
  25912. order: 1
  25913. }
  25914. @media(min-width:48em) {
  25915. .stores__map {
  25916. height: 600px;
  25917. order: 3;
  25918. border: none
  25919. }
  25920. }
  25921. .stores__map--sticky {
  25922. border-bottom: 3px solid rgba(0, 0, 0, .1)
  25923. }
  25924. .stores__map--hidden {
  25925. display: none
  25926. }
  25927. .stores__search-results-list {
  25928. order: 2;
  25929. width: 100%
  25930. }
  25931. @media(min-width:48em) {
  25932. .stores__search-results-list {
  25933. order: 1;
  25934. overflow-x: hidden;
  25935. overflow-y: auto;
  25936. width: 40vw
  25937. }
  25938. }
  25939. @media(min-width:64em) {
  25940. .stores__search-results-list {
  25941. width: 430px
  25942. }
  25943. }
  25944. .info-window {
  25945. width: 400px;
  25946. margin-right: -51px
  25947. }
  25948. .info-window__body {
  25949. padding: 22px 20px 12px;
  25950. border-bottom: 1px solid #bcbcbc;
  25951. max-width: 100vw
  25952. }
  25953. @media(min-width:48em) {
  25954. .info-window__body {
  25955. padding: 14px 20px 20px
  25956. }
  25957. }
  25958. @media(min-width:64em) {
  25959. .info-window__body {
  25960. padding: 10px 40px 20px
  25961. }
  25962. }
  25963. .info-window__title {
  25964. margin-top: 0;
  25965. margin-right: 20px;
  25966. line-height: 1.3;
  25967. margin-bottom: 6px;
  25968. white-space: nowrap
  25969. }
  25970. @media(min-width:48em) {
  25971. .info-window__title {
  25972. white-space: normal
  25973. }
  25974. }
  25975. .info-window__address1,
  25976. .info-window__address2 {
  25977. display: none
  25978. }
  25979. @media(min-width:48em) {
  25980. .info-window__address1,
  25981. .info-window__address2 {
  25982. display: block;
  25983. margin-top: 0;
  25984. margin-bottom: 5px
  25985. }
  25986. }
  25987. .info-window__address2 {
  25988. margin-bottom: 20px
  25989. }
  25990. .info-window__more-info {
  25991. display: none
  25992. }
  25993. @media(min-width:48em) {
  25994. .info-window__more-info {
  25995. display: flex;
  25996. align-items: center
  25997. }
  25998. }
  25999. .info-window__hours {
  26000. margin: 0 40px 0 0;
  26001. color: #007a7c;
  26002. text-decoration: none
  26003. }
  26004. .info-window__hours:hover {
  26005. color: #007a7c
  26006. }
  26007. .info-window__service {
  26008. margin: 0;
  26009. text-decoration: none;
  26010. color: #8a8a8a
  26011. }
  26012. .info-window__hours-icon {
  26013. width: 26px;
  26014. height: 26px;
  26015. margin-right: 10px;
  26016. fill: #007a7c
  26017. }
  26018. .info-window__gas-bar-icon {
  26019. width: 26px;
  26020. height: 26px;
  26021. margin-right: 10px;
  26022. fill: #8a8a8a
  26023. }
  26024. .info-window__footer {
  26025. display: flex;
  26026. flex-wrap: nowrap;
  26027. justify-content: center;
  26028. border-bottom: 1px solid #bcbcbc;
  26029. max-width: 100vw
  26030. }
  26031. .info-window__button {
  26032. width: 50%;
  26033. border: none;
  26034. display: inline-flex
  26035. }
  26036. @media(max-width:63.99em) {
  26037. .info-window__button {
  26038. padding: 10px 0
  26039. }
  26040. }
  26041. .info-window__button:first-child:not(:only-child) {
  26042. border-right: 1px solid #bcbcbc
  26043. }
  26044. .info-window__button:only-child {
  26045. width: 100%
  26046. }
  26047. .info-window__button-inner {
  26048. display: flex;
  26049. margin: 0 auto;
  26050. align-items: center;
  26051. justify-content: center
  26052. }
  26053. .info-window__caret {
  26054. fill: #ee3124
  26055. }
  26056. .gm-style-iw {
  26057. border: none;
  26058. left: 1px !important;
  26059. top: 1px !important;
  26060. height: 109px !important;
  26061. width: 400px !important;
  26062. max-width: 100vw !important;
  26063. overflow-y: auto !important;
  26064. overflow-x: hidden !important;
  26065. background-color: #fff;
  26066. border-radius: 2px 2px 0 0;
  26067. padding: 0 !important
  26068. }
  26069. @media(min-width:48em) {
  26070. .gm-style-iw {
  26071. top: 17px !important;
  26072. height: auto !important
  26073. }
  26074. }
  26075. @media(min-width:64em) {
  26076. .gm-style-iw {
  26077. top: 0 !important
  26078. }
  26079. }
  26080. .gm-style-iw>div {
  26081. overflow: visible !important
  26082. }
  26083. .flyers-header,
  26084. .store-locator-header {
  26085. position: relative;
  26086. color: #2c2a29
  26087. }
  26088. .flyers-header__inner,
  26089. .store-locator-header__inner {
  26090. position: relative;
  26091. display: flex;
  26092. flex-direction: column;
  26093. justify-content: center;
  26094. text-align: center;
  26095. min-height: 210px;
  26096. padding-top: 20px;
  26097. padding-bottom: 20px
  26098. }
  26099. @media(min-width:48em) {
  26100. .flyers-header__inner,
  26101. .store-locator-header__inner {
  26102. height: 300px
  26103. }
  26104. }
  26105. .flyers-header__title,
  26106. .store-locator-header__title {
  26107. margin-top: 0;
  26108. margin-bottom: 0;
  26109. color: #ac342a
  26110. }
  26111. .flyers-header__subtitle,
  26112. .store-locator-header__subtitle {
  26113. margin-top: 10px;
  26114. margin-bottom: 0;
  26115. color: #ac342a
  26116. }
  26117. .store-locator-header__esso-link {
  26118. margin-top: 20px
  26119. }
  26120. .store-locator-header__insiders .flyers-header__subtitle,
  26121. .store-locator-header__insiders .flyers-header__title,
  26122. .store-locator-header__insiders .store-locator-header__subtitle,
  26123. .store-locator-header__insiders .store-locator-header__title {
  26124. color: #fff
  26125. }
  26126. .store-locator-header__insiders .store-locator-header__esso-link .donate-banner__fake-cta,
  26127. .store-locator-header__insiders .store-locator-header__esso-link .new-window-link,
  26128. .store-locator-header__insiders .store-locator-header__esso-link .tile-item__fake-cta,
  26129. .store-locator-header__insiders .store-locator-header__esso-link .video-tile__fake-cta {
  26130. color: #f9dada
  26131. }
  26132. .store-locator-header__insiders .store-locator-header__esso-link .donate-banner__fake-cta:hover,
  26133. .store-locator-header__insiders .store-locator-header__esso-link .new-window-link:hover,
  26134. .store-locator-header__insiders .store-locator-header__esso-link .tile-item__fake-cta:hover,
  26135. .store-locator-header__insiders .store-locator-header__esso-link .video-tile__fake-cta:hover {
  26136. color: #fbf1f1
  26137. }
  26138. .search-box {
  26139. width: 100%;
  26140. margin-top: 20px
  26141. }
  26142. @media(min-width:48em) {
  26143. .search-box {
  26144. margin-top: 30px
  26145. }
  26146. }
  26147. .search-box--sticky {
  26148. border-top: 4px solid #fff
  26149. }
  26150. .flyers-header__search-container,
  26151. .search-box__inner {
  26152. display: flex;
  26153. flex-flow: row nowrap;
  26154. width: 500px;
  26155. max-width: 100%;
  26156. border-bottom: 3px solid rgba(0, 0, 0, .1);
  26157. margin: 0 auto
  26158. }
  26159. .search-box__inner--full-width {
  26160. width: 100%
  26161. }
  26162. .flyers-header__input-container,
  26163. .search-box__input-container {
  26164. position: relative;
  26165. flex-grow: 1
  26166. }
  26167. .flyers-header__input-container .sprite,
  26168. .search-box__input-container .sprite {
  26169. pointer-events: none;
  26170. position: absolute;
  26171. margin-top: 15px;
  26172. margin-left: 15px
  26173. }
  26174. .flyers-header__input,
  26175. .search-box__input {
  26176. background-color: #fff;
  26177. border: none;
  26178. height: 52px;
  26179. width: 100%;
  26180. padding-left: 50px;
  26181. line-height: normal
  26182. }
  26183. @media(max-width:34.365em) {
  26184. .flyers-header__input,
  26185. .search-box__input {
  26186. font-size: .875rem
  26187. }
  26188. }
  26189. .flyers-header__search-button,
  26190. .search-box__search-button {
  26191. position: relative;
  26192. min-width: 0;
  26193. flex-shrink: 0;
  26194. z-index: 1
  26195. }
  26196. @media(min-width:48em) {
  26197. .flyers-header__search-button,
  26198. .search-box__search-button {
  26199. min-width: 160px
  26200. }
  26201. }
  26202. .search-box__quick-search-list {
  26203. position: relative;
  26204. width: 500px;
  26205. max-width: 100%;
  26206. margin: auto;
  26207. top: -3px
  26208. }
  26209. .search-box__quick-search-list-inner {
  26210. position: absolute;
  26211. top: 0;
  26212. left: -1px;
  26213. right: -1px
  26214. }
  26215. .search-box__quick-search-list .result-list {
  26216. width: 100%;
  26217. min-height: 60px;
  26218. list-style-type: none;
  26219. padding: 0;
  26220. overflow-y: auto;
  26221. border: 1px solid #ddd;
  26222. border-bottom: 4px solid rgba(0, 0, 0, .15)
  26223. }
  26224. .search-box__quick-search-list .result-list__inner {
  26225. padding: 0;
  26226. margin: 0;
  26227. background-color: #fff
  26228. }
  26229. .search-box__quick-search-list .result-list__item {
  26230. display: flex;
  26231. align-items: center;
  26232. text-align: left;
  26233. border-bottom: 1px solid #ddd;
  26234. min-height: 50px;
  26235. cursor: pointer;
  26236. padding: 10px 20px
  26237. }
  26238. .search-box__quick-search-list .result-list__item:hover {
  26239. background: #f0f0f0;
  26240. color: #ee3124
  26241. }
  26242. .search-box__quick-search-list .result-list__item:last-child {
  26243. border-bottom: none
  26244. }
  26245. .search-box__search-error {
  26246. color: #bb2620;
  26247. padding-top: 6px
  26248. }
  26249. .search-box--sticky .search-box__search-error {
  26250. position: relative;
  26251. z-index: -1;
  26252. background: #fff;
  26253. margin-top: -3px;
  26254. padding-top: 10px;
  26255. padding-bottom: 10px;
  26256. border-bottom: 1px solid rgba(0, 0, 0, .1)
  26257. }
  26258. .store-details {
  26259. background-color: #fff;
  26260. overflow: auto
  26261. }
  26262. .store-details-content {
  26263. margin: 0 auto;
  26264. max-width: 920px
  26265. }
  26266. @media(max-width:47.99em) {
  26267. .store-details-content {
  26268. padding: 0
  26269. }
  26270. }
  26271. @media(max-width:47.99em) {
  26272. .store-details-content .error-tile {
  26273. padding: 20px 30px
  26274. }
  26275. }
  26276. @media(min-width:48em) {
  26277. .store-details-content .error-tile,
  26278. .store-details-section {
  26279. margin: 64px 0
  26280. }
  26281. }
  26282. .store-details-section__header {
  26283. display: none;
  26284. flex: 0 0 100%;
  26285. flex-flow: row wrap;
  26286. justify-content: space-between;
  26287. align-items: baseline;
  26288. padding-bottom: 30px
  26289. }
  26290. @media(max-width:47.99em) {
  26291. .store-details-section__header {
  26292. order: 2
  26293. }
  26294. }
  26295. @media(min-width:48em) {
  26296. .store-details-section__header {
  26297. display: flex
  26298. }
  26299. }
  26300. .store-details-section__header--mobile {
  26301. display: flex
  26302. }
  26303. @media(min-width:48em) {
  26304. .store-details-section__header--mobile {
  26305. display: none
  26306. }
  26307. }
  26308. .store-details-section__title {
  26309. flex-grow: 1;
  26310. margin: 0
  26311. }
  26312. .store-details-section__content {
  26313. background-color: #fff;
  26314. width: 100%;
  26315. padding-top: 30px;
  26316. padding-bottom: 30px
  26317. }
  26318. @media(max-width:47.99em) {
  26319. .store-details-section__content {
  26320. padding-left: 20px;
  26321. padding-right: 20px;
  26322. border-top: 1px solid #ddd
  26323. }
  26324. }
  26325. @media(min-width:48em) {
  26326. .store-details-section__content {
  26327. display: flex;
  26328. align-items: flex-start;
  26329. flex-flow: row nowrap;
  26330. padding: 40px;
  26331. background-color: #f0f0f0
  26332. }
  26333. }
  26334. @media(max-width:47.99em) {
  26335. .store-details-section__info {
  26336. order: 3
  26337. }
  26338. }
  26339. @media(min-width:48em) {
  26340. .store-details-section__info {
  26341. width: 50%
  26342. }
  26343. }
  26344. .store-details-section__info--placeholder {
  26345. min-width: 180px;
  26346. margin-bottom: 40px
  26347. }
  26348. @media(min-width:48em) {
  26349. .store-details-section__info--placeholder {
  26350. margin-bottom: 0
  26351. }
  26352. .store-details-section__info--placeholder:nth-child(n+3) {
  26353. margin-left: 60px
  26354. }
  26355. }
  26356. @media(max-width:47.99em) {
  26357. .store-details-section__image {
  26358. order: 1;
  26359. margin-left: -20px;
  26360. width: calc(100% + 40px);
  26361. height: 175px;
  26362. display: flex;
  26363. justify-content: center;
  26364. align-items: center;
  26365. overflow: hidden
  26366. }
  26367. }
  26368. @media(min-width:48em) {
  26369. .store-details-section__image {
  26370. padding-left: 20px;
  26371. width: 50%
  26372. }
  26373. }
  26374. .store-details-section__image>img {
  26375. display: block;
  26376. width: 100%
  26377. }
  26378. @media(max-width:47.99em) {
  26379. .store-details-section__image>img {
  26380. flex-shrink: 0
  26381. }
  26382. }
  26383. .store-details-section__info-group {
  26384. display: flex;
  26385. width: 100%;
  26386. margin-bottom: 40px
  26387. }
  26388. .store-details-section__info-group:last-child {
  26389. margin-bottom: 0
  26390. }
  26391. .store-details-section__info-group--placeholder {
  26392. margin-bottom: 20px
  26393. }
  26394. .store-details-section__info-group-info {
  26395. margin-left: 30px;
  26396. width: 100%
  26397. }
  26398. .store-details-section__info-group-info .sprite {
  26399. width: 12px;
  26400. height: 12px;
  26401. margin-right: 10px
  26402. }
  26403. .store-details-section__info-group-info p {
  26404. margin-top: 0;
  26405. margin-bottom: .5em
  26406. }
  26407. .store-details-section__info-group-info--placeholder {
  26408. margin-left: 0
  26409. }
  26410. .store-details-section__hours-list {
  26411. padding: 0;
  26412. margin: 0;
  26413. list-style: none
  26414. }
  26415. .store-details-section__hours-list-item {
  26416. margin-bottom: 5px;
  26417. display: flex;
  26418. justify-content: space-between;
  26419. padding-right: 20px
  26420. }
  26421. .store-details-section__hours-list-hour-text {
  26422. text-align: right;
  26423. margin-left: 14px
  26424. }
  26425. .store-details-section__loading-image {
  26426. width: 100vw;
  26427. height: 400px
  26428. }
  26429. @media(min-width:48em) {
  26430. .store-details-section__loading-image {
  26431. width: 400px
  26432. }
  26433. }
  26434. .store-details-section__info-line-placeholder {
  26435. margin-bottom: 10px
  26436. }
  26437. .store-details-section__info-line-placeholder:last-child {
  26438. margin-bottom: 0
  26439. }
  26440. @media(max-width:47.99em) {
  26441. .store-details-section--store-information {
  26442. display: flex;
  26443. flex-direction: column-reverse
  26444. }
  26445. }
  26446. @media(max-width:47.99em) {
  26447. .store-details-section--store-information .store-details-section__header {
  26448. padding-top: 30px
  26449. }
  26450. }
  26451. .store-details-section--store-information .store-details-section__content {
  26452. display: flex;
  26453. align-items: flex-start;
  26454. flex-flow: column
  26455. }
  26456. @media(max-width:47.99em) {
  26457. .store-details-section--store-information .store-details-section__content {
  26458. padding-top: 0
  26459. }
  26460. }
  26461. @media(min-width:48em) {
  26462. .store-details-section--store-information .store-details-section__content {
  26463. flex-flow: row nowrap
  26464. }
  26465. }
  26466. .store-services-list {
  26467. display: flex;
  26468. flex-flow: column;
  26469. margin: 0;
  26470. padding: 0;
  26471. list-style: none
  26472. }
  26473. @media(min-width:34.375em) {
  26474. .store-services-list {
  26475. flex-flow: row wrap
  26476. }
  26477. }
  26478. .store-services-list__item {
  26479. width: 50%;
  26480. margin-bottom: 10px
  26481. }
  26482. .store-services-list__item:nth-child(n+4) {
  26483. display: none
  26484. }
  26485. @media(min-width:34.375em) {
  26486. .store-services-list__item:nth-child(n+4) {
  26487. display: block
  26488. }
  26489. }
  26490. .store-services-list--expanded .store-services-list__item:nth-child(n+4) {
  26491. display: block
  26492. }
  26493. .refine-search {
  26494. background-color: #f0f0f0;
  26495. min-height: 400px
  26496. }
  26497. @media(min-width:48em) {
  26498. .refine-search {
  26499. padding: 60px 40px
  26500. }
  26501. }
  26502. @media(min-width:64em) {
  26503. .refine-search {
  26504. display: flex
  26505. }
  26506. }
  26507. .refine-search__title {
  26508. display: flex;
  26509. align-items: flex-end;
  26510. padding: 20px 20px 16px
  26511. }
  26512. @media(min-width:48em) {
  26513. .refine-search__title {
  26514. padding: 0 0 16px
  26515. }
  26516. }
  26517. .refine-search__title h3 {
  26518. font-size: .875rem;
  26519. margin: 0
  26520. }
  26521. @media(min-width:48em) {
  26522. .refine-search__title h3 {
  26523. margin-top: 0
  26524. }
  26525. }
  26526. .refine-search__title .sprite {
  26527. margin-right: 10px
  26528. }
  26529. @media(min-width:64em) {
  26530. .refine-search__stores {
  26531. flex: 0 0 30%;
  26532. padding-right: 60px;
  26533. min-width: 360px
  26534. }
  26535. }
  26536. .refine-search__stores-radio-group-single {
  26537. display: flex;
  26538. border-bottom: 1px solid #ddd;
  26539. padding: 0
  26540. }
  26541. .refine-search__stores-radio-group-single:first-child {
  26542. border-top: 1px solid #ddd
  26543. }
  26544. .refine-search__stores-radio-group-single:last-child {
  26545. border-bottom: 1px solid #ddd
  26546. }
  26547. @media(min-width:48em) {
  26548. .refine-search__stores-radio-group-single,
  26549. .refine-search__stores-radio-group-single:first-child,
  26550. .refine-search__stores-radio-group-single:last-child {
  26551. border-color: #f0f0f0
  26552. }
  26553. }
  26554. @media(max-width:47.99em) {
  26555. .refine-search__stores-radio-group-single:nth-child(n+11) {
  26556. display: none
  26557. }
  26558. }
  26559. @media(max-width:47.99em) {
  26560. .refine-search__stores-radio-group--expanded .refine-search__stores-radio-group-single:nth-child(n+11) {
  26561. display: flex
  26562. }
  26563. }
  26564. .refine-search__stores-radio-input {
  26565. opacity: 0;
  26566. position: absolute
  26567. }
  26568. .refine-search__stores-radio-input-label {
  26569. position: relative;
  26570. display: block;
  26571. padding: 20px 22px;
  26572. cursor: pointer
  26573. }
  26574. @media(min-width:48em) {
  26575. .refine-search__stores-radio-input-label {
  26576. padding: 14px 22px
  26577. }
  26578. }
  26579. .refine-search__stores-radio-input-checkmark {
  26580. display: block;
  26581. width: 28px;
  26582. margin: auto;
  26583. fill: #ee3124
  26584. }
  26585. .refine-search__stores-radio-input:checked+.refine-search__stores-radio-input-label,
  26586. .refine-search__stores-radio-input:focus+.refine-search__stores-radio-input-label {
  26587. padding-right: 46px
  26588. }
  26589. @media(max-width:34.365em) {
  26590. .refine-search__stores-radio-input:checked+.refine-search__stores-radio-input-label:before,
  26591. .refine-search__stores-radio-input:focus+.refine-search__stores-radio-input-label:before {
  26592. top: 0;
  26593. bottom: 0;
  26594. left: 0
  26595. }
  26596. }
  26597. .refine-search__stores-radio-input:focus+.refine-search__stores-radio-input-label {
  26598. z-index: 1
  26599. }
  26600. .refine-search__services {
  26601. padding-bottom: 40px
  26602. }
  26603. @media(min-width:48em) {
  26604. .refine-search__services {
  26605. padding: 50px 0 0
  26606. }
  26607. }
  26608. @media(min-width:64em) {
  26609. .refine-search__services {
  26610. padding: 0;
  26611. flex: 0 0 70%
  26612. }
  26613. }
  26614. @media(max-width:47.99em) {
  26615. .refine-search__services-input-wrapper {
  26616. position: absolute;
  26617. top: 0;
  26618. bottom: 0;
  26619. left: 20px;
  26620. height: 18px;
  26621. margin: auto
  26622. }
  26623. }
  26624. .refine-search__services-radio-group {
  26625. display: flex;
  26626. flex-flow: row wrap
  26627. }
  26628. .refine-search__services-radio-group-single {
  26629. position: relative;
  26630. width: 100%;
  26631. margin: 10px 0
  26632. }
  26633. @media(max-width:47.99em) {
  26634. .refine-search__services-radio-group-single {
  26635. margin: 0;
  26636. background: #fff;
  26637. border-bottom: 1px solid #ddd
  26638. }
  26639. .refine-search__services-radio-group-single:first-child {
  26640. border-top: 1px solid #ddd
  26641. }
  26642. }
  26643. @media(min-width:48em) {
  26644. .refine-search__services-radio-group-single {
  26645. width: 50%;
  26646. padding-right: 10px
  26647. }
  26648. }
  26649. @media(min-width:64em) {
  26650. .refine-search__services-radio-group-single {
  26651. width: 33%
  26652. }
  26653. }
  26654. @media(min-width:80em) {
  26655. .refine-search__services-radio-group-single {
  26656. width: 25%
  26657. }
  26658. }
  26659. @media(max-width:47.99em) {
  26660. .refine-search__services-radio-group-single:nth-child(n+11) {
  26661. display: none
  26662. }
  26663. }
  26664. @media(max-width:47.99em) {
  26665. .refine-search__services-radio-group--expanded .refine-search__services-radio-group-single:nth-child(n+11) {
  26666. display: flex
  26667. }
  26668. }
  26669. @media(min-width:48em) {
  26670. .refine-search__services-radio-checkbox-icon {
  26671. background: #fff
  26672. }
  26673. }
  26674. .refine-search__services-radio-label {
  26675. width: 100%;
  26676. display: block
  26677. }
  26678. @media(max-width:47.99em) {
  26679. .refine-search__services-radio-label {
  26680. padding: 20px 20px 20px 58px
  26681. }
  26682. }
  26683. .refine-search__services-radio-text {
  26684. width: 100%
  26685. }
  26686. @media(max-width:47.99em) {
  26687. .refine-search__services-radio-text {
  26688. margin-left: 0
  26689. }
  26690. }
  26691. @media(min-width:64em) {
  26692. .refine-search__services .refine-search__title {
  26693. padding-bottom: 6px
  26694. }
  26695. }
  26696. .refine-search--hidden {
  26697. display: none
  26698. }
  26699. .refine-search__more-button {
  26700. padding: 20px;
  26701. border-bottom: 1px solid #ddd
  26702. }
  26703. @media(min-width:48em) {
  26704. .refine-search__more-button {
  26705. display: none
  26706. }
  26707. }
  26708. .refine-search__more-button-inner {
  26709. display: flex;
  26710. align-items: center;
  26711. justify-content: center
  26712. }
  26713. .refine-search__more-button .sprite {
  26714. width: 10px;
  26715. height: 10px;
  26716. margin-right: 10px
  26717. }
  26718. .flyer__subheader,
  26719. .flyers__subheader {
  26720. border-top: 1px solid #ddd;
  26721. border-bottom: 1px solid #ddd
  26722. }
  26723. .flyer__subheader .container,
  26724. .flyer__subheader .eflyers-subscription__container,
  26725. .flyer__subheader .homepage-join__inner,
  26726. .flyer__subheader .points-days-banners-section,
  26727. .flyer__subheader .points-days-cta-section,
  26728. .flyer__subheader .points-days-offers-section,
  26729. .flyer__subheader .points-days-ts-and-cs__container,
  26730. .flyer__subheader .weekly-flyer-opt-in__inner,
  26731. .flyers__subheader .container,
  26732. .flyers__subheader .eflyers-subscription__container,
  26733. .flyers__subheader .homepage-join__inner,
  26734. .flyers__subheader .points-days-banners-section,
  26735. .flyers__subheader .points-days-cta-section,
  26736. .flyers__subheader .points-days-offers-section,
  26737. .flyers__subheader .points-days-ts-and-cs__container,
  26738. .flyers__subheader .weekly-flyer-opt-in__inner {
  26739. max-width: none
  26740. }
  26741. .flyer__subheader-inner,
  26742. .flyers__subheader-inner {
  26743. height: 70px;
  26744. display: flex;
  26745. justify-content: space-between;
  26746. align-items: center
  26747. }
  26748. .flyers__results-list {
  26749. background: #f0f0f0;
  26750. padding-top: 40px;
  26751. padding-bottom: 80px
  26752. }
  26753. .flyers__results-list--home-stores {
  26754. padding-bottom: 16px
  26755. }
  26756. .flyers__results-list-inner {
  26757. margin: 0 auto;
  26758. max-width: 960px;
  26759. display: flex;
  26760. flex-flow: row wrap;
  26761. justify-content: space-between
  26762. }
  26763. .flyers__view-more-button {
  26764. margin-top: 16px
  26765. }
  26766. .flyers-error-tile {
  26767. margin-top: 60px;
  26768. margin-bottom: 100px
  26769. }
  26770. .flyer__subheader {
  26771. border-top: none;
  26772. border-bottom: none;
  26773. margin-top: 4px
  26774. }
  26775. @media(min-width:34.375em) {
  26776. .flyer__subheader-date {
  26777. display: flex
  26778. }
  26779. }
  26780. .flyer__subheader-date-inner {
  26781. display: flex;
  26782. align-items: center;
  26783. flex-shrink: 0
  26784. }
  26785. .flyer__subheader-date .sprite {
  26786. margin-right: 20px;
  26787. height: 30px;
  26788. width: 100px
  26789. }
  26790. .flyer__subheader-date--placeholder {
  26791. margin-left: 50px
  26792. }
  26793. .flyer__state {
  26794. color: #191919
  26795. }
  26796. .flyer__state--new {
  26797. color: #007a7c
  26798. }
  26799. .flyer__state--expiring-soon {
  26800. color: #0075ff
  26801. }
  26802. .flyer__date {
  26803. color: #655c6c
  26804. }
  26805. .flyer__date:before {
  26806. content: "•";
  26807. margin: 0 8px
  26808. }
  26809. .flyer__flipp-container {
  26810. background: rgba(238, 49, 36, .1);
  26811. padding: 20px
  26812. }
  26813. .flyer__missing-flyers {
  26814. background-color: #f0f0f0
  26815. }
  26816. .flyer__missing-flyers-content {
  26817. text-align: center;
  26818. padding: 120px 50px
  26819. }
  26820. .flyer__missing-flyers-text {
  26821. margin-bottom: 40px
  26822. }
  26823. .flyer__missing-flyers-icon {
  26824. width: 100px;
  26825. height: auto
  26826. }
  26827. @media(min-width:48em) {
  26828. .flyer__missing-flyers-icon {
  26829. width: 150px
  26830. }
  26831. }
  26832. .flyers-header__search-container {
  26833. margin-top: 20px
  26834. }
  26835. @media(min-width:48em) {
  26836. .flyers-header__search-container {
  26837. margin-top: 30px
  26838. }
  26839. }
  26840. .flyers-header__insiders .flyers-header__subtitle,
  26841. .flyers-header__insiders .flyers-header__title {
  26842. color: #fff
  26843. }
  26844. .contact-us__container {
  26845. margin: 0 auto;
  26846. align-items: center;
  26847. display: flex;
  26848. flex-direction: column;
  26849. padding-bottom: 32px
  26850. }
  26851. @media(min-width:64em) {
  26852. .contact-us__container {
  26853. width: 840px;
  26854. padding: 0 0 112px
  26855. }
  26856. }
  26857. @media(min-width:64em) {
  26858. .contact-us__container--unauthed .call-centre-details {
  26859. margin-top: 48px
  26860. }
  26861. }
  26862. .contact-us__form-selection {
  26863. padding-top: 24px
  26864. }
  26865. @media(min-width:64em) {
  26866. .contact-us__form-selection {
  26867. width: 100%;
  26868. padding-top: 48px
  26869. }
  26870. }
  26871. .points-days-page .points-days-header {
  26872. padding: 24px 16px 40px;
  26873. margin-bottom: 24px
  26874. }
  26875. .points-days-page .points-days-header__title {
  26876. margin: 0 0 8px;
  26877. color: #ac342a
  26878. }
  26879. @media(min-width:48em) {
  26880. .points-days-page .points-days-header {
  26881. padding: 50px 100px;
  26882. margin-bottom: 32px
  26883. }
  26884. }
  26885. @media(min-width:64em) {
  26886. .points-days-page .points-days-header {
  26887. margin-bottom: 48px
  26888. }
  26889. }
  26890. @media(min-width:64em) {
  26891. .points-days-page .points-days-header__text-section {
  26892. max-width: 595px;
  26893. margin-left: 100px
  26894. }
  26895. }
  26896. .points-days-page--pre-promo .points-days-cta-section {
  26897. margin-bottom: 48px
  26898. }
  26899. @media(min-width:48em) {
  26900. .points-days-page--pre-promo .points-days-cta-section {
  26901. margin-bottom: 64px
  26902. }
  26903. }
  26904. @media(min-width:64em) {
  26905. .points-days-page--pre-promo .points-days-cta-section {
  26906. margin-bottom: 96px
  26907. }
  26908. }
  26909. .points-days-page--pre-promo .points-days-mobile {
  26910. margin-bottom: 48px
  26911. }
  26912. .points-days-page--pre-promo .points-days-mobile__title {
  26913. color: #ac342a
  26914. }
  26915. @media(min-width:48em) {
  26916. .points-days-page--pre-promo .points-days-mobile {
  26917. margin-bottom: 32px
  26918. }
  26919. }
  26920. @media(min-width:64em) {
  26921. .points-days-page--pre-promo .points-days-mobile {
  26922. margin-bottom: 96px
  26923. }
  26924. }
  26925. .points-days-page--pre-promo .points-days-banners-section {
  26926. margin-bottom: 32px
  26927. }
  26928. @media(min-width:48em) {
  26929. .points-days-page--pre-promo .points-days-banners-section {
  26930. margin-bottom: 78px
  26931. }
  26932. }
  26933. @media(min-width:64em) {
  26934. .points-days-page--pre-promo .points-days-banners-section {
  26935. margin-bottom: 64px
  26936. }
  26937. }
  26938. .points-days-page--promo .points-days-cta-section {
  26939. margin-bottom: 24px
  26940. }
  26941. @media(min-width:48em) {
  26942. .points-days-page--promo .points-days-cta-section {
  26943. margin-bottom: 32px
  26944. }
  26945. }
  26946. @media(min-width:64em) {
  26947. .points-days-page--promo .points-days-cta-section {
  26948. margin-bottom: 48px
  26949. }
  26950. }
  26951. .points-days-page--promo .points-days-mobile {
  26952. margin-bottom: 56px
  26953. }
  26954. @media(min-width:48em) {
  26955. .points-days-page--promo .points-days-mobile {
  26956. margin-bottom: 64px
  26957. }
  26958. }
  26959. @media(min-width:64em) {
  26960. .points-days-page--promo .points-days-mobile {
  26961. margin-bottom: 96px
  26962. }
  26963. }
  26964. .points-days-page--promo .points-days-offers-section {
  26965. margin-bottom: 48px
  26966. }
  26967. @media(min-width:48em) {
  26968. .points-days-page--promo .points-days-offers-section {
  26969. margin-bottom: 64px
  26970. }
  26971. }
  26972. @media(min-width:64em) {
  26973. .points-days-page--promo .points-days-offers-section {
  26974. margin-bottom: 96px
  26975. }
  26976. }
  26977. .points-days-page--promo .points-days-banners-section {
  26978. margin-bottom: 32px
  26979. }
  26980. @media(min-width:48em) {
  26981. .points-days-page--promo .points-days-banners-section {
  26982. margin-bottom: 78px
  26983. }
  26984. }
  26985. @media(min-width:64em) {
  26986. .points-days-page--promo .points-days-banners-section {
  26987. margin-bottom: 64px
  26988. }
  26989. }
  26990. .shopping-list-page {
  26991. display: flex;
  26992. flex-direction: column;
  26993. flex: 1;
  26994. background-color: snow
  26995. }
  26996. .shopping-list-page .shopping-list-container {
  26997. width: 100%;
  26998. padding: 0 16px;
  26999. margin: -125px auto 40px;
  27000. z-index: 1
  27001. }
  27002. @media(min-width:48em) {
  27003. .shopping-list-page .shopping-list-container {
  27004. margin: -140px auto 40px
  27005. }
  27006. }
  27007. .shopping-list-page .shopping-list {
  27008. max-width: 792px;
  27009. width: 100%;
  27010. margin: 0 auto;
  27011. display: flex;
  27012. flex-direction: column;
  27013. align-items: center;
  27014. justify-content: center;
  27015. background-color: #fff;
  27016. border-radius: 16px;
  27017. box-shadow: 0 4px 12px rgba(158, 147, 166, .24), 0 4px 6px rgba(158, 147, 166, .24);
  27018. overflow: hidden
  27019. }
  27020. .shopping-list-page .shopping-list__empty img {
  27021. margin-bottom: 56px
  27022. }
  27023. @media(min-width:48em) {
  27024. .shopping-list-page .shopping-list__empty img {
  27025. margin-bottom: 60px
  27026. }
  27027. }
  27028. .shopping-list-page .shopping-list__item-list-placeholder {
  27029. min-height: 200px
  27030. }
  27031. .shopping-list-page .shopping-list__item-list-placeholder .circle-loader {
  27032. margin: 140px auto 0
  27033. }
  27034. .shopping-list-page .shopping-list__actions {
  27035. display: flex;
  27036. flex-direction: row-reverse;
  27037. align-items: flex-start;
  27038. justify-content: space-between;
  27039. width: 100%;
  27040. max-width: 792px;
  27041. margin: 16px auto 0
  27042. }
  27043. .shopping-list-page .shopping-list__actions--delete {
  27044. margin-left: 60px;
  27045. white-space: nowrap
  27046. }
  27047. .shopping-list-page .shopping-list__actions--copy-to-clipboard,
  27048. .shopping-list-page .shopping-list__actions--delete {
  27049. text-align: left
  27050. }
  27051. .shopping-list-page .shopping-list__actions--copy-to-clipboard-textarea {
  27052. display: none
  27053. }
  27054. .enrol-flow {
  27055. overflow: hidden;
  27056. background: snow
  27057. }
  27058. .enrol-flow .flow-progress-bar {
  27059. padding: 24px 0
  27060. }
  27061. @media(min-width:48em) {
  27062. .enrol-flow .flow-progress-bar {
  27063. padding: 54px 0 24px
  27064. }
  27065. }
  27066. .enrol-flow .flow-progress-bar--rounded-corners .progress-bar__parent {
  27067. border-radius: 5px;
  27068. height: 8px;
  27069. background-color: #f4f1f6
  27070. }
  27071. .enrol-flow .flow-progress-bar--rounded-corners .progress-bar__parent:not(:first-child) {
  27072. margin-left: 8px
  27073. }
  27074. .enrol-flow .flow-header {
  27075. padding-bottom: 24px
  27076. }
  27077. @media(min-width:48em) {
  27078. .enrol-flow .flow-header {
  27079. padding-bottom: 34px
  27080. }
  27081. }
  27082. .enrol-flow .flow-header__title {
  27083. color: #ac342a
  27084. }
  27085. .enrol-flow .flow-header__title sup {
  27086. font-size: 14px
  27087. }
  27088. .enrol-flow .flow-header__sub-title {
  27089. margin: 24px auto 0;
  27090. color: #6c221a;
  27091. max-width: -moz-fit-content;
  27092. max-width: fit-content
  27093. }
  27094. .enrol-flow .flow-header__sub-title sup {
  27095. font-size: 10px
  27096. }
  27097. .enrol-flow .flow-tile {
  27098. box-shadow: 0 8px 10px rgba(158, 147, 166, .3), 0 6px 30px rgba(158, 147, 166, .12), 0 16px 24px rgba(158, 147, 166, .14);
  27099. border-radius: 8px;
  27100. max-width: 792px;
  27101. padding: 24px 20px
  27102. }
  27103. @media(min-width:48em) {
  27104. .enrol-flow .flow-tile {
  27105. padding: 40px 20px;
  27106. width: 575px
  27107. }
  27108. }
  27109. @media(min-width:64em) {
  27110. .enrol-flow .flow-tile {
  27111. width: 792px
  27112. }
  27113. }
  27114. .enrol-flow .main-header__background {
  27115. z-index: 0
  27116. }
  27117. .enrol-flow .flow-body__inner {
  27118. max-width: 792px
  27119. }
  27120. .receipt-terms .utility-content {
  27121. margin: 0 auto
  27122. }
  27123. .receipt-terms__section {
  27124. margin: 38px 0 80px;
  27125. padding: 30px 18px;
  27126. background-color: #fff
  27127. }
  27128. .receipt-terms__section p {
  27129. margin: 0
  27130. }
  27131. @media(min-width:48em) {
  27132. .receipt-terms__section {
  27133. margin-top: 70px;
  27134. padding: 40px
  27135. }
  27136. }