{"version":3,"file":"component---src-pages-video-hub-js-e00881c015769b9f235b.js","mappings":"0MAEIA,EAAY,CAAC,YAAa,YAAa,SAAU,OASjDC,EAAqB,SAA4BC,EAAMC,EAAUC,GACnE,OAAgB,IAAZA,GAAgC,KAAZA,EACfF,EAAO,MAAQ,OAASC,EACV,SAAZC,EACFF,EAAO,WAAa,OAASC,EAAW,QAE1CD,EAAO,OAASE,EAAU,OAASD,EAAW,IAAMC,CAC7D,EACIC,EAAM,SAAaC,GACrB,IAAIC,EAAYD,EAAMC,UACpBC,EAAYF,EAAME,UAClBC,EAASH,EAAMG,OACfC,EAAMJ,EAAMK,IACZC,GAAa,OAA8BN,EAAON,GAChDa,EAAa,GACjBJ,EAAOK,SAAQ,SAAUX,EAAUY,GACjC,IAAIC,EAAaV,EAAMH,GAEvB,UADOS,EAAWT,GACba,GAA6B,KAAfA,EAAnB,CAGA,IAAId,GAAQa,EACZ,IAAI,QAASC,GAAa,CACxB,IAAIC,EACAC,EAAkBhB,EAAO,IAAM,IAAMC,EAAW,IAChDgB,EAAWlB,EAAmBC,EAAMC,EAAUa,EAAWI,MAC7DP,EAAWQ,MAAK,QAAgB,MAAYJ,EAAc,CAAC,GAAeE,GAAYH,EAAWI,MAA4B,KAApBJ,EAAWI,KAAaH,EAAY,QAAUC,EAAkBF,EAAWM,OAASN,EAAWM,OAA8B,IAArBN,EAAWM,MAAaL,EAAY,SAAWC,EAAkBF,EAAWO,QAAUP,EAAWO,QAAgC,IAAtBP,EAAWO,OAAcN,IAAeT,GACtW,KAAO,CACL,IAAIgB,EAAYvB,EAAmBC,EAAMC,EAAUa,GACnDH,EAAWQ,KAAKG,EAClB,CAVA,CAWF,IACKX,EAAWY,QACdZ,EAAWQ,KAAK,OAElB,IAAIK,GAAU,QAAgB,IAAWnB,EAAWM,GAAaL,GACjE,OAAoB,gBAAoBE,GAAK,OAAS,CAAC,EAAGE,EAAY,CACpEL,UAAWmB,IAEf,EACArB,EAAIsB,aA5Ce,CACjBhB,IAAK,MACLF,OAHc,CAAC,KAAM,KAAM,KAAM,KAAM,OA8CzC,K,4FClDIT,EAAY,CAAC,YAAa,YAAa,YAAa,MAAO,OAAQ,UASnE4B,EAAM,SAAatB,GACrB,IAAIC,EAAYD,EAAMC,UACpBC,EAAYF,EAAME,UAClBqB,EAAYvB,EAAMuB,UAClBnB,EAAMJ,EAAMK,IACZmB,EAAOxB,EAAMwB,KACbrB,EAASH,EAAMG,OACfG,GAAa,OAA8BN,EAAON,GAChDa,EAAa,GACjBJ,EAAOK,SAAQ,SAAUX,EAAUY,GACjC,IAAIX,EAAUE,EAAMH,GAEpB,UADOS,EAAWT,GACbC,EAAL,CAGA,IAAIF,GAAQa,EACZF,EAAWQ,KAAKnB,EAAO,YAAcE,EAAU,YAAcD,EAAW,IAAMC,EAF9E,CAGF,IACA,IAAIsB,GAAU,QAAgB,IAAWnB,EAAWsB,EAAY,aAAe,KAAMC,EAAO,WAAa,MAAOjB,GAAaL,GAC7H,OAAoB,gBAAoBE,GAAK,OAAS,CAAC,EAAGE,EAAY,CACpEL,UAAWmB,IAEf,EACAE,EAAID,aA3Be,CACjBhB,IAAK,MACLF,OAHiB,CAAC,KAAM,KAAM,KAAM,KAAM,OA6B5C,K,sNClBMsB,EAAOC,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,oBAAAC,YAAA,gBAAVF,CAAU,igCAoBGG,EAAAA,EAMIA,EAAAA,EAOAC,EAAAA,EAOAC,EAAAA,EAOAC,EAAAA,EAOAC,EAAAA,GA2BT,SAAAjC,GAAK,OAAIA,EAAMkC,MAAMC,OAAOC,GAAG,IAK9CC,EAAiBX,EAAAA,QAAAA,EAAAA,WAAQ,CAAAC,YAAA,8BAAAC,YAAA,gBAARF,CAAQ,+qBAelB,SAAA1B,GAAK,OAAIA,EAAMkC,MAAMC,OAAOG,KAAK,IAMlB,SAAAtC,GAAK,OAAIA,EAAMkC,MAAMC,OAAOI,MAAM,IAIlC,SAAAvC,GAAK,OAAIA,EAAMkC,MAAMC,OAAOK,IAAI,IAIhC,SAAAxC,GAAK,OAAIA,EAAMkC,MAAMC,OAAOM,KAAK,IAIjC,SAAAzC,GAAK,OAAIA,EAAMkC,MAAMC,OAAOO,MAAM,IAIlC,SAAA1C,GAAK,OAAIA,EAAMkC,MAAMC,OAAOQ,MAAM,IAC7C,SAAA3C,GAAK,OAAIA,EAAMkC,MAAMC,OAAOS,KAAK,IAYjC,SAAA5C,GAAK,OAAIA,EAAMkC,MAAMC,OAAOG,KAAK,IACtB,SAAAtC,GAAK,OAAIA,EAAMkC,MAAMC,OAAOS,KAAK,GAWhDC,EAAAA,EAAAA,IASPC,EAAW,SAAAC,GACb,SAAAD,EAAY9C,GAAQ,IAADgD,EAKd,OAJDA,EAAAD,EAAAE,KAAA,KAAMjD,IAAM,MAOhBkD,YAAc,SAACC,EAAGC,GACdD,EAAEE,iBAEFL,EAAKM,SAAS,CACVF,IAAKA,EACLG,WAAYP,EAAKQ,MAAMD,WAE/B,EAACP,EAEDS,mBAAqB,SAACN,EAAGC,GACrBD,EAAEE,iBAEFL,EAAKM,SAAS,CACVF,IAAKA,EACLM,kBAAmBV,EAAKQ,MAAME,kBAEtC,EArBIV,EAAKQ,MAAQ,CACTD,WAAW,GACdP,CACL,CAyEC,OAhFYW,EAAAA,EAAAA,GAAAb,EAAAC,GAOZD,EAAAc,UAoBDC,OAAA,WAAU,IAADC,EAAA,KACDC,EAAOC,KAAKhE,MAAM+D,KAEtB,OACIE,EAAAA,cAACxC,EAAI,CAACyC,IAAKF,KAAKhE,MAAM+D,KAAKI,GAAIlE,UAAc+D,KAAKhE,MAAM+D,KAAKK,KAAI,IAAIJ,KAAKhE,MAAMqE,OAC5EJ,EAAAA,cAAA,OAAKhE,UAAU,gBAEfgE,EAAAA,cAAA,OAAKhE,UAAU,gCACXgE,EAAAA,cAAA,MAAIK,wBAAyB,CAACC,OAAQP,KAAKhE,MAAM+D,KAAKS,SACtDP,EAAAA,cAAA,SAAIF,EAAKU,OAEbR,EAAAA,cAAA,OAAKhE,UAAU,eACQ,QAAlB8D,EAAKW,UACNT,EAAAA,cAAC5B,EAAc,CAACsC,UAAQ,EAACC,OAAO,SAASC,KAAMd,EAAKe,KAAM7E,UAAW+D,KAAKhE,MAAMqE,OAAO,eAC7D,WAArBL,KAAKhE,MAAMqE,MACRJ,EAAAA,cAAAA,EAAAA,SAAA,KACIA,EAAAA,cAAA,OAAKhE,UAAU,YAAYmD,IAAK2B,EAAAA,EAAcC,IAAI,KAClDf,EAAAA,cAAA,OAAKhE,UAAU,QAAQmD,IAAK6B,EAAAA,EAAmBD,IAAI,MAGnDf,EAAAA,cAAA,OAAKb,IAAK6B,EAAAA,EAAmBD,IAAI,MAI1B,UAAlBjB,EAAKW,UACNT,EAAAA,cAAC5B,EAAc,CAAC6C,QAAS,SAAC/B,GAAC,OAAKW,EAAKL,mBAAmBN,EAAGY,EAAKe,KAAK,EAAE,aAAW,aAAa7E,UAAW+D,KAAKhE,MAAMqE,OAAO,eAClG,WAArBL,KAAKhE,MAAMqE,MACRJ,EAAAA,cAAAA,EAAAA,SAAA,KACIA,EAAAA,cAAA,OAAKhE,UAAU,YAAYmD,IAAK+B,EAAAA,EAAUH,IAAI,KAC9Cf,EAAAA,cAAA,OAAKhE,UAAU,QAAQmD,IAAKgC,EAAAA,EAAeJ,IAAI,MAG/Cf,EAAAA,cAAA,OAAKb,IAAKgC,EAAAA,EAAeJ,IAAI,MAItB,QAAlBjB,EAAKW,UACNT,EAAAA,cAAC5B,EAAc,CAACuC,OAASb,EAAKe,KAAKO,SAAS,2BAAwC,QAAX,SAAoBR,KAAMd,EAAKe,KAAMH,UAAWZ,EAAKe,KAAKO,SAAS,2BAA4BpF,UAAW+D,KAAKhE,MAAMqE,OAAO,gBAC3K,WAArBL,KAAKhE,MAAMqE,MACRJ,EAAAA,cAAAA,EAAAA,SAAA,KACIA,EAAAA,cAAA,OAAKhE,UAAU,YAAYmD,IAAKkC,EAAAA,EAAWN,IAAI,KAC/Cf,EAAAA,cAAA,OAAKhE,UAAU,QAAQmD,IAAKmC,EAAAA,EAAgBP,IAAI,MAGhDf,EAAAA,cAAA,OAAKb,IAAKmC,EAAAA,EAAgBP,IAAI,OAK9Cf,EAAAA,cAACuB,EAAAA,EAAU,CAACtC,YAAac,KAAKd,YAAaE,IAAKY,KAAKR,MAAMJ,IAAKG,UAAWS,KAAKR,MAAMD,YACtFU,EAAAA,cAACwB,EAAAA,EAAY,CAACvC,YAAac,KAAKP,mBAAoBL,IAAKY,KAAKR,MAAMJ,IAAKG,UAAWS,KAAKR,MAAME,mBAG3G,EAACZ,CAAA,CAhFY,CAAS4C,EAAAA,WAmF1B,K,6FC5PMC,GAASjE,EAAAA,EAAAA,SAAOkE,EAAAA,GAAMC,WAAA,CAAAlE,YAAA,qBAAAC,YAAA,eAAbF,CAAa,kQA+BtB8D,EAAU,SAAAzC,GAAA,SAAAyC,IAAA,OAAAzC,EAAA+C,MAAA,KAAAC,YAAA,KAeX,OAfWpC,EAAAA,EAAAA,GAAA6B,EAAAzC,GAAAyC,EAAA5B,UACZC,OAAA,WACI,OACII,EAAAA,cAAC0B,EAAM,CAACK,OAAQhC,KAAKhE,MAAMuD,UAAW0C,OAAQjC,KAAKhE,MAAMkD,YAAagD,UAAU,GAC5EjC,EAAAA,cAACkC,EAAAA,EAAW,CAACjB,QAASlB,KAAKhE,MAAMkD,aAC7Be,EAAAA,cAAA,QAAMhE,UAAU,WAAU,UAE9BgE,EAAAA,cAACmC,EAAAA,EAAS,KACNnC,EAAAA,cAAA,OAAKhE,UAAU,iBACXgE,EAAAA,cAAA,UAAQb,IAAG,kCAAoCY,KAAKhE,MAAMoD,IAAOiD,MAAM,MAAMC,OAAO,MAAMC,YAAY,IAC9FC,MAAM,uBAAuBC,iBAAe,MAKxE,EAACjB,CAAA,CAfW,CAASE,EAAAA,WAkBzB,K,kOCjDMgB,EAAYhF,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,sBAAAC,YAAA,gBAAVF,CAAU,0KAiBtBiF,EAAQ,SAAA5D,GAAA,SAAA4D,IAAA,QAAA3D,EAAA4D,EAAAb,UAAA5E,OAAA0F,EAAA,IAAAC,MAAAF,GAAAG,EAAA,EAAAA,EAAAH,EAAAG,IAAAF,EAAAE,GAAAhB,UAAAgB,GAyDT,OAzDS/D,EAAAD,EAAAE,KAAA6C,MAAA/C,EAAA,OAAAiE,OAAAH,KAAA,MACVI,cAAgB,SAAC5G,EAAKgE,GAClB,IAAI6C,EAAc,GACdC,EAAY,EAGVC,EAAepE,EAAKhD,MAAMqH,KAAKC,sBAAsBC,MAAMC,KAAI,SAACC,EAAUhH,GAC5E,OAAOuC,EAAKhD,MAAM0H,MAAMF,KAAI,SAACG,GACzB,GAAIA,IAAQC,WAAWH,EAASI,KAAK1D,IAAK,CACtC,IAAI2D,EAAaL,EAASI,KAAKxH,IAI/B,GAFA6G,EAAYnG,KAAK+G,GAEbA,IAAezH,EAEf,OADA8G,IAEIlD,EAAAA,cAACnB,EAAAA,EAAW,CAACoB,IAAKuD,EAASI,KAAK1D,GAAIE,MAAOA,EAAON,KAAM0D,EAASI,MAG7E,CAEJ,GACJ,IAEME,GAAUC,EAAAA,EAAAA,GAAO,IAAIC,IAAIf,IAC/B,GAAIC,EAAY,EACZ,OACIlD,EAAAA,cAACyC,EAAS,KACG,YAARrG,GAAqB0H,EAAW1C,SAAS,YACtCpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,sBAEP,cAAR5D,GAAuB0H,EAAW1C,SAAS,cACxCpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,wBAEP,WAAR5D,GAAoB0H,EAAW1C,SAAS,WACrCpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,sBAEP,cAAR5D,GAAuB0H,EAAW1C,SAAS,cACxCpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,cAEP,gBAAR5D,GAAyB0H,EAAW1C,SAAS,gBAC1CpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,gBAEP,eAAR5D,GAAwB0H,EAAW1C,SAAS,eACzCpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,uBAEP,yBAAR5D,GAAkC0H,EAAW1C,SAAS,yBACnDpB,EAAAA,cAAA,UAAIA,EAAAA,cAAA,cAAQ,6BAEhBA,EAAAA,cAAA,OAAKhE,UAAU,qBACXgE,EAAAA,cAAA,OAAKhE,UAAU,aACVmH,IAMzB,EAACpE,CAAA,CAgBA,OAzESW,EAAAA,EAAAA,GAAAgD,EAAA5D,GAyDT4D,EAAA/C,UAEDC,OAAA,WACI,OACII,EAAAA,cAAA,OAAKiE,MAAO,CACRC,QAAS,SAERnE,KAAKiD,cAAc,UAAW,UAC9BjD,KAAKiD,cAAc,YAAa,QAChCjD,KAAKiD,cAAc,SAAU,UAC7BjD,KAAKiD,cAAc,YAAa,UAChCjD,KAAKiD,cAAc,cAAe,UAClCjD,KAAKiD,cAAc,aAAc,SACjCjD,KAAKiD,cAAc,uBAAwB,UAGxD,EAACN,CAAA,CAzES,CAASjB,EAAAA,WAsGvB,EA1Bc,SAAC1F,GAAK,OAChBiE,EAAAA,cAACmE,EAAAA,YAAW,CACRvE,OAAQ,SAAAwD,GAAI,OACRpD,EAAAA,cAAC0C,EAAQ0B,OAAAC,OAAA,GAAKtI,EAAK,CAAEqH,KAAMA,IAAO,EAEtCkB,MAAK,cAkBP,E,gCCtGAC,EAAW9G,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,sBAAAC,YAAA,eAAVF,CAAU,mCAIrB+G,EAAc/G,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,yBAAAC,YAAA,eAAVF,CAAU,uFAKnBmB,EAAAA,EAAAA,IAIL6F,EAAehH,EAAAA,QAAAA,OAAAA,WAAa,CAAAC,YAAA,0BAAAC,YAAA,eAAbF,CAAa,0dA8C5BiH,EAAejH,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,0BAAAC,YAAA,eAAVF,CAAU,2GAIpBmB,EAAAA,EAAAA,IAOL+F,EAAQlH,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,mBAAAC,YAAA,eAAVF,CAAU,oeAIbmB,EAAAA,EAAAA,GAIAA,EAAAA,EAAAA,GAIAA,EAAAA,EAAAA,IAuCLgG,EAAenH,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,0BAAAC,YAAA,eAAVF,CAAU,gcAIpBmB,EAAAA,EAAAA,IAIoB,SAAA7C,GAAK,OAAIA,EAAMkC,MAAMC,OAAO2G,SAAS,IACtC,SAAA9I,GAAK,OAAIA,EAAMkC,MAAMC,OAAO2G,SAAS,IAuBpD,SAAA9I,GAAK,OAAIA,EAAMkC,MAAMC,OAAOC,GAAG,IAaxC2G,EAAWrH,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,sBAAAC,YAAA,eAAVF,CAAU,oKAkBrBsH,EAAStH,EAAAA,QAAAA,IAAAA,WAAU,CAAAC,YAAA,oBAAAC,YAAA,eAAVF,CAAU,gFAwDnBuH,EAAY,SAAAlG,GAChB,SAAAkG,EAAYjJ,GAAQ,IAADgD,EAShB,OARDA,EAAAD,EAAAE,KAAA,KAAMjD,IAAM,MAqBdkJ,eAAiB,SAACC,GAChB,IAAIC,EAAqBpG,EAAKQ,MAAM4F,mBAEpC,GAAIA,EAAmB/D,SAAS8D,GAAW,CACzC,IAAME,EAAQD,EAAmBE,QAAQH,GACzCC,EAAmBG,OAAOF,EAAO,EACnC,MACED,EAAmBrI,KAAKoI,GAG1BnG,EAAKM,SAAS,CAAC8F,mBAAAA,GACjB,EAACpG,EAEDwG,iBAAmB,SAACrG,EAAGC,GACrBD,EAAEE,iBAEFL,EAAKM,SAAS,CACZF,IAAKA,EACLqG,gBAAiBzG,EAAKQ,MAAMiG,gBAEhC,EAACzG,EAEDS,mBAAqB,SAACN,EAAGC,GACvBD,EAAEE,iBAEFL,EAAKM,SAAS,CACZF,IAAKA,EACLM,kBAAmBV,EAAKQ,MAAME,kBAElC,EAACV,EAED0G,eAAiB,SAACvG,EAAGgB,GAAQ,IAADwF,EAC1BxG,EAAEE,iBACF,IAAMuG,EAAWzF,EACb0F,EAAW,GAEX7G,EAAKQ,MAAMqG,WAAaD,IAC1BC,EAAWD,GAGb5G,EAAKM,WAAQqG,EAAA,IACVC,IAAY5G,EAAKQ,MAAMoG,GAASD,EACjCE,SAAUA,EAAQF,EAClBG,cAAe,IAAGH,GAGtB,EAAC3G,EAED+G,oBAAsB,SAAC5G,EAAGgB,GACxB,IAAM6F,EAAUC,SAASC,eAAe/F,GAClCgG,EAAuBH,EAAQI,YACjCC,EAAaL,EAAQK,YAEzBA,GAAc,MAEIF,IAChBE,EAAaF,GAGfH,EAAQK,WAAaA,CAEvB,EAACrH,EAEDsH,qBAAuB,SAACnH,EAAGgB,GACzB,IAAM6F,EAAUC,SAASC,eAAe/F,GACpCkG,EAAaL,EAAQK,YAEzBA,GAAc,MAEI,IAChBA,EAAa,GAGfL,EAAQK,WAAaA,CACvB,EA7FErH,EAAKQ,MAAQ,CACXiG,gBAAgB,EAChB/F,kBAAkB,EAClB0F,mBAAoB,GACpBS,SAAU,GACVC,cAAe,GAChB9G,CACH,EAXgBW,EAAAA,EAAAA,GAAAsF,EAAAlG,GAWf,IAAAwH,EAAAtB,EAAArF,UA+OA,OA/OA2G,EAEDC,kBAAA,WAEE,IAAInE,EAAQ4D,SAASQ,uBAAuB,8BAA8B,GAAGC,YAE7E1G,KAAKV,SAAS,CACZqH,eAAgBtE,GAGpB,EAACkE,EA8ED1G,OAAA,WAAU,IAADC,EAAA,KAuBD8G,EAAS5G,KAAKhE,MAAMqH,KAAKwD,gBAAgBtD,MAAMC,KAAI,SAAAsD,EAASrK,GAAO,IAEnEsK,EAFqDlD,EAAIiD,EAAJjD,KAIrD8C,EAAiB7G,EAAKN,MAAMmH,eAKhC,OAFAI,EAFsC,IAApBlD,EAAKH,MAAMvG,OAEFwJ,EAGzB1G,EAAAA,cAAC2E,EAAK,CAAC1E,IAAKzD,EAAGyH,MAAO,CACpB8C,aAAclH,EAAKN,MAAMqG,WAAQ,YAAiBpJ,EAAMqD,EAAKN,MAAMsG,cAAgB,GAAK,IAExF7F,EAAAA,cAAC4E,EAAY,KACX5E,EAAAA,cAACyE,EAAY,CAACxD,QAAS,SAAC/B,GAAC,OAAKW,EAAKL,mBAAmBN,EAAG0E,EAAKoD,MAAM,EAAE,aAAW,aAAaC,KAAK,SACrFC,SAAS,KACrBlH,EAAAA,cAAA,OACEb,IAAKyE,EAAKuD,UACVpG,IAAK6C,EAAKrD,MACVA,MAAOqD,EAAKrD,QAEdP,EAAAA,cAAA,OAAKhE,UAAU,kBACfgE,EAAAA,cAAA,OAAKhE,UAAU,YACbgE,EAAAA,cAAA,OAAKb,IAAKiI,EAAAA,EAASrG,IAAI,GAAG/E,UAAU,gBAIxCgE,EAAAA,cAAA,MAAIhE,UAAU,QAAQ4H,EAAKrD,OAE3BP,EAAAA,cAAA,SAAI4D,EAAKyD,MAETrH,EAAAA,cAAA,UAAQiB,QAAS,SAAC/B,GAAC,OAAKW,EAAK4F,eAAevG,EAAE,YAAa1C,EAAI,GAAE,4BAE/DwD,EAAAA,cAAA,OAAKhE,UAAU,YAAYmD,IC9ZzC,q3ED8ZuD4B,IAAI,KAC7Cf,EAAAA,cAAA,OAAKhE,UAAU,QAAQmD,IE/ZrC,y3EF+ZsD4B,IAAI,OAGhDf,EAAAA,cAAA,OAAKhE,UAAS,qBAAsB6D,EAAKN,MAAMqG,WAAQ,YAAiBpJ,GAAO,UAC1EyH,MAAO,CAAC5B,OAAQxC,EAAKN,MAAMsG,cAAgB,GAAK,OACnD7F,EAAAA,cAAC8E,EAAQ,KACP9E,EAAAA,cAAA,OAAKhE,UAAU,aAAaiF,QAAS,SAAC/B,GAAC,OAAKW,EAAK4F,eAAevG,EAAE,YAAa1C,EAAI,EAAE2C,IAAKmI,EAAAA,EACrFvG,IAAI,KACTf,EAAAA,cAAA,KAAGhE,UAAU,qBAAoBgE,EAAAA,cAAA,cAAQ,SAAc,6BAA2B4D,EAAKrD,OACtFuG,GACC9G,EAAAA,cAAC+E,EAAM,KACL/E,EAAAA,cAAA,OAAKiB,QAAS,SAAC/B,GAAC,OAAKW,EAAKwG,qBAAqBnH,EAAE,qBAAsB1C,EAAI,EAAER,UAAU,aAClFmD,IG3avB,yaH2auC4B,IAAI,KACzBf,EAAAA,cAAA,OAAKiB,QAAS,SAAC/B,GAAC,OAAKW,EAAKiG,oBAAoB5G,EAAE,qBAAsB1C,EAAI,EAAER,UAAU,aACjFmD,II7avB,iaJ6awC4B,IAAI,OAIhCf,EAAAA,cAAA,OAAKhE,UAAU,6BAA6BiI,MAAO,CAAC5B,OAAQxC,EAAKN,MAAMsG,cAAgB,MAClF3F,GAAE,qBAAuB1D,GAC5BwD,EAAAA,cAACuE,EAAQ,CAACvI,UAAU,QAClBgE,EAAAA,cAAA,OAAKhE,UAAU,uCAAuCiI,MAAO,CAC3D5B,OAAQxC,EAAKN,MAAMsG,cAAgB,KACnCzD,MAA2B,IAApBwB,EAAKH,MAAMvG,OAAe,OAEjC8C,EAAAA,cAAC0C,EAAQ,CAACe,MAAOG,EAAKH,YAOpC,IAGA,OACEzD,EAAAA,cAACuH,EAAAA,EAAM,CAACpH,KAAK,YAAYI,MAAM,aAC7BP,EAAAA,cAACwH,EAAAA,EAAU,CAACjH,MAAM,cAElBP,EAAAA,cAACyH,EAAAA,EAAS,CAACC,OAAO,GAChB1H,EAAAA,cAACyH,EAAAA,EAAS,KACRzH,EAAAA,cAAC3C,EAAAA,EAAG,CAACrB,UAAU,aACbgE,EAAAA,cAAClE,EAAAA,EAAG,CAAC6L,GAAI,IACP3H,EAAAA,cAAA,MAAIhE,UAAU,OAAMgE,EAAAA,cAAA,cAAQ,oCAGhCA,EAAAA,cAAC3C,EAAAA,EAAG,CAACrB,UAAU,QACbgE,EAAAA,cAAClE,EAAAA,EAAG,CAAC6L,GAAI,GAAIC,GAAI,EAAGC,GAAI,GACtB7H,EAAAA,cAACyE,EAAY,CACXxD,QAAS,SAAC/B,GAAC,OAAKW,EAAKL,mBAAmBN,EAAG,mFAAmF,EAC9H,aAAW,aAAa+H,KAAK,SAASC,SAAS,KAC/ClH,EAAAA,cAAC8H,EAAAA,EAAW,CAACC,MAAOhI,KAAKhE,MAAMqH,KAAK4E,oBAAoBC,gBAAgBC,gBAC3DnH,IAAI,wBACJR,MAAM,0BAEnBP,EAAAA,cAAA,OAAKhE,UAAU,kBACfgE,EAAAA,cAAA,OAAKhE,UAAU,YACbgE,EAAAA,cAAA,OAAKb,IAAKiI,EAAAA,EAASrG,IAAI,GAAG/E,UAAU,iBAI1CgE,EAAAA,cAAClE,EAAAA,EAAG,CAAC6L,GAAI,GAAIC,GAAI,EAAGC,GAAI,GACtB7H,EAAAA,cAACwE,EAAW,KACVxE,EAAAA,cAACnB,EAAAA,EAAW,CAACuB,MAAM,SAASN,KAtH5B,CACZ,IAAO,YACP,MAAS,SACT,KAAQ,QACR,MAAS,cACT,KAAQ,+GACR,SAAY,MACZ,KAAQ,kDAgHIE,EAAAA,cAACnB,EAAAA,EAAW,CAACuB,MAAM,SAASN,KA7G5B,CACZ,IAAO,YACP,MAAS,SACT,KAAQ,QACR,MAAS,cACT,KAAQ,+GACR,SAAY,MACZ,KAAQ,qDA2GFE,EAAAA,cAAC3C,EAAAA,EAAG,CAACrB,UAAU,QACbgE,EAAAA,cAAClE,EAAAA,EAAG,CAAC6L,GAAI,IACP3H,EAAAA,cAAA,MAAIhE,UAAU,QAAO,yBACrBgE,EAAAA,cAAA,SAAG,mHAKPA,EAAAA,cAAC3C,EAAAA,EAAG,CAACrB,UAAU,QACbgE,EAAAA,cAAClE,EAAAA,EAAG,CAAC6L,GAAI,IACP3H,EAAAA,cAAA,MAAIhE,UAAU,YAAWgE,EAAAA,cAAA,cAAQ,+BAGrCA,EAAAA,cAAC0E,EAAY,KACViC,KAKP3G,EAAAA,cAACuB,EAAAA,EAAU,CAACtC,YAAac,KAAKwF,iBAAkBpG,IAAKY,KAAKR,MAAMJ,IAAKG,UAAWS,KAAKR,MAAMiG,iBAC3FxF,EAAAA,cAACwB,EAAAA,EAAY,CAACvC,YAAac,KAAKP,mBAAoBL,IAAKY,KAAKR,MAAMJ,IACtDG,UAAWS,KAAKR,MAAME,mBAI1C,EAACuF,CAAA,CA1Pe,CAASvD,EAAAA,WA6P3B,EAzSc,WAAH,OACTzB,EAAAA,cAACmE,EAAAA,YAAW,CACVvE,OAAQ,SAAAwD,GAAI,OACVpD,EAAAA,cAACgF,EAAY,CAAC5B,KAAMA,GAAO,EAE7BkB,MAAK,aAoCL,C,sBKhQJ,wzC","sources":["webpack://gatsby-starter-default/./node_modules/reactstrap/es/Col.js","webpack://gatsby-starter-default/./node_modules/reactstrap/es/Row.js","webpack://gatsby-starter-default/./src/components/Cards/CardItemNew.js","webpack://gatsby-starter-default/./src/components/shared/VideoModal.js","webpack://gatsby-starter-default/./src/components/Cards/CardsNew.js","webpack://gatsby-starter-default/./src/pages/video-hub.js","webpack://gatsby-starter-default/./src/images/icons/icon-eye.svg","webpack://gatsby-starter-default/./src/images/icons/icon-eye-red.svg","webpack://gatsby-starter-default/./src/images/icons/arrow-left.svg","webpack://gatsby-starter-default/./src/images/icons/arrow-right.svg","webpack://gatsby-starter-default/./src/images/icons/btn-play.svg"],"sourcesContent":["import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"cssModule\", \"widths\", \"tag\"];\nimport React from 'react';\nimport classNames from 'classnames';\nimport { mapToCssModules, tagPropType, isObject } from './utils';\nvar colWidths = ['xs', 'sm', 'md', 'lg', 'xl'];\nvar defaultProps = {\n  tag: 'div',\n  widths: colWidths\n};\nvar getColumnSizeClass = function getColumnSizeClass(isXs, colWidth, colSize) {\n  if (colSize === true || colSize === '') {\n    return isXs ? 'col' : \"col-\" + colWidth;\n  } else if (colSize === 'auto') {\n    return isXs ? 'col-auto' : \"col-\" + colWidth + \"-auto\";\n  }\n  return isXs ? \"col-\" + colSize : \"col-\" + colWidth + \"-\" + colSize;\n};\nvar Col = function Col(props) {\n  var className = props.className,\n    cssModule = props.cssModule,\n    widths = props.widths,\n    Tag = props.tag,\n    attributes = _objectWithoutPropertiesLoose(props, _excluded);\n  var colClasses = [];\n  widths.forEach(function (colWidth, i) {\n    var columnProp = props[colWidth];\n    delete attributes[colWidth];\n    if (!columnProp && columnProp !== '') {\n      return;\n    }\n    var isXs = !i;\n    if (isObject(columnProp)) {\n      var _classNames;\n      var colSizeInterfix = isXs ? '-' : \"-\" + colWidth + \"-\";\n      var colClass = getColumnSizeClass(isXs, colWidth, columnProp.size);\n      colClasses.push(mapToCssModules(classNames((_classNames = {}, _classNames[colClass] = columnProp.size || columnProp.size === '', _classNames[\"order\" + colSizeInterfix + columnProp.order] = columnProp.order || columnProp.order === 0, _classNames[\"offset\" + colSizeInterfix + columnProp.offset] = columnProp.offset || columnProp.offset === 0, _classNames)), cssModule));\n    } else {\n      var _colClass = getColumnSizeClass(isXs, colWidth, columnProp);\n      colClasses.push(_colClass);\n    }\n  });\n  if (!colClasses.length) {\n    colClasses.push('col');\n  }\n  var classes = mapToCssModules(classNames(className, colClasses), cssModule);\n  return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, {\n    className: classes\n  }));\n};\nCol.defaultProps = defaultProps;\nexport default Col;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"cssModule\", \"noGutters\", \"tag\", \"form\", \"widths\"];\nimport React from 'react';\nimport classNames from 'classnames';\nimport { mapToCssModules, tagPropType } from './utils';\nvar rowColWidths = ['xs', 'sm', 'md', 'lg', 'xl'];\nvar defaultProps = {\n  tag: 'div',\n  widths: rowColWidths\n};\nvar Row = function Row(props) {\n  var className = props.className,\n    cssModule = props.cssModule,\n    noGutters = props.noGutters,\n    Tag = props.tag,\n    form = props.form,\n    widths = props.widths,\n    attributes = _objectWithoutPropertiesLoose(props, _excluded);\n  var colClasses = [];\n  widths.forEach(function (colWidth, i) {\n    var colSize = props[colWidth];\n    delete attributes[colWidth];\n    if (!colSize) {\n      return;\n    }\n    var isXs = !i;\n    colClasses.push(isXs ? \"row-cols-\" + colSize : \"row-cols-\" + colWidth + \"-\" + colSize);\n  });\n  var classes = mapToCssModules(classNames(className, noGutters ? 'no-gutters' : null, form ? 'form-row' : 'row', colClasses), cssModule);\n  return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, {\n    className: classes\n  }));\n};\nRow.defaultProps = defaultProps;\nexport default Row;","import React, {Component} from 'react';\nimport styled from \"styled-components\";\nimport VideoModal from \"components/shared/VideoModal\"\nimport KalturaModal from \"components/shared/KalturaModal\"\nimport IconDownload from 'images/icons/icon-download.svg'\nimport IconDownloadWhite from 'images/icons/icon-download-white.svg'\nimport IconPlay from 'images/icons/icon-play.svg'\nimport IconPlayWhite from 'images/icons/icon-play-white.svg'\nimport IconArrow from 'images/icons/icon-arrow.svg'\nimport IconArrowWhite from 'images/icons/icon-arrow-white.svg'\nimport {media} from \"utils/Media\"\nimport cardTopBlue from \"images/Resources/card-top-blue.jpg\"\nimport cardTopGreen from \"images/Resources/card-top-green.jpg\"\nimport cardTopOrange from \"images/Resources/card-top-orange.jpg\"\nimport cardTopPurple from \"images/Resources/card-top-purple.jpg\"\nimport cardTopYellow from \"images/Resources/card-top-yellow.jpg\"\n\nconst Card = styled.div`\n    width: 200px;\n    height: 275px;\n    position: relative;\n    margin: 1rem 0.5rem 1rem;\n    padding: calc(25px + 1rem) 1rem 1rem;\n    box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.15);\n    transition: transform 200ms ease-in-out;\n    display: inline-block;\n    \n    &:hover {\n        transform: scale(1.05);\n    }\n    \n    .card-header {\n        position: absolute;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 25px;\n        background: url(${cardTopOrange}) no-repeat center center;\n        background-size: 100%;\n    }\n    \n    &.orange {\n        .card-header {\n            background: url(${cardTopOrange}) no-repeat center center;\n            background-size: 100%;\n        }\n    }\n    \n    &.blue {\n        .card-header {\n            background: url(${cardTopBlue}) no-repeat center center;\n            background-size: 100%;\n        }\n    }\n    \n    &.green {\n        .card-header {\n            background: url(${cardTopGreen}) no-repeat center center;\n            background-size: 100%;\n        }\n    }\n    \n    &.purple {\n        .card-header {\n            background: url(${cardTopPurple}) no-repeat center center;\n            background-size: 100%;\n        }\n    }\n    \n    &.yellow {\n        .card-header {\n            background: url(${cardTopYellow}) no-repeat center center;\n            background-size: 100%;\n        }\n    }\n    \n    .card-body {\n        padding: 0 !important;\n    }\n    \n    .card-footer {\n        background: none !important;\n        border-top: 0;\n    }\n    \n    h4 {\n        font-size: 1.125rem;\n        padding-left: 0 !important;\n    }\n    \n    p {\n        font-size: 0.875rem;\n    }\n    \n    a {\n        text-decoration: underline;\n        \n        &:hover {\n            color: ${props => props.theme.colors.red};\n        }\n    }\n`\n\nconst DownloadButton = styled.a`\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    width: 200px;\n    height: 50px;\n    font-style: normal;\n    font-weight: normal;\n    font-size: 1rem;\n    line-height: 200%;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    text-align: center;\n    border: none;\n    color: ${props => props.theme.colors.white} !important;\n    transition: all 150ms ease-in-out;\n    cursor: pointer;\n    text-decoration: none !important;\n    \n    &.orange {\n        background-color: ${props => props.theme.colors.orange};\n    }\n    \n    &.blue {\n        background-color: ${props => props.theme.colors.blue};\n    }\n    \n    &.green {\n        background-color: ${props => props.theme.colors.green};\n    }\n    \n    &.purple {\n        background-color: ${props => props.theme.colors.purple};\n    }\n    \n    &.yellow {\n        background-color: ${props => props.theme.colors.yellow};\n        color: ${props => props.theme.colors.black} !important;\n    }\n    \n    img {\n        padding-left: 1rem;\n    }\n    \n    .hover {\n        display: none;\n    }\n    \n    &:hover {\n        color: ${props => props.theme.colors.white} !important;\n        background-color: ${props => props.theme.colors.black};\n        \n        .non-hover {\n            display: none;\n        }\n        \n        .hover {\n            display: inline-block;\n        }\n    }\n    \n    @media ${media.lg} {\n        width: 200px;\n    }\n    \n    img {\n        margin-left: 10px;\n    }\n`\n\nclass CardItemNew extends Component {\n    constructor(props) {\n        super(props);\n\n        this.state = {\n            modalOpen: false,\n        }\n    }\n\n    toggleModal = (e, src) => {\n        e.preventDefault();\n\n        this.setState({\n            src: src,\n            modalOpen: !this.state.modalOpen\n        });\n    }\n\n    toggleKalturaModal = (e, src) => {\n        e.preventDefault();\n\n        this.setState({\n            src: src,\n            kalturaModalOpen: !this.state.kalturaModalOpen,\n        });\n    }\n\n    render() {\n        let card = this.props.card\n\n        return (\n            <Card key={this.props.card.id} className={`${this.props.card.slug} ${this.props.color}`}>\n                <div className=\"card-header\">\n                </div>\n                <div className=\"card-body d-flex flex-column\">\n                    <h4 dangerouslySetInnerHTML={{__html: this.props.card.title }}/>\n                    <p>{card.body}</p>\n                </div>\n                <div className=\"card-footer\">\n                    {card.selector === 'pdf' &&\n                    <DownloadButton download target=\"_blank\" href={card.link} className={this.props.color}>Download PDF\n                        {this.props.color === 'yellow' ?\n                            <>\n                                <img className=\"non-hover\" src={IconDownload} alt=\"\" />\n                                <img className=\"hover\" src={IconDownloadWhite} alt=\"\" />\n                            </>\n                            :\n                                <img src={IconDownloadWhite} alt=\"\" />\n                        }\n                    </DownloadButton>\n                    }\n                    {card.selector === 'video' &&\n                    <DownloadButton onClick={(e) => this.toggleKalturaModal(e, card.link)} aria-label=\"Open video\" className={this.props.color}>Watch videos\n                        {this.props.color === 'yellow' ?\n                            <>\n                                <img className=\"non-hover\" src={IconPlay} alt=\"\" />\n                                <img className=\"hover\" src={IconPlayWhite} alt=\"\" />\n                            </>\n                            :\n                                <img src={IconPlayWhite} alt=\"\" />\n                        }\n                    </DownloadButton>\n                    }\n                    {card.selector === 'url' &&\n                    <DownloadButton target={!card.link.includes(\"lionkingeducation.co.uk\") ? '_blank' : '_self'} href={card.link} download={!card.link.includes(\"lionkingeducation.co.uk\")} className={this.props.color}>Find out more\n                        {this.props.color === 'yellow' ?\n                            <>\n                                <img className=\"non-hover\" src={IconArrow} alt=\"\" />\n                                <img className=\"hover\" src={IconArrowWhite} alt=\"\" />\n                            </>\n                            :\n                                <img src={IconArrowWhite} alt=\"\" />\n                        }\n                    </DownloadButton>\n                    }\n                </div>\n                <VideoModal toggleModal={this.toggleModal} src={this.state.src} modalOpen={this.state.modalOpen}/>\n                <KalturaModal toggleModal={this.toggleKalturaModal} src={this.state.src} modalOpen={this.state.kalturaModalOpen}/>\n            </Card>\n        );\n    }\n}\n\nexport default CardItemNew;","import React, {Component} from 'react';\nimport {Modal, ModalBody} from \"reactstrap\"\nimport styled from \"styled-components\"\nimport ButtonClose from 'components/shared/ButtonClose'\n\nconst VModal = styled(Modal)`\n    max-width: 1400px;\n    padding: 0;\n    border: 0;\n\n    .modal-content {\n        border: 0;\n        position: relative;\n    }\n\n    .modal-body {\n        padding: 0;\n        border: 0;\n    }\n    \n    .video-wrapper {\n        position: relative;\n        padding-bottom: 56.25%; /* 16:9 aspect ratio */\n        padding-top: 0; // height of controls\n        height: 0;\n    \n        iframe {\n          position: absolute;\n          top: 0;\n          left: 0;\n          width: 100%;\n          height: 100%;\n        }\n    }\n`\n\nclass VideoModal extends Component {\n    render() {\n        return (\n            <VModal isOpen={this.props.modalOpen} toggle={this.props.toggleModal} centered={true}>\n                <ButtonClose onClick={this.props.toggleModal}>\n                    <span className=\"sr-only\">Close</span>\n                </ButtonClose>\n                <ModalBody>\n                    <div className=\"video-wrapper\">\n                        <iframe src={`https://player.vimeo.com/video/${this.props.src}`} width=\"640\" height=\"360\" frameBorder=\"0\"\n                                allow=\"autoplay; fullscreen\" allowFullScreen/>\n                    </div>\n                </ModalBody>\n            </VModal>\n        );\n    }\n}\n\nexport default VideoModal;","import React, {Component} from 'react';\nimport CardItemNew from 'components/Cards/CardItemNew'\nimport styled from \"styled-components\";\nimport {graphql, StaticQuery} from \"gatsby\";\n\nconst Resources = styled.div`\n  margin-bottom: 1rem;\n  display: inline-block;\n\n  .card-deck {\n    display: flex;\n    flex-flow: row wrap;\n    justify-content: left;\n  }\n\n  h4 {\n    font-size: 1.125rem;\n    padding-left: 0.5rem;\n    margin-bottom: 0;\n  }\n`\n\nclass CardsNew extends Component {\n    listResources = (tag, color) => {\n        let existingTag = []\n        let totalTags = 0;\n\n\n        const getResources = this.props.data.allTeacherLibraryJson.edges.map((resource, i) => {\n            return this.props.cards.map((cat) => {\n                if (cat === parseFloat(resource.node.id)) {\n                    let currentTag = resource.node.tag\n\n                    existingTag.push(currentTag)\n\n                    if (currentTag === tag) {\n                        totalTags++;\n                        return (\n                            <CardItemNew key={resource.node.id} color={color} card={resource.node}/>\n                        )\n                    }\n                }\n\n            })\n        })\n\n        const uniqueTags = [...new Set(existingTag)];\n        if (totalTags > 0) {\n            return (\n                <Resources>\n                    {tag === 'primary' && uniqueTags.includes('primary') &&\n                        <h4><strong>Primary resources</strong></h4>\n                    }\n                    {tag === 'secondary' && uniqueTags.includes('secondary') &&\n                        <h4><strong>Secondary resources</strong></h4>\n                    }\n                    {tag === 'behind' && uniqueTags.includes('behind') &&\n                        <h4><strong>Behind-The-Scenes</strong></h4>\n                    }\n                    {tag === 'backstage' && uniqueTags.includes('backstage') &&\n                        <h4><strong>Backstage</strong></h4>\n                    }\n                    {tag === 'citizenship' && uniqueTags.includes('citizenship') &&\n                        <h4><strong>Citizenship</strong></h4>\n                    }\n                    {tag === 'background' && uniqueTags.includes('background') &&\n                        <h4><strong>Background Reading</strong></h4>\n                    }\n                    {tag === 'video-questionnaires' && uniqueTags.includes('video-questionnaires') &&\n                        <h4><strong>Video Hub Questionnaires</strong></h4>\n                    }\n                    <div className=\"card-deck-wrapper\">\n                        <div className=\"card-deck\">\n                            {getResources}\n                        </div>\n                    </div>\n                </Resources>\n            )\n        }\n    }\n\n    render() {\n        return (\n            <div style={{\n                display: \"flex\"\n            }}>\n                {this.listResources('primary', 'orange')}\n                {this.listResources('secondary', 'blue')}\n                {this.listResources('behind', 'yellow')}\n                {this.listResources('backstage', 'yellow')}\n                {this.listResources('citizenship', 'purple')}\n                {this.listResources('background', 'green')}\n                {this.listResources('video-questionnaires', 'yellow')}\n            </div>\n        );\n    }\n}\n\nconst Query = (props) => (\n    <StaticQuery\n        render={data => (\n            <CardsNew {...props} data={data}/>\n        )}\n        query={graphql`\n            query {\n              allTeacherLibraryJson {\n                edges {\n                  node {\n                    id\n                    tag\n                    slug\n                    title\n                    body\n                    selector\n                    link\n                    categories\n                  }\n                }\n              }\n            }\n\t\t`}\n    />\n)\n\nexport default Query","import React, {Component} from \"react\"\nimport styled from 'styled-components'\nimport {media} from \"utils/Media\"\nimport {Row, Col, Container} from 'reactstrap'\nimport CardItemNew from 'components/Cards/CardItemNew'\nimport {graphql, StaticQuery} from 'gatsby'\nimport Layout from \"components/Layout/Layout\"\nimport VideoModal from \"components/shared/VideoModal\"\nimport KalturaModal from \"components/shared/KalturaModal\"\nimport HeaderCopy from \"components/shared/HeaderCopy\"\nimport CardsNew from \"components/Cards/CardsNew\"\nimport {GatsbyImage} from \"gatsby-plugin-image\"\nimport BtnPlay from 'images/icons/btn-play.svg'\nimport IconEye from 'images/icons/icon-eye.svg'\nimport IconEyeRed from 'images/icons/icon-eye-red.svg'\nimport IconClose from \"images/icons/icon-close.svg\"\nimport ArrowLeft from \"images/icons/arrow-left.svg\"\nimport ArrowRight from \"images/icons/arrow-right.svg\"\n\nconst Relative = styled.div`\n  position: relative;\n  width: 100%;\n`\nconst CardWrapper = styled.div`\n  display: flex;\n  flex-flow: row wrap;\n  justify-content: left;\n\n  @media ${media.lg} {\n    margin-top: -1rem;\n  }\n`\nconst VideoWrapper = styled.button`\n  width: 100%;\n  margin: 0 auto;\n  cursor: pointer;\n  position: relative;\n  padding: 0;\n\n  img {\n    padding-left: 0 !important;\n  }\n\n  .video-overlay {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background-color: black;\n    opacity: 0.2;\n    transition: opacity 200ms ease-in-out;\n    z-index: 2;\n  }\n\n  .play-btn {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    opacity: 0.5;\n    transition: opacity 200ms ease-in-out;\n    z-index: 3;\n    width: 80px;\n    height: 80px;\n  }\n\n  &:hover {\n    .video-overlay {\n      opacity: 0.5;\n    }\n\n    .play-btn {\n      opacity: 1;\n    }\n  }\n`\n\nconst BlockSection = styled.div`\n  position: relative;\n  margin-bottom: 2rem;\n\n  @media ${media.md} {\n    display: flex;\n    flex-flow: row wrap;\n    justify-content: left;\n  }\n`\n\nconst Block = styled.div`\n  width: 100%;\n  margin: 0 auto;\n\n  @media ${media.md} {\n    width: 310px;\n  }\n\n  @media ${media.md} {\n    margin: 0 1rem 1rem;\n  }\n\n  @media ${media.lg} {\n    width: 33%;\n    margin: 0 0 1rem;\n  }\n\n  .collapse-content {\n    height: 0;\n    visibility: hidden;\n    overflow: hidden;\n    position: absolute;\n    left: 0;\n    width: 100%;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: center;\n    transition: height 200ms ease;\n    z-index: 1;\n\n    &.active {\n      visibility: visible;\n    }\n\n    &--inner {\n      position: absolute;\n      left: 0;\n    }\n\n    &--scroller {\n      position: absolute;\n      left: 0;\n      width: 100%;\n      overflow-x: auto;\n      overflow-y: hidden;\n      z-index: 2;\n      margin-top: 45px;\n    }\n  }\n`\n\nconst BlockContent = styled.div`\n  border-bottom: none;\n  margin-top: 2rem;\n\n  @media ${media.lg} {\n    margin-bottom: 0;\n    padding-bottom: 0;\n    padding: 0 1rem 1rem;\n    border-bottom: 1px solid ${props => props.theme.colors.lightGrey};\n    border-right: 1px solid ${props => props.theme.colors.lightGrey};\n\n    &:hover {\n      background: linear-gradient(230.34deg, #FFFFFF 71.34%, #F9F9F9 100%);\n    }\n  }\n\n  button {\n    text-decoration: underline;\n    -webkit-appearance: none;\n    border: none;\n    padding: 0;\n    background: none;\n\n    img {\n      padding-left: 1rem;\n    }\n\n    .hover {\n      display: none;\n    }\n\n    &:hover {\n      color: ${props => props.theme.colors.red};\n\n      .non-hover {\n        display: none;\n      }\n\n      .hover {\n        display: inline-block;\n      }\n    }\n  }\n`\n\nconst CloseBar = styled.div`\n  width: 100%;\n  height: 65px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  padding-left: 0.5rem;\n\n  .close-icon {\n    cursor: pointer;\n  }\n\n  p {\n    margin-bottom: 0;\n    padding-left: 1rem;\n  }\n`\n\nconst Arrows = styled.div`\n  position: absolute;\n  z-index: 3;\n  right: 0;\n  cursor: pointer;\n\n  img {\n    padding-left: 1rem;\n  }\n\n`\n\nconst Query = () => (\n  <StaticQuery\n    render={data => (\n      <VideoHubPage data={data}/>\n    )}\n    query={graphql`\n            query {\n                WorkshopVideoPoster: file(relativePath: { eq: \"WorkshopPage/getting-ready-to-roar.jpg\" }) {\n                    childImageSharp {\n                        gatsbyImageData(width: 600, quality: 100)\n                    }\n                }\n                allVideoHubJson {\n                    edges {\n                      node {\n                        id\n                        title\n                        video\n                        sourceUrl\n                        copy\n                        cards\n                      }\n                    }\n                  }\n                  allTeacherLibraryJson {\n                    edges {\n                      node {\n                        id\n                        tag\n                        color\n                        slug\n                        title\n                        body\n                        selector\n                        link\n                        categories\n                      }\n                    }\n                  }\n            }\n\t\t`}\n  />\n)\n\nclass VideoHubPage extends Component {\n  constructor(props) {\n    super(props);\n    \n    this.state = {\n      vimeoModalOpen: false,\n      kalturaModalOpen: false,\n      selectedCategories: [],\n      activeId: \"\",\n      contentHeight: 0\n    }\n  }\n  \n  componentDidMount() {\n    \n    let width = document.getElementsByClassName('collapse-content--scroller')[0].offsetWidth\n    \n    this.setState({\n      containerWidth: width\n    })\n    \n  }\n  \n  selectCategory = (category) => {\n    let selectedCategories = this.state.selectedCategories\n    \n    if (selectedCategories.includes(category)) {\n      const index = selectedCategories.indexOf(category);\n      selectedCategories.splice(index, 1);\n    } else {\n      selectedCategories.push(category)\n    }\n    \n    this.setState({selectedCategories})\n  }\n  \n  toggleVimeoModal = (e, src) => {\n    e.preventDefault();\n    \n    this.setState({\n      src: src,\n      vimeoModalOpen: !this.state.vimeoModalOpen,\n    });\n  }\n  \n  toggleKalturaModal = (e, src) => {\n    e.preventDefault();\n    \n    this.setState({\n      src: src,\n      kalturaModalOpen: !this.state.kalturaModalOpen,\n    });\n  }\n  \n  toggleCollapse = (e, id) => {\n    e.preventDefault();\n    const collapse = id\n    let activeId = \"\"\n    \n    if (this.state.activeId !== collapse) {\n      activeId = collapse;\n    }\n    \n    this.setState({\n      [collapse]: !this.state[collapse],\n      activeId: activeId,\n      contentHeight: 375\n    })\n    \n  }\n  \n  scrollContentToLeft = (e, id) => {\n    const content = document.getElementById(id);\n    const content_scroll_width = content.scrollWidth;\n    let scrollLeft = content.scrollLeft;\n    \n    scrollLeft += 220;\n    \n    if (scrollLeft >= content_scroll_width) {\n      scrollLeft = content_scroll_width;\n    }\n    \n    content.scrollLeft = scrollLeft;\n    \n  }\n  \n  scrollContentToRight = (e, id) => {\n    const content = document.getElementById(id);\n    let scrollLeft = content.scrollLeft;\n    \n    scrollLeft -= 220;\n    \n    if (scrollLeft <= 0) {\n      scrollLeft = 0;\n    }\n    \n    content.scrollLeft = scrollLeft;\n  }\n  \n  render() {\n    \n    const card1 = {\n      \"tag\": \"secondary\",\n      \"color\": \"yellow\",\n      \"slug\": \"card1\",\n      \"title\": \"Key Stage 3\",\n      \"body\": \"This resource aims to help your students develop an understanding of the employability skills the team uses.\",\n      \"selector\": \"pdf\",\n      \"link\": \"/pdfs/Getting-Ready-to-Roar-KS3-Resource.pdf\"\n    }\n    \n    const card2 = {\n      \"tag\": \"secondary\",\n      \"color\": \"yellow\",\n      \"slug\": \"card2\",\n      \"title\": \"Key Stage 4\",\n      \"body\": \"This resource aims to help your students develop an understanding of the employability skills the team uses.\",\n      \"selector\": \"pdf\",\n      \"link\": \"/pdfs/Getting-Ready-to-Roar-KS4-Resource.pdf\"\n    }\n    \n    \n    const videos = this.props.data.allVideoHubJson.edges.map(({node}, i) => {\n      \n      let showArrows;\n      \n      let containerWidth = this.state.containerWidth;\n      let scrollWidth = node.cards.length * 216;\n      \n      showArrows = scrollWidth > containerWidth;\n      \n      return (\n        <Block key={i} style={{\n          marginBottom: this.state.activeId === `collapse-${i}` ? this.state.contentHeight + 25 : 0\n        }}>\n          <BlockContent>\n            <VideoWrapper onClick={(e) => this.toggleKalturaModal(e, node.video)} aria-label=\"Open video\" role=\"button\"\n                          tabindex=\"0\">\n              <img\n                src={node.sourceUrl}\n                alt={node.title}\n                title={node.title}\n              />\n              <div className=\"video-overlay\"/>\n              <div className=\"play-btn\">\n                <img src={BtnPlay} alt=\"\" className=\"img-fluid\"/>\n              </div>\n            </VideoWrapper>\n            \n            <h3 className=\"mt-4\">{node.title}</h3>\n            \n            <p>{node.copy}</p>\n            \n            <button onClick={(e) => this.toggleCollapse(e, `collapse-${i}`)}>\n              View associated resources\n              <img className=\"non-hover\" src={IconEye} alt=\"\"/>\n              <img className=\"hover\" src={IconEyeRed} alt=\"\"/>\n            </button>\n          </BlockContent>\n          <div className={`collapse-content ${this.state.activeId === `collapse-${i}` && 'active'}`}\n               style={{height: this.state.contentHeight + 25 + \"px\"}}>\n            <CloseBar>\n              <img className=\"close-icon\" onClick={(e) => this.toggleCollapse(e, `collapse-${i}`)} src={IconClose}\n                   alt=\"\"/>\n              <p className=\"d-none d-sm-block\"><strong>Close</strong> associated resources for {node.title}</p>\n              {showArrows &&\n                <Arrows>\n                  <img onClick={(e) => this.scrollContentToRight(e, `collapse-scroller-${i}`)} className=\"arrow-left\"\n                       src={ArrowLeft} alt=\"\"/>\n                  <img onClick={(e) => this.scrollContentToLeft(e, `collapse-scroller-${i}`)} className=\"arrow-left\"\n                       src={ArrowRight} alt=\"\"/>\n                </Arrows>\n              }\n            </CloseBar>\n            <div className=\"collapse-content--scroller\" style={{height: this.state.contentHeight + \"px\"}}\n                 id={`collapse-scroller-${i}`}>\n              <Relative className=\"my-4\">\n                <div className=\"unselectable collapse-content--inner\" style={{\n                  height: this.state.contentHeight + \"px\",\n                  width: node.cards.length * 216 + \"px\"\n                }}>\n                  <CardsNew cards={node.cards}/>\n                </div>\n              </Relative>\n            </div>\n          </div>\n        </Block>\n      )\n    })\n    \n    \n    return (\n      <Layout slug=\"video-hub\" title=\"Video hub\">\n        <HeaderCopy title=\"Video Hub\"/>\n        \n        <Container fluid={true}>\n          <Container>\n            <Row className=\"my-4 pl-3\">\n              <Col xs={12}>\n                <h2 className=\"m-0\"><strong>Backstage Careers Documentary</strong></h2>\n              </Col>\n            </Row>\n            <Row className=\"pl-3\">\n              <Col xs={12} lg={6} xl={7}>\n                <VideoWrapper\n                  onClick={(e) => this.toggleKalturaModal(e, \"https://secure.disney.com/embed/58f9b6fe5a6ed0f4fad9b0b0?domain=www.disney.co.uk\")}\n                  aria-label=\"Open video\" role=\"button\" tabindex=\"0\">\n                  <GatsbyImage image={this.props.data.WorkshopVideoPoster.childImageSharp.gatsbyImageData}\n                               alt=\"Getting Ready to Roar\"\n                               title=\"Getting Ready to Roar\"\n                  />\n                  <div className=\"video-overlay\"/>\n                  <div className=\"play-btn\">\n                    <img src={BtnPlay} alt=\"\" className=\"img-fluid\"/>\n                  </div>\n                </VideoWrapper>\n              </Col>\n              <Col xs={12} lg={6} xl={5}>\n                <CardWrapper>\n                  <CardItemNew color=\"yellow\" card={card1}/>\n                  <CardItemNew color=\"yellow\" card={card2}/>\n                </CardWrapper>\n              </Col>\n            </Row>\n            \n            <Row className=\"pl-3\">\n              <Col xs={12}>\n                <h3 className=\"mt-4\">Getting Ready to Roar</h3>\n                <p>A unique insight into the intense backstage preparation of a performance. Scroll down\n                  for more video content.</p>\n              </Col>\n            </Row>\n            \n            <Row className=\"my-4\">\n              <Col xs={12}>\n                <h2 className=\"pl-3 m-0\"><strong>Behind-The-Scenes Videos</strong></h2>\n              </Col>\n            </Row>\n            <BlockSection>\n              {videos}\n            </BlockSection>\n          </Container>\n        </Container>\n        \n        <VideoModal toggleModal={this.toggleVimeoModal} src={this.state.src} modalOpen={this.state.vimeoModalOpen}/>\n        <KalturaModal toggleModal={this.toggleKalturaModal} src={this.state.src}\n                      modalOpen={this.state.kalturaModalOpen}/>\n      \n      </Layout>\n    )\n  }\n}\n\nexport default Query","export default \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAyMiAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMC45NDQxIDEwQzEyLjMyNDggMTAgMTMuNDQ0MSA4Ljg4MDcxIDEzLjQ0NDEgNy41QzEzLjQ0NDEgNi4xMTkyOSAxMi4zMjQ4IDUgMTAuOTQ0MSA1QzkuNTYzNDIgNSA4LjQ0NDEzIDYuMTE5MjkgOC40NDQxMyA3LjVDOC40NDQxMyA4Ljg4MDcxIDkuNTYzNDIgMTAgMTAuOTQ0MSAxMFpNMTAuOTQ0MSAxMS41QzEzLjE1MzMgMTEuNSAxNC45NDQxIDkuNzA5MTQgMTQuOTQ0MSA3LjVDMTQuOTQ0MSA1LjI5MDg2IDEzLjE1MzMgMy41IDEwLjk0NDEgMy41QzguNzM0OTkgMy41IDYuOTQ0MTMgNS4yOTA4NiA2Ljk0NDEzIDcuNUM2Ljk0NDEzIDkuNzA5MTQgOC43MzQ5OSAxMS41IDEwLjk0NDEgMTEuNVoiIGZpbGw9ImJsYWNrIi8+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMS45MTU5MSA3LjVDMi4wMjI2NSA3LjYyNDAzIDIuMTUwODIgNy43Njk0MSAyLjI5ODg4IDcuOTMxMjJDMi43OTYxNSA4LjQ3NDcyIDMuNTEzMDkgOS4xOTg2NCA0LjM5MDk3IDkuOTIwNzlDNi4xNzAzOCAxMS4zODQ2IDguNTAwNzEgMTIuNzUgMTAuOTQ0MiAxMi43NUMxMy4zODc2IDEyLjc1IDE1LjcxNzkgMTEuMzg0NiAxNy40OTczIDkuOTIwNzlDMTguMzc1MiA5LjE5ODY0IDE5LjA5MjIgOC40NzQ3MiAxOS41ODk0IDcuOTMxMjJDMTkuNzM3NSA3Ljc2OTQxIDE5Ljg2NTcgNy42MjQwMyAxOS45NzI0IDcuNUMxOS44NjU3IDcuMzc1OTcgMTkuNzM3NSA3LjIzMDU5IDE5LjU4OTQgNy4wNjg3OEMxOS4wOTIyIDYuNTI1MjggMTguMzc1MiA1LjgwMTM3IDE3LjQ5NzMgNS4wNzkyMUMxNS43MTc5IDMuNjE1NDQgMTMuMzg3NiAyLjI1IDEwLjk0NDIgMi4yNUM4LjUwMDcxIDIuMjUgNi4xNzAzOCAzLjYxNTQ0IDQuMzkwOTcgNS4wNzkyMUMzLjUxMzA5IDUuODAxMzcgMi43OTYxNSA2LjUyNTI4IDIuMjk4ODggNy4wNjg3OEMyLjE1MDgyIDcuMjMwNTkgMi4wMjI2NSA3LjM3NTk3IDEuOTE1OTEgNy41Wk0yMS44ODgzIDcuNUwyMS4zMTM4IDYuNzYzNTJDMjEuMzEzOCA2Ljc2MzUyIDIwLjk2MjYgNi4zNDc0NiAyMC42OTYxIDYuMDU2MjJDMjAuMTY0MSA1LjQ3NDcyIDE5LjM5NTggNC42OTg2MyAxOC40NTAzIDMuOTIwNzlDMTYuNTgyOCAyLjM4NDU2IDEzLjkxMzEgMC43NSAxMC45NDQyIDAuNzVDNy45NzUyMSAwLjc1IDUuMzA1NTMgMi4zODQ1NiAzLjQzODA0IDMuOTIwNzlDMi40OTI0NyA0LjY5ODYzIDEuNzI0MjQgNS40NzQ3MiAxLjE5MjIgNi4wNTYyMkMwLjkyNTczNSA2LjM0NzQ2IDAuNzE3MzczIDYuNTkxMTMgMC41NzQ0NjMgNi43NjM1MkMwLjUwMjk4MSA2Ljg0OTc0IDAgNy41IDAgNy41QzAgNy41IDAuOTI1NzM1IDguNjUyNTQgMS4xOTIyIDguOTQzNzhDMS43MjQyNCA5LjUyNTI4IDIuNDkyNDcgMTAuMzAxNCAzLjQzODA0IDExLjA3OTJDNS4zMDU1MyAxMi42MTU0IDcuOTc1MjEgMTQuMjUgMTAuOTQ0MiAxNC4yNUMxMy45MTMxIDE0LjI1IDE2LjU4MjggMTIuNjE1NCAxOC40NTAzIDExLjA3OTJDMTkuMzk1OCAxMC4zMDE0IDIwLjE2NDEgOS41MjUyOCAyMC42OTYxIDguOTQzNzhDMjAuOTYyNiA4LjY1MjU0IDIxLjE3MDkgOC40MDg4NyAyMS4zMTM4IDguMjM2NDhDMjEuMzg1MyA4LjE1MDI2IDIxLjg4ODMgNy41IDIxLjg4ODMgNy41WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+Cg==\"","export default \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTUiIHZpZXdCb3g9IjAgMCAyMiAxNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMC45NDQxIDEwQzEyLjMyNDggMTAgMTMuNDQ0MSA4Ljg4MDcxIDEzLjQ0NDEgNy41QzEzLjQ0NDEgNi4xMTkyOSAxMi4zMjQ4IDUgMTAuOTQ0MSA1QzkuNTYzNDIgNSA4LjQ0NDEzIDYuMTE5MjkgOC40NDQxMyA3LjVDOC40NDQxMyA4Ljg4MDcxIDkuNTYzNDIgMTAgMTAuOTQ0MSAxMFpNMTAuOTQ0MSAxMS41QzEzLjE1MzMgMTEuNSAxNC45NDQxIDkuNzA5MTQgMTQuOTQ0MSA3LjVDMTQuOTQ0MSA1LjI5MDg2IDEzLjE1MzMgMy41IDEwLjk0NDEgMy41QzguNzM0OTkgMy41IDYuOTQ0MTMgNS4yOTA4NiA2Ljk0NDEzIDcuNUM2Ljk0NDEzIDkuNzA5MTQgOC43MzQ5OSAxMS41IDEwLjk0NDEgMTEuNVoiIGZpbGw9IiNDMTI1MTgiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xLjkxNTkxIDcuNUMyLjAyMjY1IDcuNjI0MDMgMi4xNTA4MiA3Ljc2OTQxIDIuMjk4ODggNy45MzEyMkMyLjc5NjE1IDguNDc0NzIgMy41MTMwOSA5LjE5ODY0IDQuMzkwOTcgOS45MjA3OUM2LjE3MDM4IDExLjM4NDYgOC41MDA3MSAxMi43NSAxMC45NDQyIDEyLjc1QzEzLjM4NzYgMTIuNzUgMTUuNzE3OSAxMS4zODQ2IDE3LjQ5NzMgOS45MjA3OUMxOC4zNzUyIDkuMTk4NjQgMTkuMDkyMiA4LjQ3NDcyIDE5LjU4OTQgNy45MzEyMkMxOS43Mzc1IDcuNzY5NDEgMTkuODY1NyA3LjYyNDAzIDE5Ljk3MjQgNy41QzE5Ljg2NTcgNy4zNzU5NyAxOS43Mzc1IDcuMjMwNTkgMTkuNTg5NCA3LjA2ODc4QzE5LjA5MjIgNi41MjUyOCAxOC4zNzUyIDUuODAxMzcgMTcuNDk3MyA1LjA3OTIxQzE1LjcxNzkgMy42MTU0NCAxMy4zODc2IDIuMjUgMTAuOTQ0MiAyLjI1QzguNTAwNzEgMi4yNSA2LjE3MDM4IDMuNjE1NDQgNC4zOTA5NyA1LjA3OTIxQzMuNTEzMDkgNS44MDEzNyAyLjc5NjE1IDYuNTI1MjggMi4yOTg4OCA3LjA2ODc4QzIuMTUwODIgNy4yMzA1OSAyLjAyMjY1IDcuMzc1OTcgMS45MTU5MSA3LjVaTTIxLjg4ODMgNy41TDIxLjMxMzggNi43NjM1MkMyMS4zMTM4IDYuNzYzNTIgMjAuOTYyNiA2LjM0NzQ2IDIwLjY5NjEgNi4wNTYyMkMyMC4xNjQxIDUuNDc0NzIgMTkuMzk1OCA0LjY5ODYzIDE4LjQ1MDMgMy45MjA3OUMxNi41ODI4IDIuMzg0NTYgMTMuOTEzMSAwLjc1IDEwLjk0NDIgMC43NUM3Ljk3NTIxIDAuNzUgNS4zMDU1MyAyLjM4NDU2IDMuNDM4MDQgMy45MjA3OUMyLjQ5MjQ3IDQuNjk4NjMgMS43MjQyNCA1LjQ3NDcyIDEuMTkyMiA2LjA1NjIyQzAuOTI1NzM1IDYuMzQ3NDYgMC43MTczNzMgNi41OTExMyAwLjU3NDQ2MyA2Ljc2MzUyQzAuNTAyOTgxIDYuODQ5NzQgMCA3LjUgMCA3LjVDMCA3LjUgMC45MjU3MzUgOC42NTI1NCAxLjE5MjIgOC45NDM3OEMxLjcyNDI0IDkuNTI1MjggMi40OTI0NyAxMC4zMDE0IDMuNDM4MDQgMTEuMDc5MkM1LjMwNTUzIDEyLjYxNTQgNy45NzUyMSAxNC4yNSAxMC45NDQyIDE0LjI1QzEzLjkxMzEgMTQuMjUgMTYuNTgyOCAxMi42MTU0IDE4LjQ1MDMgMTEuMDc5MkMxOS4zOTU4IDEwLjMwMTQgMjAuMTY0MSA5LjUyNTI4IDIwLjY5NjEgOC45NDM3OEMyMC45NjI2IDguNjUyNTQgMjEuMTcwOSA4LjQwODg3IDIxLjMxMzggOC4yMzY0OEMyMS4zODUzIDguMTUwMjYgMjEuODg4MyA3LjUgMjEuODg4MyA3LjVaIiBmaWxsPSIjQzEyNTE4Ii8+Cjwvc3ZnPgo=\"","export default \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNyAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjUzMDM0IDBMOS41MzY3NGUtMDYgNy41MzAzM0w3LjUzMDM0IDE1LjA2MDdMOC41OTEgMTRMMi44NzEzMyA4LjI4MDMzSDE2LjA2MDdWNi43ODAzM0wyLjg3MTMzIDYuNzgwMzNMOC41OTEgMS4wNjA2Nkw3LjUzMDM0IDBaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K\"","export default \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTciIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNyAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik04LjUzMDMzIDBMMTYuMDYwNyA3LjUzMDMzTDguNTMwMzMgMTUuMDYwN0w3LjQ2OTY3IDE0TDEzLjE4OTMgOC4yODAzM0gwVjYuNzgwMzNMMTMuMTg5MyA2Ljc4MDMzTDcuNDY5NjcgMS4wNjA2Nkw4LjUzMDMzIDBaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K\"","export default \"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODMiIGhlaWdodD0iODMiIHZpZXdCb3g9IjAgMCA4MyA4MyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xLjUgNDEuMDE1NEMxLjUgNjIuODM5MSAxOS4xOTE2IDgwLjUzMDggNDEuMDE1NCA4MC41MzA4QzYyLjgzOTEgODAuNTMwOCA4MC41MzA4IDYyLjgzOTEgODAuNTMwOCA0MS4wMTU0QzgwLjUzMDggMTkuMTkxNiA2Mi44MzkxIDEuNSA0MS4wMTU0IDEuNUMxOS4xOTE2IDEuNSAxLjUgMTkuMTkxNiAxLjUgNDEuMDE1NFpNNDEuMDE1NCAwQzE4LjM2MzIgMCAwIDE4LjM2MzIgMCA0MS4wMTU0QzAgNjMuNjY3NSAxOC4zNjMyIDgyLjAzMDggNDEuMDE1NCA4Mi4wMzA4QzYzLjY2NzUgODIuMDMwOCA4Mi4wMzA4IDYzLjY2NzUgODIuMDMwOCA0MS4wMTU0QzgyLjAzMDggMTguMzYzMiA2My42Njc1IDAgNDEuMDE1NCAwWiIgZmlsbD0id2hpdGUiLz4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0zNi41MTU0IDM0LjQxNDRWNDcuNjE2NEMzNi41MTU0IDQ3Ljk5NzYgMzYuOTI0OSA0OC4yMzg2IDM3LjI1ODIgNDguMDUzNUw0OS4xNCA0MS40NTI1QzQ5LjQ4MjkgNDEuMjYyIDQ5LjQ4MjkgNDAuNzY4OCA0OS4xMzk5IDQwLjU3ODNMMzcuMjU4MiAzMy45Nzc0QzM2LjkyNDkgMzMuNzkyMiAzNi41MTU0IDM0LjAzMzIgMzYuNTE1NCAzNC40MTQ0Wk0zNy45ODY3IDMyLjY2NjFDMzYuNjUzNiAzMS45MjU1IDM1LjAxNTQgMzIuODg5NSAzNS4wMTU0IDM0LjQxNDRWNDcuNjE2NEMzNS4wMTU0IDQ5LjE0MTMgMzYuNjUzNiA1MC4xMDUzIDM3Ljk4NjcgNDkuMzY0N0w0OS44Njg0IDQyLjc2MzdDNTEuMjQgNDIuMDAxNyA1MS4yNCA0MC4wMjkxIDQ5Ljg2ODQgMzkuMjY3MUwzNy45ODY3IDMyLjY2NjFaIiBmaWxsPSJ3aGl0ZSIvPgo8L3N2Zz4K\""],"names":["_excluded","getColumnSizeClass","isXs","colWidth","colSize","Col","props","className","cssModule","widths","Tag","tag","attributes","colClasses","forEach","i","columnProp","_classNames","colSizeInterfix","colClass","size","push","order","offset","_colClass","length","classes","defaultProps","Row","noGutters","form","Card","styled","displayName","componentId","cardTopOrange","cardTopBlue","cardTopGreen","cardTopPurple","cardTopYellow","theme","colors","red","DownloadButton","white","orange","blue","green","purple","yellow","black","media","CardItemNew","_Component","_this","call","toggleModal","e","src","preventDefault","setState","modalOpen","state","toggleKalturaModal","kalturaModalOpen","_inheritsLoose","prototype","render","_this2","card","this","React","key","id","slug","color","dangerouslySetInnerHTML","__html","title","body","selector","download","target","href","link","IconDownload","alt","IconDownloadWhite","onClick","IconPlay","IconPlayWhite","includes","IconArrow","IconArrowWhite","VideoModal","KalturaModal","Component","VModal","Modal","withConfig","apply","arguments","isOpen","toggle","centered","ButtonClose","ModalBody","width","height","frameBorder","allow","allowFullScreen","Resources","CardsNew","_len","args","Array","_key","concat","listResources","existingTag","totalTags","getResources","data","allTeacherLibraryJson","edges","map","resource","cards","cat","parseFloat","node","currentTag","uniqueTags","_toConsumableArray","Set","style","display","StaticQuery","Object","assign","query","Relative","CardWrapper","VideoWrapper","BlockSection","Block","BlockContent","lightGrey","CloseBar","Arrows","VideoHubPage","selectCategory","category","selectedCategories","index","indexOf","splice","toggleVimeoModal","vimeoModalOpen","toggleCollapse","_this$setState","collapse","activeId","contentHeight","scrollContentToLeft","content","document","getElementById","content_scroll_width","scrollWidth","scrollLeft","scrollContentToRight","_proto","componentDidMount","getElementsByClassName","offsetWidth","containerWidth","videos","allVideoHubJson","_ref","showArrows","marginBottom","video","role","tabindex","sourceUrl","BtnPlay","copy","IconClose","Layout","HeaderCopy","Container","fluid","xs","lg","xl","GatsbyImage","image","WorkshopVideoPoster","childImageSharp","gatsbyImageData"],"sourceRoot":""}