{"id":9,"date":"2022-02-25T21:00:51","date_gmt":"2022-02-25T21:00:51","guid":{"rendered":"https:\/\/theme.co\/gridorama\/buy\/"},"modified":"2026-03-19T13:57:34","modified_gmt":"2026-03-19T13:57:34","slug":"become-a-grid-master","status":"publish","type":"page","link":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/","title":{"rendered":"Become A Grid Master"},"content":{"rendered":"<div id=\"cs-content\" class=\"cs-content\"><div class=\"x-section e9-e5 m9-0 m9-2 m9-3\"><div class=\"x-div e9-e6 m9-1k m9-1l m9-1m m9-1n m9-1o m9-1p m9-1q m9-1r m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x\"><a class=\"x-div e9-e7 m9-1o m9-1p m9-1t m9-1u m9-1v m9-1x m9-1y m9-1z m9-6\" href=\"https:\/\/theme.co\/\" data-x-effect=\"{&quot;durationBase&quot;:&quot;300ms&quot;}\"><svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xml:space=\"preserve\" viewBox=\"0 0 4320 504\" fill=\"var(--c-module-copy)\">\n  <path d=\"M198 0H0v108h198v396h108V108h198V0H306zm810 198H720V0H612v504h108V306h288v198h108V0h-108zM1224 0h504v108h-504zm0 198h504v108h-504zm0 198h504v108h-504zM2214 0h-378v504h108V108h162v396h108V108h162v396h108V0h-108zm378 0h504v108h-504zm0 198h504v108h-504zm0 198h288v108h-288zm396 0h108v108h-108zM3204 0v504h504V396h-396V108h396V0h-396zm1008 0h-396v504h504V0h-108zm0 396h-288V108h288v288z\"\/>\n<\/svg><\/a><a class=\"x-div e9-e9 m9-1k m9-1n m9-1o m9-1p m9-1x m9-1y m9-20 m9-21 m9-22 m9-23 m9-24 m9-7\" href=\"#pricing\" data-x-effect-provider=\"colors particles effects\" data-x-effect=\"{&quot;durationBase&quot;:&quot;300ms&quot;}\"><div class=\"x-text x-text-headline e9-e10 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-2z m9-30 m9-31\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">Purchase<\/span>\n<\/div><\/div><\/div><\/a><\/div><div class=\"x-div e9-e11 m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y\"><div class=\"x-grid e9-e12 m9-3t m9-3u m9-3v m9-3w m9-3x m9-8\"><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-01-bg);--tco-dc9-6:var(--c-logo-01-bg);--tco-dc9-8:1;--tco-dc9-9:1;--tco-dc9-a:1;--tco-dc9-b:1;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-01);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M67.9,33.5c-0.4-1.7-1.1-3.2-1.9-4.4c-0.9-1.3-2-2.4-3.3-3.3c-1.3-0.9-2.8-1.6-4.6-2c-1.7-0.5-3.6-0.7-5.7-0.7c-4.4,0-8.2,1.1-11.3,3.2c-3.1,2.1-5.5,5.2-7.1,9.2c-1.6,4-2.4,8.8-2.4,14.4c0,5.7,0.8,10.6,2.3,14.6c1.6,4.1,3.9,7.2,6.9,9.3c3.1,2.2,6.9,3.2,11.5,3.2c4,0,7.4-0.6,10.1-1.8c2.7-1.2,4.7-2.8,6-5c1.3-2.2,2-4.7,2-7.6l4.6,0.5H52.6V44.3h43.2v13.5c0,8.9-1.9,16.5-5.6,22.7c-3.8,6.3-8.9,11.1-15.5,14.4c-6.6,3.3-14.1,5-22.6,5c-9.5,0-17.8-2-25-6c-7.2-4-12.7-9.8-16.8-17.2c-4-7.4-6-16.3-6-26.6c0-8,1.2-15.2,3.7-21.4c2.5-6.2,5.9-11.5,10.2-15.8c4.4-4.3,9.4-7.5,15.2-9.7C39.1,1.1,45.2,0,51.8,0c5.8,0,11.1,0.8,16.1,2.4c5,1.6,9.3,3.9,13.2,6.9c3.8,3,6.9,6.5,9.2,10.6s3.8,8.6,4.3,13.5H67.9z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-01);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">G<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-02-bg);--tco-dc9-6:var(--c-logo-02-bg);--tco-dc9-8:2;--tco-dc9-9:2;--tco-dc9-a:2;--tco-dc9-b:2;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-02);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M9.4,100V0h41.3c7.5,0,14,1.3,19.4,4s9.7,6.5,12.6,11.5s4.4,10.9,4.4,17.8c0,6.9-1.5,12.8-4.5,17.6c-3,4.8-7.3,8.5-12.9,11S57.6,65.8,50,65.8H23.9v-19h21.6c3.6,0,6.7-0.5,9.2-1.4c2.5-1,4.3-2.4,5.6-4.4s1.9-4.5,1.9-7.6c0-3.1-0.6-5.7-1.9-7.7S57.1,22,54.6,21c-2.5-1-5.5-1.5-9.1-1.5H33.6V100H9.4z M65.7,54.3L90.6,100H64.2L39.8,54.3H65.7z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-02);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">r<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-03-bg);--tco-dc9-6:var(--c-logo-03-bg);--tco-dc9-8:3;--tco-dc9-9:3;--tco-dc9-a:3;--tco-dc9-b:3;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-03);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M60.6,0v100H39.4V0H60.6z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-03);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">i<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-04-bg);--tco-dc9-6:var(--c-logo-04-bg);--tco-dc9-8:4;--tco-dc9-9:4;--tco-dc9-a:4;--tco-dc9-b:4;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-04);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M42.7,100H8.8V0h34.6C53.3,0,61.8,2,69,6c7.1,4,12.6,9.7,16.5,17.2c3.8,7.5,5.8,16.4,5.8,26.8c0,10.4-1.9,19.4-5.8,26.9C81.6,84.2,76,90,68.8,94C61.5,98,52.8,100,42.7,100z M26.9,84.3h14.9c7,0,12.8-1.3,17.4-3.8c4.7-2.6,8.2-6.4,10.5-11.5c2.3-5.1,3.5-11.5,3.5-19.1s-1.2-14-3.5-19.1c-2.3-5.1-5.8-8.9-10.4-11.4c-4.6-2.5-10.2-3.8-17-3.8H26.9V84.3z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-04);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">d<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:2;--tco-dc9-3:var(--c-logo-05-bg);--tco-dc9-6:var(--c-logo-05-bg);--tco-dc9-8:5;--tco-dc9-9:5;--tco-dc9-a:5;--tco-dc9-b:5;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-05);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M93.8,50c0,10.4-1.9,19.3-5.7,26.8c-3.8,7.5-9,13.2-15.6,17.2s-14.1,6-22.5,6c-8.4,0-15.9-2-22.6-6s-11.8-9.7-15.6-17.2C8.1,69.3,6.2,60.4,6.2,50c0-10.4,1.9-19.3,5.7-26.8c3.8-7.5,9-13.2,15.6-17.2S41.6,0,50,0c8.4,0,15.9,2,22.5,6s11.8,9.7,15.6,17.2C91.9,30.7,93.8,39.6,93.8,50z M79.3,50c0-7.9-1.3-14.6-3.8-20c-2.5-5.4-6-9.6-10.5-12.4c-4.4-2.8-9.4-4.2-15-4.2c-5.6,0-10.6,1.4-15,4.2S27.1,24.5,24.6,30c-2.5,5.4-3.8,12.1-3.8,20c0,7.9,1.3,14.6,3.8,20c2.6,5.4,6,9.6,10.4,12.4c4.4,2.8,9.4,4.2,15,4.2c5.6,0,10.6-1.4,15-4.2c4.4-2.8,7.9-6.9,10.5-12.4C78,64.6,79.3,57.9,79.3,50z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-05);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">o<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-06-bg);--tco-dc9-6:var(--c-logo-06-bg);--tco-dc9-8:6;--tco-dc9-9:6;--tco-dc9-a:6;--tco-dc9-b:6;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-06);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M14.2,100V0H48c7.8,0,14.2,1.3,19.2,4c5,2.7,8.7,6.3,11.1,10.9c2.4,4.6,3.6,9.9,3.6,15.8s-1.2,11.1-3.6,15.7c-2.4,4.6-6.1,8.1-11.1,10.7c-5,2.6-11.3,3.9-19.1,3.9H20.8V50h27c5.3,0,9.6-0.8,12.9-2.3c3.3-1.6,5.6-3.8,7.1-6.7c1.5-2.9,2.2-6.3,2.2-10.3c0-4-0.7-7.5-2.2-10.5c-1.5-3-3.9-5.3-7.2-7c-3.3-1.6-7.6-2.5-13-2.5H26.3V100H14.2z M61.2,55.1L85.8,100H71.8L47.6,55.1H61.2z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-06);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">r<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-07-bg);--tco-dc9-6:var(--c-logo-07-bg);--tco-dc9-8:7;--tco-dc9-9:7;--tco-dc9-a:7;--tco-dc9-b:7;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-07);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M18.3,100H8.7L45.1,0h9.8l36.4,100h-9.6L50.3,11.9h-0.7L18.3,100z M25.2,61.7h49.6v8.2H25.2V61.7z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-07);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">a<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-08-bg);--tco-dc9-6:var(--c-logo-08-bg);--tco-dc9-8:8;--tco-dc9-9:8;--tco-dc9-a:8;--tco-dc9-b:8;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-08);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M4.5,0h6.6l38.5,91.2h0.7L88.9,0h6.6v100h-5.9V14.5h-0.6L52.9,100h-5.8L10.9,14.5h-0.6V100H4.5V0z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-08);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">m<\/span>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e13 m9-43 m9-44 m9-45 m9-46 m9-9 m9-a x-effect-exit\" style=\"--tco-dc9-1:auto;--tco-dc9-3:var(--c-logo-09-bg);--tco-dc9-6:var(--c-logo-09-bg);--tco-dc9-8:9;--tco-dc9-9:9;--tco-dc9-a:9;--tco-dc9-b:9;\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;0%&quot;,&quot;offsetBottom&quot;:&quot;-99%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div style=\"color: var(--c-logo-09);\">\n<svg version='1.1' xmlns='http:\/\/www.w3.org\/2000\/svg' xmlns:xlink='http:\/\/www.w3.org\/1999\/xlink' x='0px' y='0px' viewBox='0 0 100 100' style='enable-background:new 0 0 100 100;' xml:space='preserve'><path d='M15.4,100h-3.3L47.8,0h4.3l35.7,100h-3.3L50.2,3.9h-0.4L15.4,100z M26.8,63.1h46.5v3.1H26.8V63.1z'\/><\/svg>\n<\/div><div style=\"--tco-dc9-c:var(--c-logo-09);\" class=\"x-text x-text-headline e9-e15 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-30 m9-32 m9-33 m9-34\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">a<\/span>\n<\/div><\/div><\/div><\/div><\/div><\/div><div class=\"x-div e9-e16 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e17 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e18 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e18 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e18 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e18 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e18 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e18 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><\/div><section class=\"x-section e9-e19 m9-0 m9-3 m9-4\" data-module=\"1\"><div class=\"x-grid e9-e20 m9-3u m9-3v m9-3w m9-3x m9-3y m9-40\"><div class=\"x-cell e9-e21 m9-45 m9-46 m9-48 m9-49 m9-4a\"><div class=\"x-text x-text-headline e9-e22 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>Do you know what companies like <strong>Apple<\/strong> <em>(tech)<\/em>, <strong>Netflix<\/strong> <em>(streaming)<\/em>, <strong>Solana<\/strong> <em>(crypto)<\/em>, and <strong>Twitch<\/strong> <em>(gaming)<\/em> all have in common?<\/p>\n\n<p>It's not their near infinite web design budgets or the billions they sell through their websites.<\/p>\n\n<p><strong>No, they are ALL forward thinking technology companies and they ALL use CSS Grid.<\/strong><\/p>\n\n<p>And they don't just use it because it's &ldquo;pretty&rdquo; or the latest fad&mdash;they use it because it allows them to <em>creatively engage their visitors and turn those visitors into leads and customers.<\/em><\/p>\n\n<p>CSS Grid is a true powerhouse of a technology. It allows you to build those <strong>impossible looking layouts<\/strong> that seem to defy gravity.<\/p>\n\n<p>It is a <strong>stealth weapon<\/strong> of the biggest brands and top-tier designers. There's just one rather significant problem. Most people who build or manage websites don't know how it works and <em>many have never even heard of it!<\/em><\/p>\n\n<p>We want to change that because we believe...<\/p><\/div>\n<\/div><\/div><\/div><div class=\"x-text x-text-headline e9-e23 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-3a m9-a m9-b is-course-copy is-grande x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p><strong>If billion &amp; trillion<\/strong> <span>dollar companies are using CSS Grid on their websites,<\/span> <strong>you can as well!<\/strong><\/p><\/div>\n<\/div><\/div><\/div><div class=\"x-text x-text-headline e9-e24 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>(And we can show you how).<\/p>\n\n<p>CSS Grid is <em>so<\/em> forward thinking and <em>so<\/em> incredibly powerful that the sites and layouts and heck, even <em>the clients<\/em> of tomorrow will be <strong>demanding it to stay relevant.<\/strong> You really don't have a choice.<\/p>\n\n<p>This got us thinking...<\/p>\n\n<p>What if there was <em>one place<\/em> you could go that taught <strong>everything you need to know<\/strong> about CSS Grid...from the ground up...so you or your team can go from zero to hero in as little as a day?<\/p>\n\n<p>And what if you were given some of the best examples of CSS Grid on the market today. <strong>Yes, given!<\/strong> Designs you could use right away on personal or client sites.<\/p>\n\n<p>And imagine, if in addition to all of that&mdash;we created a <strong>powerful visual editor<\/strong> that lets you customize those CSS Grid layouts (or build your own) without having to mess with any fussy code?<\/p>\n\n<p><em>Well that would be pretty darn awesome!<\/em><\/p><\/div>\n<\/div><\/div><\/div><a class=\"x-div e9-e25 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1x m9-1y m9-20 m9-21 m9-24 m9-27 m9-28 m9-7 m9-a m9-b m9-c is-next-module x-effect-exit\" href=\"#module-2\" data-x-effect-provider=\"colors particles effects\" data-x-effect=\"{&quot;durationBase&quot;:&quot;300ms&quot;,&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\" data-next-module=\"2\"><div class=\"x-text x-text-headline e9-e26 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-3b\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">Say Hello to Gridorama<\/span>\n<\/div><\/div><\/div><\/a><\/div><\/div><div class=\"x-div e9-e27 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e28 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e29 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e29 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e29 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e29 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e29 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e29 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><\/section><section class=\"x-section e9-e30 m9-0 m9-3 m9-4\" data-module=\"2\"><div class=\"x-grid e9-e31 m9-3u m9-3v m9-3w m9-3y m9-40 m9-41\" id=\"module-2\"><div class=\"x-cell e9-e32 m9-45 m9-46 m9-48 m9-4a m9-4b\"><div class=\"x-text x-text-headline e9-e33 m9-2s m9-2t m9-2u m9-2v m9-2w m9-2y m9-34 m9-35 m9-39 m9-3c m9-3d m9-3e m9-a m9-b is-course-h x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h2 class=\"x-text-content-text-primary\">Nice To Meet You.<\/h2>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e34 m9-45 m9-46 m9-48 m9-4a m9-4c\"><div class=\"x-text x-text-headline e9-e35 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>From training to templates and from tech to tools, <strong>Gridorama has everything you need to start using CSS Grid like the big boys.<\/strong><\/p>\n\n<p>And it doesn't matter whether you're a one-man band or a large web agency&mdash;a new beginner or a seasoned pro. Gridorama will take you by the hand and teach you everything you need to know.<\/p><\/div>\n<\/div><\/div><\/div><ul class=\"x-row e9-e36 m9-k m9-o m9-p m9-q m9-z m9-10 m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-row-inner\"><li class=\"x-col e9-e37 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e38 m9-4d m9-4e m9-4f m9-d\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e39 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><em>Tired of all your layouts looking the same?<\/em><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e37 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e38 m9-4d m9-4e m9-4f m9-d\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e39 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><em>Looking to broaden your design portfolio?<\/em><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e37 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e38 m9-4d m9-4e m9-4f m9-d\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e39 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><em>Want to attract higher value clients?<\/em><\/div>\n<\/div><\/div><\/div><\/li><\/div><\/ul><div class=\"x-text x-text-headline e9-e40 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p><strong>Gridorama is the answer!<\/strong> Join us for a quick tour of all that we have in store for you.<\/p><\/div>\n<\/div><\/div><\/div><a class=\"x-div e9-e41 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1x m9-1y m9-20 m9-21 m9-24 m9-27 m9-28 m9-7 m9-a m9-b m9-c is-next-module x-effect-exit\" href=\"#module-3\" data-x-effect-provider=\"colors particles effects\" data-x-effect=\"{&quot;durationBase&quot;:&quot;300ms&quot;,&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\" data-next-module=\"3\"><div class=\"x-text x-text-headline e9-e42 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-3b\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">Show Me the Goods<\/span>\n<\/div><\/div><\/div><\/a><\/div><\/div><div class=\"x-div e9-e43 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e44 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e45 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e45 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e45 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e45 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e45 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e45 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><\/section><section class=\"x-section e9-e46 m9-0 m9-3 m9-4 m9-5\" data-module=\"3\"><div class=\"x-grid e9-e47 m9-3u m9-3v m9-3w m9-3y m9-40 m9-41\" id=\"module-3\"><div class=\"x-cell e9-e48 m9-45 m9-46 m9-48 m9-4a m9-4b\"><div class=\"x-text x-text-headline e9-e49 m9-2s m9-2t m9-2u m9-2v m9-2w m9-2y m9-34 m9-35 m9-39 m9-3d m9-3e m9-a m9-b is-course-h x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h2 class=\"x-text-content-text-primary\">Done For You Designs.<\/h2>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e50 m9-45 m9-46 m9-48 m9-4a m9-4c\"><div class=\"x-text x-text-headline e9-e51 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>Sometimes the best way to learn is to start with the end in mind. This is certainly true in the design world, and this is even <em>more true<\/em> when learning something like CSS Grid.<\/p>\n\n<p>In light of this, we've put together an <strong>amazing collection of tantalizing templates<\/strong> to help you both learn and use CSS Grid...the right way.<\/p>\n\n<p>From sections to sliders, many of these designs are inspired from leading brands...those billion and trillion dollar companies who are <em>constantly testing<\/em> engagement and conversion and who keep their websites on the <strong>cutting edge of what is possible.<\/strong><\/p>\n\n<p>We not only <em>give you the layouts,<\/em> we're going to teach you how they were put together then let you use them as you see fit...all built into our visual grid editor! Check out just a few of our favorites.<\/p><\/div>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e52 m9-45 m9-46 m9-48 m9-4a m9-4c\"><figure class=\"x-div e9-e53 m9-1o m9-1p m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x m9-29 m9-2a m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><span class=\"x-image e9-e54 m9-4i m9-4j\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/07\/example-01.jpg\" alt=\"Gridorama Example\" loading=\"lazy\"><\/span><div class=\"x-text x-text-headline e9-e55 m9-2s m9-2t m9-2v m9-2w m9-2y m9-31 m9-33 m9-34 m9-39 m9-3a m9-3f m9-3g m9-3h has-link\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><p class=\"x-text-content-text-primary\">Really creative layout inspired by Netflix.<\/p>\n<\/div><\/div><\/div><\/figure><figure class=\"x-div e9-e53 m9-1o m9-1p m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x m9-29 m9-2a m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><span class=\"x-image e9-e54 m9-4i m9-4j\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/07\/example-02.jpg\" alt=\"Gridorama Example\" loading=\"lazy\"><\/span><div class=\"x-text x-text-headline e9-e55 m9-2s m9-2t m9-2v m9-2w m9-2y m9-31 m9-33 m9-34 m9-39 m9-3a m9-3f m9-3g m9-3h has-link\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><p class=\"x-text-content-text-primary\">We call this the &ldquo;Sweet Grid&rdquo; and it's a fun one to work with!<\/p>\n<\/div><\/div><\/div><\/figure><figure class=\"x-div e9-e53 m9-1o m9-1p m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x m9-29 m9-2a m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><span class=\"x-image e9-e54 m9-4i m9-4j\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/07\/example-03.jpg\" alt=\"Gridorama Example\" loading=\"lazy\"><\/span><div class=\"x-text x-text-headline e9-e55 m9-2s m9-2t m9-2v m9-2w m9-2y m9-31 m9-33 m9-34 m9-39 m9-3a m9-3f m9-3g m9-3h has-link\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><p class=\"x-text-content-text-primary\">Grids within grids? Yes, please! Learn how Microsoft does it.<\/p>\n<\/div><\/div><\/div><\/figure><figure class=\"x-div e9-e53 m9-1o m9-1p m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x m9-29 m9-2a m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><span class=\"x-image e9-e54 m9-4i m9-4j\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/07\/example-04.jpg\" alt=\"Gridorama Example\" loading=\"lazy\"><\/span><div class=\"x-text x-text-headline e9-e55 m9-2s m9-2t m9-2v m9-2w m9-2y m9-31 m9-33 m9-34 m9-39 m9-3a m9-3f m9-3g m9-3h has-link\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><p class=\"x-text-content-text-primary\">No that's not one big image...there's more than meets the eye with these donuts.<\/p>\n<\/div><\/div><\/div><\/figure><figure class=\"x-div e9-e53 m9-1o m9-1p m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x m9-29 m9-2a m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><span class=\"x-image e9-e54 m9-4i m9-4j\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/07\/example-05.jpg\" alt=\"Gridorama Example\" loading=\"lazy\"><\/span><div class=\"x-text x-text-headline e9-e55 m9-2s m9-2t m9-2v m9-2w m9-2y m9-31 m9-33 m9-34 m9-39 m9-3a m9-3f m9-3g m9-3h has-link\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><p class=\"x-text-content-text-primary\">A fun, modern grid-based layout inspired by Slack.<\/p>\n<\/div><\/div><\/div><\/figure><figure class=\"x-div e9-e53 m9-1o m9-1p m9-1s m9-1t m9-1u m9-1v m9-1w m9-1x m9-29 m9-2a m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><span class=\"x-image e9-e54 m9-4i m9-4j\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/07\/example-06.jpg\" alt=\"Gridorama Example\" loading=\"lazy\"><\/span><div class=\"x-text x-text-headline e9-e55 m9-2s m9-2t m9-2v m9-2w m9-2y m9-31 m9-33 m9-34 m9-39 m9-3a m9-3f m9-3g m9-3h has-link\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><p class=\"x-text-content-text-primary\">This is not only a grid, it's also a slider! We're pushing the boundaries of what is possible here. <a class=\"is-course-copy\" target=\"_blank\" href=\"https:\/\/theme.co\/gridorama\/grid-slider-demo\/\">(Demo)<\/a><\/p>\n<\/div><\/div><\/div><\/figure><\/div><div class=\"x-cell e9-e56 m9-45 m9-46 m9-48 m9-4a m9-4c\"><div class=\"x-text x-text-headline e9-e57 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>We want CSS Grid to be simple and approachable for <strong>all skill levels.<\/strong> These ready-made designs will supercharge your Grid journey with an incredible collection of assets!<\/p><\/div>\n<\/div><\/div><\/div><a class=\"x-div e9-e58 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1x m9-1y m9-20 m9-21 m9-24 m9-27 m9-28 m9-7 m9-a m9-b m9-c is-next-module x-effect-exit\" href=\"#module-4\" data-x-effect-provider=\"colors particles effects\" data-x-effect=\"{&quot;durationBase&quot;:&quot;300ms&quot;,&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\" data-next-module=\"4\"><div class=\"x-text x-text-headline e9-e59 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-3b\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">But Wait, There's More \ud83d\ude42<\/span>\n<\/div><\/div><\/div><\/a><\/div><\/div><div class=\"x-div e9-e60 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e61 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e62 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e62 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e62 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e62 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e62 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e62 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><\/section><section class=\"x-section e9-e63 m9-0 m9-3 m9-4\" data-module=\"4\"><div class=\"x-grid e9-e64 m9-3u m9-3v m9-3w m9-3y m9-40 m9-41\" id=\"module-4\"><div class=\"x-cell e9-e65 m9-45 m9-46 m9-48 m9-4a m9-4b\"><div class=\"x-text x-text-headline e9-e66 m9-2s m9-2t m9-2u m9-2v m9-2w m9-2y m9-34 m9-35 m9-39 m9-3e m9-3i m9-a m9-b is-course-h has-mobile-tweak x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h2 class=\"x-text-content-text-primary\">The Grid Masterclass.<\/h2>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e67 m9-45 m9-46 m9-48 m9-4a m9-4c\"><div class=\"x-text x-text-headline e9-e68 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>To know Grid is to love Grid, but to know Grid...<em>you first need to know Grid!<\/em><\/p>\n\n<p>And that's why we've put together <strong>the most comprehensive course about CSS Grid<\/strong> on the market today.<\/p>\n\n<p>You will not only learn the <em>ins<\/em> and <em>outs<\/em> to this powerful layout engine, we'll teach you how to incorporate it into designs starting today!<\/p>\n\n<p>As a matter of fact, your guide for this journey is none other than our very own <em>Kory Wakefield<\/em>&mdash;Themeco's lead developer extraordinaire.<\/p>\n\n<p>Kory is a <strong>top expert on all things CSS Grid<\/strong> and has been on the cutting edge of this technology from the very beginning. Follow along as Kory teaches you about:<\/p><\/div>\n<\/div><\/div><\/div><ul class=\"x-row e9-e69 m9-k m9-o m9-p m9-q m9-z m9-11 m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-row-inner\"><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>The Power of CSS Grid<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Grid Jargon 101<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>The 2nd Dimension<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Content Considerations<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Building Your First Template<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Percentages Simplified<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>AI Grids<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Minmax Magic<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Alignment & Justification<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Sizing & Placement<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Grid in Cornerstone<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Auto Responsive Layouts<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>The Gap Trick<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Thinking in Two Dimensions<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Content Duplets<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>The Secret Power of Auto<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Creative Templating<\/strong><\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e70 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1e\"><i class=\"x-icon e9-e71 m9-4d m9-4e m9-4f\" aria-hidden=\"true\" data-x-icon-l=\"&#xf058;\"><\/i><div class=\"x-text x-text-headline e9-e72 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-38 m9-39 is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><strong>Grid Can Do That?<\/strong><\/div>\n<\/div><\/div><\/div><\/li><\/div><\/ul><div class=\"x-text x-text-headline e9-e73 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p>And those are just the high level topics! Look at some of the <em>actual things<\/em> you'll learn how to do. Remember, this is just a small sample.<\/p><\/div>\n<\/div><\/div><\/div><ul class=\"x-row e9-e74 m9-k m9-o m9-p m9-r m9-z m9-12 m9-a m9-b x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-row-inner\"><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Implement <strong>&ldquo;artificial intelligence&rdquo;<\/strong> grids in your designs that can adapt to layouts without responsive styling.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Learn how to <strong>create organic grid canvases<\/strong> by sizing row tracks intrinsically based off the Elements in your layout.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Discover how <strong>section transitions are your new best friend<\/strong> and can be very, very forgiving when you need it the most.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">See how you can <strong>break CSS Grid out of the box<\/strong> to create some truly advanced layouts.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Learn how to <strong>create densely packed grids<\/strong> using an example from a big time eCommerce player (and get the template to boot).<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Leverage the <strong>auto keyword<\/strong> in unique and out-of-the-box ways that can unlock all sorts of layout potential.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Combine grids with <strong>creative interaction and scroll<\/strong> effects to create unique experiences for your users.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">See how CSS Grid can be used in <strong>unlikely places<\/strong> like background designs, megamenus, sliders, and more.<\/div>\n<\/div><\/div><\/div><\/li><li class=\"x-col e9-e75 m9-19 m9-1a m9-1c m9-1d m9-1e m9-1f\"><i class=\"x-icon e9-e76 m9-4d m9-4f m9-4g m9-e\" aria-hidden=\"true\" data-x-icon-s=\"&#xf111;\"><\/i><div class=\"x-text x-text-headline e9-e77 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-31 m9-34 m9-37 m9-39 m9-3j is-course-copy\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\">Unlock the power of <strong>source order independence<\/strong> with CSS Grid to create layouts that break out of their natural flow.<\/div>\n<\/div><\/div><\/div><\/li><\/div><\/ul><a class=\"x-div e9-e78 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1x m9-1y m9-20 m9-21 m9-24 m9-27 m9-28 m9-7 m9-a m9-b m9-c is-next-module x-effect-exit\" href=\"#module-5\" data-x-effect-provider=\"colors particles effects\" data-x-effect=\"{&quot;durationBase&quot;:&quot;300ms&quot;,&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\" data-next-module=\"5\"><div class=\"x-text x-text-headline e9-e79 m9-2r m9-2s m9-2t m9-2u m9-2v m9-2w m9-2x m9-2y m9-3b\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">Sold! How Do I Get Started?<\/span>\n<\/div><\/div><\/div><\/a><\/div><\/div><div class=\"x-div e9-e80 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e81 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e82 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e82 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e82 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e82 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e82 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e82 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><\/section><section class=\"x-section e9-e83 m9-0 m9-3 m9-4 m9-5\" id=\"pricing\" data-module=\"5\"><div class=\"x-grid e9-e84 m9-3u m9-3v m9-3y m9-40 m9-41 m9-42\" id=\"module-5\"><div class=\"x-cell e9-e85 m9-45 m9-46 m9-48 m9-4a m9-4b\"><div class=\"x-text x-text-headline e9-e86 m9-2s m9-2t m9-2u m9-2v m9-2w m9-2y m9-34 m9-35 m9-39 m9-3d m9-3e m9-3k m9-a m9-b is-course-h x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h2 class=\"x-text-content-text-primary\">Become a Grid Master.<\/h2>\n<\/div><\/div><\/div><\/div><\/div><div class=\"x-div e9-e97 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e98 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e99 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e99 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e99 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e99 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e99 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e99 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><div class=\"x-row x-container max width e9-e100 m9-k m9-r m9-u m9-v m9-13 m9-15\"><div class=\"x-row-inner\"><div class=\"x-col e9-e101 m9-19 m9-1b m9-1c m9-1g m9-1i m9-f m9-g\" data-x-effect-provider=\"colors particles effects\"><div class=\"x-div e9-e102 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1y m9-20 m9-21 m9-2e m9-2h m9-2i m9-2j m9-2k m9-2l\"><div class=\"x-bg\" aria-hidden=\"true\"><div class=\"x-bg-layer-lower-image\"><\/div><div class=\"x-bg-layer-upper-color\"><\/div><\/div><span class=\"x-image e9-e103 m9-4j m9-4k m9-4l m9-g\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2025\/12\/themeco-gridorama.png\" width=\"716\" height=\"636\" alt=\"Pro Unlimited + Gridorama Logo\" loading=\"lazy\"><\/span><\/div><div class=\"x-div e9-e104 m9-1k m9-1p m9-1t m9-1u m9-1w m9-1x m9-1y m9-20 m9-2c m9-2i m9-2m m9-2n\"><div class=\"x-text x-text-headline e9-e105 m9-2r m9-2s m9-2v m9-30 m9-34 m9-3q m9-3r\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">Gridorama bundle<\/span>\n<\/div><\/div><\/div><div class=\"x-div e9-e106 m9-1k m9-1l m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-2m m9-2o\"><div class=\"x-text x-text-headline e9-e107 m9-2r m9-2s m9-2t m9-2u m9-2v m9-33 m9-34 m9-39 m9-3n m9-3r m9-3s\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h3 class=\"x-text-content-text-primary\">$649 <span style=\"text-decoration: line-through; color: #999999;\">$946<\/span><\/h3>\n<\/div><\/div><\/div><div class=\"x-text x-content e9-e108 m9-4o m9-4p m9-4q m9-4r m9-4s\"><p>One Time<\/p><\/div><\/div><div class=\"x-text x-content e9-e109 m9-4o m9-4p m9-4s m9-4t m9-4u m9-4v\"><p>Leverage the latest in web design. Get instant access to the Pro Theme, Cornerstone Builder, and Gridorama.<\/p><\/div><hr class=\"x-line e9-e110 m9-4y\"\/><div class=\"x-row e9-e111 m9-k m9-l m9-m m9-s m9-w m9-x m9-16\"><ul class=\"x-row-inner\"><li class=\"x-col e9-e112 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e113 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e114 m9-4o m9-4p m9-4q m9-4w\"><p>Unlimited Use<\/p><\/div><\/li><li class=\"x-col e9-e115 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e116 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e117 m9-4o m9-4p m9-4q m9-4w\"><p>Lifetime Updates<\/p><\/div><\/li><li class=\"x-col e9-e118 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e119 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e120 m9-4o m9-4p m9-4t m9-4w\"><p>Pro Theme<\/p><\/div><\/li><li class=\"x-col e9-e121 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e122 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e123 m9-4o m9-4p m9-4t m9-4w\"><p>Cornerstone Builder<\/p><\/div><\/li><li class=\"x-col e9-e124 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e125 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e126 m9-4o m9-4p m9-4t m9-4w\"><p>Gridorama<\/p><\/div><\/li><\/ul><\/div><hr class=\"x-line e9-e127 m9-4y\"\/><a class=\"x-anchor x-anchor-button has-graphic e9-e128 m9-4z m9-50 m9-h animated-gradient\" tabindex=\"0\" style=\"--tco-dc9-g:0px;\" href=\"https:\/\/theme.co\/checkout\/gridorama-bundle\"><div class=\"x-anchor-content\"><span class=\"x-graphic\" aria-hidden=\"true\"><i class=\"x-icon x-graphic-child x-graphic-icon x-graphic-primary\" aria-hidden=\"true\" data-x-icon-s=\"&#xf061;\"><\/i><\/span><div class=\"x-anchor-text\"><span class=\"x-anchor-text-primary\">Purchase Bundle<\/span><\/div><\/div><\/a><div class=\"x-text x-content e9-e129 m9-4p m9-4s m9-4t m9-4v m9-4x\"><p><strong>Who is this for?<\/strong> Great for new or existing Themeco customers and includes everything you need to build powerful, dynamic websites.<\/p><\/div><\/div><\/div><div class=\"x-col e9-e130 m9-19 m9-1b m9-1c m9-1g m9-1i m9-f m9-g\" data-x-effect-provider=\"colors particles effects\"><div class=\"x-div e9-e131 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1y m9-20 m9-21 m9-2e m9-2h m9-2i m9-2l m9-2p\"><div class=\"x-bg\" aria-hidden=\"true\"><div class=\"x-bg-layer-upper-color\"><\/div><\/div><span class=\"x-image e9-e132 m9-4j m9-4l m9-4m m9-g\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2025\/12\/gridorama-logo.png\" width=\"431\" height=\"181\" alt=\"Gridorama Logo\" loading=\"lazy\"><\/span><\/div><div class=\"x-div e9-e133 m9-1k m9-1p m9-1t m9-1u m9-1w m9-1x m9-1y m9-20 m9-2c m9-2i m9-2m m9-2n\"><div class=\"x-text x-text-headline e9-e134 m9-2r m9-2s m9-2v m9-30 m9-34 m9-3q m9-3r\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">Gridorama<\/span>\n<\/div><\/div><\/div><div class=\"x-div e9-e135 m9-1k m9-1l m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-2m m9-2o\"><div class=\"x-text x-text-headline e9-e136 m9-2r m9-2s m9-2t m9-2u m9-2v m9-33 m9-34 m9-39 m9-3n m9-3r m9-3s\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h3 class=\"x-text-content-text-primary\">$60 <span style=\"text-decoration: line-through; color: #999999;\">$199<\/span><\/h3>\n<\/div><\/div><\/div><div class=\"x-text x-content e9-e137 m9-4o m9-4p m9-4q m9-4r m9-4s\"><p>One Time<\/p><\/div><\/div><div class=\"x-text x-content e9-e138 m9-4o m9-4p m9-4s m9-4t m9-4u m9-4v\"><p>Get instant access to Gridorama and learn how to build the most advanced, gravity defying websites.<\/p><\/div><hr class=\"x-line e9-e139 m9-4y\"\/><div class=\"x-row e9-e140 m9-k m9-l m9-m m9-s m9-w m9-x m9-17\"><ul class=\"x-row-inner\"><li class=\"x-col e9-e141 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e142 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e143 m9-4o m9-4p m9-4t m9-4w\"><p>Unlimited Use<\/p><\/div><\/li><li class=\"x-col e9-e144 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e145 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e146 m9-4o m9-4p m9-4t m9-4w\"><p>Lifetime Updates<\/p><\/div><\/li><li class=\"x-col e9-e147 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e148 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e149 m9-4o m9-4p m9-4t m9-4w\"><p>CSS Grid vs Flexbox<\/p><\/div><\/li><li class=\"x-col e9-e150 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e151 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e152 m9-4o m9-4p m9-4t m9-4w\"><p>Content Considerations<\/p><\/div><\/li><li class=\"x-col e9-e153 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e154 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e155 m9-4o m9-4p m9-4t m9-4w\"><p>Percentages Simplified<\/p><\/div><\/li><li class=\"x-col e9-e156 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e157 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e158 m9-4o m9-4p m9-4t m9-4w\"><p>AI Grids<\/p><\/div><\/li><li class=\"x-col e9-e159 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e160 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e161 m9-4o m9-4p m9-4t m9-4w\"><p>Minmax Magic<\/p><\/div><\/li><li class=\"x-col e9-e162 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e163 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e164 m9-4o m9-4p m9-4t m9-4w\"><p>Keywords Galore<\/p><\/div><\/li><li class=\"x-col e9-e165 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e166 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e167 m9-4o m9-4p m9-4t m9-4w\"><p>Alignment &amp; Justification<\/p><\/div><\/li><li class=\"x-col e9-e168 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e169 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e170 m9-4o m9-4p m9-4t m9-4w\"><p>Sizing &amp; Placement<\/p><\/div><\/li><li class=\"x-col e9-e171 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e172 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e173 m9-4o m9-4p m9-4t m9-4w\"><p>Auto-Responsive Layouts<\/p><\/div><\/li><li class=\"x-col e9-e174 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e175 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e176 m9-4o m9-4p m9-4t m9-4w\"><p>And so much more!<\/p><\/div><\/li><\/ul><\/div><hr class=\"x-line e9-e177 m9-4y\"\/><a class=\"x-anchor x-anchor-button has-graphic e9-e178 m9-50 m9-51 m9-i animated-gradient\" tabindex=\"0\" style=\"--tco-dc9-m:0px;\" href=\"https:\/\/theme.co\/checkout\/gridorama\"><div class=\"x-anchor-content\"><span class=\"x-graphic\" aria-hidden=\"true\"><i class=\"x-icon x-graphic-child x-graphic-icon x-graphic-primary\" aria-hidden=\"true\" data-x-icon-s=\"&#xf061;\"><\/i><\/span><div class=\"x-anchor-text\"><span class=\"x-anchor-text-primary\">Purchase Gridorama<\/span><\/div><\/div><\/a><div class=\"x-text x-content e9-e179 m9-4p m9-4s m9-4t m9-4v m9-4x\"><p><strong>Who is this for?<\/strong> Great for existing Themeco customers who just want to purchase Gridorama. You can use it with all of your existing licenses.<\/p><\/div><\/div><\/div><div class=\"x-col e9-e180 m9-19 m9-1b m9-1c m9-1g m9-1i m9-f m9-g\" data-x-effect-provider=\"colors particles effects\"><div class=\"x-div e9-e181 m9-1k m9-1n m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1y m9-20 m9-21 m9-2e m9-2h m9-2i m9-2k m9-2q\"><div class=\"x-bg\" aria-hidden=\"true\"><div class=\"x-bg-layer-lower-image\"><\/div><div class=\"x-bg-layer-upper-color\"><\/div><\/div><span class=\"x-image e9-e182 m9-4j m9-4l m9-4n\"><img decoding=\"async\" src=\"https:\/\/theme.co\/app\/uploads\/2026\/03\/pm2026.png\" width=\"594\" height=\"576\" alt=\"Pro Max Logo\" loading=\"lazy\"><\/span><\/div><div class=\"x-div e9-e183 m9-1k m9-1p m9-1t m9-1u m9-1w m9-1x m9-1y m9-20 m9-2c m9-2i m9-2m m9-2n\"><div class=\"x-text x-text-headline e9-e184 m9-2r m9-2s m9-2v m9-30 m9-34 m9-3q m9-3r\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><span class=\"x-text-content-text-primary\">All Products<\/span>\n<\/div><\/div><\/div><div class=\"x-div e9-e185 m9-1k m9-1l m9-1o m9-1p m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-2m m9-2o\"><div class=\"x-text x-text-headline e9-e186 m9-2r m9-2s m9-2t m9-2u m9-2v m9-33 m9-34 m9-39 m9-3n m9-3r m9-3s\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h3 class=\"x-text-content-text-primary\">From $99<\/h3>\n<\/div><\/div><\/div><div class=\"x-text x-content e9-e187 m9-4o m9-4p m9-4q m9-4r m9-4s\"><p>\/year<\/p><\/div><\/div><div class=\"x-text x-content e9-e188 m9-4o m9-4p m9-4s m9-4t m9-4u m9-4v\"><p><strong>Pro Max<\/strong> includes Pro and Cornerstone plus our entire lineup of plugins, courses, and templates. <a style=\"color: #559f6e;\" title=\"Max\" href=\"https:\/\/theme.co\/max\" target=\"_blank\" rel=\"noopener\"><span style=\"text-decoration: underline;\">About Max<\/span><\/a>.<\/p><\/div><hr class=\"x-line e9-e189 m9-4y\"\/><div class=\"x-row e9-e190 m9-k m9-l m9-m m9-s m9-w m9-x m9-18\"><ul class=\"x-row-inner\"><li class=\"x-col e9-e191 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e192 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e193 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Pro Theme\" href=\"https:\/\/theme.co\/pro\" target=\"_blank\" rel=\"noopener\">Pro Theme<\/a><\/p><\/div><\/li><li class=\"x-col e9-e194 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e195 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e196 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Cornerstone Website Builder\" href=\"https:\/\/theme.co\/cornerstone\/\" target=\"_blank\" rel=\"noopener\">Cornerstone Builder<\/a><\/p><\/div><\/li><li class=\"x-col e9-e197 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e198 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e199 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Design Cloud\" href=\"https:\/\/theme.co\/designcloud\" target=\"_blank\" rel=\"noopener\">Design Cloud<\/a><\/p><\/div><\/li><li class=\"x-col e9-e200 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e201 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e202 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Extensions\" href=\"https:\/\/theme.co\/extensions\" target=\"_blank\" rel=\"noopener\">Extensions<\/a><\/p><\/div><\/li><li class=\"x-col e9-e203 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e204 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e205 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"CSAI\" href=\"https:\/\/theme.co\/csai\/\" target=\"_blank\" rel=\"noopener\">CSAI<\/a> ($749 Value)<\/p><\/div><\/li><li class=\"x-col e9-e206 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e207 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e208 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Personify\" href=\"https:\/\/theme.co\/personify\/\" target=\"_blank\" rel=\"noopener\">Personify<\/a> ($599 Value)<\/p><\/div><\/li><li class=\"x-col e9-e209 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e210 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e211 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Cornerstone Forms\" href=\"https:\/\/theme.co\/cornerstone-forms\/\" target=\"_blank\" rel=\"noopener\">Cornerstone Forms<\/a> ($749 Value)<\/p><\/div><\/li><li class=\"x-col e9-e212 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e213 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e214 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Cornerstone Charts\" href=\"https:\/\/theme.co\/cornerstone-charts\/\" target=\"_blank\" rel=\"noopener\">Cornerstone Charts<\/a> ($749 Value)<\/p><\/div><\/li><li class=\"x-col e9-e215 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e216 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e217 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Web Design Magic\" href=\"https:\/\/theme.co\/web-design-magic\/\" target=\"_blank\" rel=\"noopener\">Web Design Magic<\/a> ($249 Value)<\/p><\/div><\/li><li class=\"x-col e9-e218 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e219 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e220 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Modern Sliders\" href=\"https:\/\/theme.co\/modern-sliders\/\" target=\"_blank\" rel=\"noopener\">Modern Sliders<\/a> ($199 Value)<\/p><\/div><\/li><li class=\"x-col e9-e221 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e222 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e223 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Super Loopers\" href=\"https:\/\/theme.co\/super-loopers\/\" target=\"_blank\" rel=\"noopener\">Super Loopers<\/a> ($249 Value)<\/p><\/div><\/li><li class=\"x-col e9-e224 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e225 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e226 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"Gridorama\" href=\"https:\/\/theme.co\/gridorama\/\" rel=\"noopener\">Gridorama<\/a> ($199 Value)<\/p><\/div><\/li><li class=\"x-col e9-e227 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e228 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e229 m9-4o m9-4p m9-4t m9-4w\"><p><a style=\"color: #ffffff; text-decoration: underline;\" title=\"SiteDrive\" href=\"https:\/\/sitedrive.co\/\" target=\"_blank\" rel=\"noopener\">SiteDrive<\/a> ($749 Value)<\/p><\/div><\/li><li class=\"x-col e9-e230 m9-19 m9-1a m9-1b m9-1c m9-1d m9-1j\"><i class=\"x-icon e9-e231 m9-4f m9-4h\" aria-hidden=\"true\" data-x-icon-s=\"&#xf00c;\"><\/i><div class=\"x-text x-content e9-e232 m9-4o m9-4p m9-4t m9-4w\"><p>Future <a style=\"color: #ffffff; text-decoration: underline;\" title=\"Max\" href=\"https:\/\/theme.co\/max\" target=\"_blank\" rel=\"noopener\">Max Products<\/a> (Priceless)<\/p><\/div><\/li><\/ul><\/div><hr class=\"x-line e9-e233 m9-4y\"\/><a class=\"x-anchor x-anchor-button has-graphic e9-e234 m9-50 m9-52 m9-j animated-gradient\" tabindex=\"0\" style=\"--tco-dc9-s:0px;\" href=\"https:\/\/theme.co\/pricing\"><div class=\"x-anchor-content\"><span class=\"x-graphic\" aria-hidden=\"true\"><i class=\"x-icon x-graphic-child x-graphic-icon x-graphic-primary\" aria-hidden=\"true\" data-x-icon-s=\"&#xf061;\"><\/i><\/span><div class=\"x-anchor-text\"><span class=\"x-anchor-text-primary\">See Pricing<\/span><\/div><\/div><\/a><div class=\"x-text x-content e9-e235 m9-4p m9-4s m9-4t m9-4v m9-4x\"><p><strong>Who is this for? <\/strong>Great for new or existing Themeco customers and includes Pro, Cornerstone, plus all current &amp; future Max products.<\/p><\/div><\/div><\/div><\/div><\/div><\/section><section class=\"x-section e9-e236 m9-0 m9-3 m9-4 m9-5\" data-module=\"6\"><div class=\"x-grid e9-e237 m9-3u m9-3v m9-3w m9-3y m9-40 m9-41\" id=\"module-6\"><div class=\"x-cell e9-e238 m9-45 m9-46 m9-48 m9-4a m9-4b\"><div class=\"x-text x-text-headline e9-e239 m9-2s m9-2t m9-2u m9-2v m9-2w m9-2y m9-34 m9-35 m9-39 m9-3d m9-3e m9-a m9-b is-course-h has-mobile-tweak x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><h2 class=\"x-text-content-text-primary\">Questions &amp; Answers.<\/h2>\n<\/div><\/div><\/div><\/div><div class=\"x-cell e9-e240 m9-45 m9-46 m9-48 m9-4a m9-4c\"><div class=\"x-text x-text-headline e9-e241 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p><strong>Q: Who should buy Gridorama?<\/strong><br \/>A: If you build or manage websites in any way, Gridorama is for you!<\/p>\n<p><strong>Q: Do I need to know coding?<\/strong><br \/>A: Having some background will certainly help, but we start you from the ground up. Gridorama is great for beginners and will help professionals level up their skills.<\/p>\n<p><strong>Q: Can I use this outside of WordPress?<\/strong><br \/>A: Yes! The first half of the course is teaching and explaining how the CSS Grid spec works. This can be used on any platform from Shopify to Squarespace and from WordPress to Wix. It can also be used if you write your own HTML \/ CSS. The second half of the course and templates use our Cornerstone Website Builder. We focus the training and application on this part specifically to WordPress.<\/p>\n<\/div>\n<\/div><\/div><\/div><div class=\"x-text x-text-headline e9-e242 m9-2s m9-2t m9-2u m9-2w m9-2x m9-31 m9-34 m9-35 m9-36 m9-37 m9-38 m9-39 m9-a m9-b is-course-copy x-effect-exit\" data-x-effect=\"{&quot;scroll&quot;:true,&quot;offsetTop&quot;:&quot;10%&quot;,&quot;offsetBottom&quot;:&quot;10%&quot;,&quot;behaviorScroll&quot;:&quot;fire-once&quot;}\"><div class=\"x-text-content\"><div class=\"x-text-content-text\"><div class=\"x-text-content-text-primary\"><p><strong>Q: How do I access the visual Grid editor?<\/strong><br \/>A: This is built into Cornerstone for our Pro Theme users, so if you have Pro you are good to go. You'll simply need to purchase <a href=\"#pricing\">Gridorama<\/a> for access to the training and templates. If you do NOT already own Pro, we have a <a href=\"#pricing\">special bundle<\/a> available that includes Gridorama + Pro for everything you need!<\/p><\/div>\n<\/div><\/div><\/div><\/div><\/div><div class=\"x-div e9-e243 m9-1k m9-1l m9-1o m9-1p m9-1q m9-1t m9-1u m9-1v m9-1w m9-1x m9-1y m9-21 m9-25 m9-26\"><div class=\"x-grid e9-e244 m9-3u m9-3w m9-3x m9-3y m9-3z is-guide-grid\"><div class=\"x-cell e9-e245 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e245 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e245 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e245 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e245 m9-44 m9-45 m9-47 m9-48\"><\/div><div class=\"x-cell e9-e245 m9-44 m9-45 m9-47 m9-48\"><\/div><\/div><\/div><\/section><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Purchase G r i d o r a m a Do you know what companies like Apple (tech), Netflix (streaming), Solana (crypto), and Twitch (gaming) all have in common? It&#8217;s not their near infinite web design budgets or the billions they sell through their websites. No, they are ALL forward thinking technology companies and they ALL use CSS Grid. And &#8230; <\/p>\n<div><a href=\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/\" class=\"more-link\">Read More<\/a><\/div>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-blank-6.php","meta":{"footnotes":""},"class_list":["post-9","page","type-page","status-publish","hentry","no-post-thumbnail"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Build Impossible Layouts with Gridorama<\/title>\n<meta name=\"description\" content=\"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Build Impossible Layouts with Gridorama\" \/>\n<meta property=\"og:description\" content=\"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/\" \/>\n<meta property=\"og:site_name\" content=\"Gridorama\" \/>\n<meta property=\"article:modified_time\" content=\"2026-03-19T13:57:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/02\/og-gridorama.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2400\" \/>\n\t<meta property=\"og:image:height\" content=\"1260\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"Build Impossible Layouts with Gridorama\" \/>\n<meta name=\"twitter:description\" content=\"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/02\/og-gridorama.png\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/\",\"url\":\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/\",\"name\":\"Build Impossible Layouts with Gridorama\",\"isPartOf\":{\"@id\":\"https:\/\/theme.co\/gridorama\/#website\"},\"datePublished\":\"2022-02-25T21:00:51+00:00\",\"dateModified\":\"2026-03-19T13:57:34+00:00\",\"description\":\"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.\",\"breadcrumb\":{\"@id\":\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/theme.co\/gridorama\/become-a-grid-master\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/theme.co\/gridorama\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Become A Grid Master\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/theme.co\/gridorama\/#website\",\"url\":\"https:\/\/theme.co\/gridorama\/\",\"name\":\"Gridorama\",\"description\":\"Just another Themeco Sites site\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/theme.co\/gridorama\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Build Impossible Layouts with Gridorama","description":"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/","og_locale":"en_US","og_type":"article","og_title":"Build Impossible Layouts with Gridorama","og_description":"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.","og_url":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/","og_site_name":"Gridorama","article_modified_time":"2026-03-19T13:57:34+00:00","og_image":[{"width":2400,"height":1260,"url":"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/02\/og-gridorama.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_title":"Build Impossible Layouts with Gridorama","twitter_description":"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.","twitter_image":"https:\/\/theme.co\/app\/uploads\/sites\/2\/2022\/02\/og-gridorama.png","twitter_misc":{"Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/","url":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/","name":"Build Impossible Layouts with Gridorama","isPartOf":{"@id":"https:\/\/theme.co\/gridorama\/#website"},"datePublished":"2022-02-25T21:00:51+00:00","dateModified":"2026-03-19T13:57:34+00:00","description":"Discover how CSS Grid, and our powerful visual Grid Editor, can help you build incredible websites that stand out from the crowd.","breadcrumb":{"@id":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/theme.co\/gridorama\/become-a-grid-master\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/theme.co\/gridorama\/become-a-grid-master\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/theme.co\/gridorama\/"},{"@type":"ListItem","position":2,"name":"Become A Grid Master"}]},{"@type":"WebSite","@id":"https:\/\/theme.co\/gridorama\/#website","url":"https:\/\/theme.co\/gridorama\/","name":"Gridorama","description":"Just another Themeco Sites site","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/theme.co\/gridorama\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/pages\/9","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/comments?post=9"}],"version-history":[{"count":42,"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/pages\/9\/revisions"}],"predecessor-version":[{"id":177,"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/pages\/9\/revisions\/177"}],"wp:attachment":[{"href":"https:\/\/theme.co\/gridorama\/wp-json\/wp\/v2\/media?parent=9"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}