tuanphan

Did you solve or still need help?

Use this to Custom CSS box /* Homepage - Mobile - Slideshow */ @media screen and (max-width:767px) { body.homepage .gallery-fullscreen-slideshow { height: 30vh !important; } }

Can you share site url? We can check easier

If you share link to page where you have problem, we can help easier

I think you can add a Video Block, then we can try use CSS code to make it to background video

Hi, Can you share link to a blog post? We can check problem easier

Can you share link to gallery? We can check problem easier Hi, Center and appear when hovering or always appear?

#1. You mean you need to add Gallery Block on a standard page, not blog post? #2. I don't know this

#Style 15 First, you need to setup Grid to 3 columns Next use CSS code div#gridThumbs { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(̉̉60,minmax(0,0.2fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(1) { grid-column: ~"1 / 4" !important; grid-row: ~"1 / 3" !important; } a.grid-item:nth-child(2) { grid-column: ~"1 / 2" !important; grid-row: ~"3 / 6" !important; } a.grid-item:nth-child(3) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(4) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(5) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(6) { grid-column: ~"1 / 4" !important; grid-row: ~"6 / 8" !important; } a.grid-item:nth-child(7) { grid-column: ~"1 / 2" !important; grid-row: ~"8 / 11" !important; } a.grid-item:nth-child(8) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(9) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(10) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(11) { grid-column: ~"1 / 4" !important; grid-row: ~"11 / 13" !important; } a.grid-item:nth-child(12) { grid-column: ~"1 / 2" !important; grid-row: ~"13 / 16" !important; } a.grid-item:nth-child(13) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(14) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(15) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(16) { grid-column: ~"1 / 4" !important; grid-row: ~"16 / 18" !important; } a.grid-item:nth-child(17) { grid-column: ~"1 / 2" !important; grid-row: ~"18 / 21" !important; } a.grid-item:nth-child(18) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(19) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(20) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(21) { grid-column: ~"1 / 4" !important; grid-row: ~"21 / 23" !important; } a.grid-item:nth-child(22) { grid-column: ~"1 / 2" !important; grid-row: ~"23 / 26" !important; } a.grid-item:nth-child(23) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(24) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(25) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(26) { grid-column: ~"1 / 4" !important; grid-row: ~"26 / 28" !important; } a.grid-item:nth-child(27) { grid-column: ~"1 / 2" !important; grid-row: ~"28 / 31" !important; } a.grid-item:nth-child(28) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(29) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(30) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(31) { grid-column: ~"1 / 4" !important; grid-row: ~"31 / 33" !important; } a.grid-item:nth-child(32) { grid-column: ~"1 / 2" !important; grid-row: ~"33 / 36" !important; } a.grid-item:nth-child(33) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(34) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(35) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(36) { grid-column: ~"1 / 4" !important; grid-row: ~"36 / 38" !important; } a.grid-item:nth-child(37) { grid-column: ~"1 / 2" !important; grid-row: ~"38 / 41" !important; } a.grid-item:nth-child(38) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(39) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(40) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(41) { grid-column: ~"1 / 4" !important; grid-row: ~"41 / 43" !important; } a.grid-item:nth-child(42) { grid-column: ~"1 / 2" !important; grid-row: ~"43 / 46" !important; } a.grid-item:nth-child(43) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(44) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(45) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(46) { grid-column: ~"1 / 4" !important; grid-row: ~"46 / 48" !important; } a.grid-item:nth-child(47) { grid-column: ~"1 / 2" !important; grid-row: ~"48 / 51" !important; } a.grid-item:nth-child(48) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(49) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(50) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(51) { grid-column: ~"1 / 4" !important; grid-row: ~"51 / 53" !important; } a.grid-item:nth-child(52) { grid-column: ~"1 / 2" !important; grid-row: ~"53 / 56" !important; } a.grid-item:nth-child(53) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(54) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(55) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(56) { grid-column: ~"1 / 4" !important; grid-row: ~"56 / 58" !important; } a.grid-item:nth-child(57) { grid-column: ~"1 / 2" !important; grid-row: ~"58 / 61" !important; } a.grid-item:nth-child(58) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(59) { grid-column: ~"2 / 4" !important; } a.grid-item:nth-child(60) { grid-column: ~"2 / 4" !important; } #Style 16. First, you need to setup Grid to 4 columns, then use CSS code div#gridThumbs { grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-rows: repeat(36,minmax(0,0.2fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(5n+1) { grid-column: ~"1 / 3" !important; } a.grid-item:nth-child(5n+2) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(5n+4) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(5n) { grid-column: ~"1 / 5" !important; } #Style 17. First, you need to setup Grid to 2 columns, then use CSS code div#gridThumbs { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-rows: repeat(60,minmax(0,0.2fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(3) { grid-column: ~"1 / 3" !important; grid-row: ~"2 / 4" !important; } a.grid-item:nth-child(5) { grid-column: ~"2 / 3" !important; grid-row: ~"4 / 6" !important; } a.grid-item:nth-child(7) { grid-column: ~"1 / 3" !important; grid-row: ~"6 / 8" !important; } a.grid-item:nth-child(10) { grid-column: ~"1 / 3" !important; grid-row: ~"9 / 11" !important; } a.grid-item:nth-child(12) { grid-column: ~"2 / 3" !important; grid-row: ~"11 / 13" !important; } a.grid-item:nth-child(14) { grid-column: ~"1 / 3" !important; grid-row: ~"13 / 15" !important; } a.grid-item:nth-child(17) { grid-column: ~"1 / 3" !important; grid-row: ~"16 / 18" !important; } a.grid-item:nth-child(19) { grid-column: ~"2 / 3" !important; grid-row: ~"18 / 20" !important; } a.grid-item:nth-child(21) { grid-column: ~"1 / 3" !important; grid-row: ~"20 / 22" !important; } a.grid-item:nth-child(24) { grid-column: ~"1 / 3" !important; grid-row: ~"23 / 25" !important; } a.grid-item:nth-child(26) { grid-column: ~"2 / 3" !important; grid-row: ~"25 / 27" !important; } a.grid-item:nth-child(28) { grid-column: ~"1 / 3" !important; grid-row: ~"27 / 29" !important; } a.grid-item:nth-child(31) { grid-column: ~"1 / 3" !important; grid-row: ~"30 / 32" !important; } a.grid-item:nth-child(33) { grid-column: ~"2 / 3" !important; grid-row: ~"32 / 34" !important; } a.grid-item:nth-child(35) { grid-column: ~"1 / 3" !important; grid-row: ~"34 / 36" !important; } a.grid-item:nth-child(38) { grid-column: ~"1 / 3" !important; grid-row: ~"37 / 39" !important; } a.grid-item:nth-child(40) { grid-column: ~"2 / 3" !important; grid-row: ~"39 / 41" !important; } a.grid-item:nth-child(42) { grid-column: ~"1 / 3" !important; grid-row: ~"41 / 43" !important; } a.grid-item:nth-child(45) { grid-column: ~"1 / 3" !important; grid-row: ~"44 / 46" !important; } a.grid-item:nth-child(47) { grid-column: ~"2 / 3" !important; grid-row: ~"46 / 48" !important; } a.grid-item:nth-child(49) { grid-column: ~"1 / 3" !important; grid-row: ~"48 / 50" !important; } a.grid-item:nth-child(52) { grid-column: ~"1 / 3" !important; grid-row: ~"51 / 53" !important; } a.grid-item:nth-child(54) { grid-column: ~"2 / 3" !important; grid-row: ~"53 / 55" !important; } a.grid-item:nth-child(56) { grid-column: ~"1 / 3" !important; grid-row: ~"55 / 57" !important; } a.grid-item:nth-child(59) { grid-column: ~"1 / 3" !important; grid-row: ~"58 / 60" !important; } #Style 18. First you need to setup Grid to 3 columns, then use CSS code div#gridThumbs { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(36,minmax(0,0.5fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(4n+1) { grid-column: ~"1 / 3" !important; } a.grid-item:nth-child(2) { grid-column: ~"3 / 4" !important; grid-row: ~"1 / 3" !important; } a.grid-item:nth-child(6) { grid-column: ~"3 / 4" !important; grid-row: ~"3 / 5" !important; } a.grid-item:nth-child(10) { grid-column: ~"3 / 4" !important; grid-row: ~"5 / 7" !important; } a.grid-item:nth-child(14) { grid-column: ~"3 / 4" !important; grid-row: ~"7 / 9" !important; } a.grid-item:nth-child(18) { grid-column: ~"3 / 4" !important; grid-row: ~"9 / 11" !important; } a.grid-item:nth-child(22) { grid-column: ~"3 / 4" !important; grid-row: ~"11 / 13" !important; } a.grid-item:nth-child(26) { grid-column: ~"3 / 4" !important; grid-row: ~"13 / 15" !important; } a.grid-item:nth-child(30) { grid-column: ~"3 / 4" !important; grid-row: ~"15 / 17" !important; } a.grid-item:nth-child(34) { grid-column: ~"3 / 4" !important; grid-row: ~"17 / 19" !important; } a.grid-item:nth-child(38) { grid-column: ~"3 / 4" !important; grid-row: ~"19 / 21" !important; } a.grid-item:nth-child(42) { grid-column: ~"3 / 4" !important; grid-row: ~"21 / 23" !important; } a.grid-item:nth-child(46) { grid-column: ~"3 / 4" !important; grid-row: ~"23 / 25" !important; } a.grid-item:nth-child(50) { grid-column: ~"3 / 4" !important; grid-row: ~"25 / 27" !important; } a.grid-item:nth-child(54) { grid-column: ~"3 / 4" !important; grid-row: ~"27 / 29" !important; } a.grid-item:nth-child(58) { grid-column: ~"3 / 4" !important; grid-row: ~"29 / 31" !important; }

The site is private. Can you setup an access password? We can access easier https://forum.squarespace.com/topic/216243-how-to-setup-password-share-site-url/

Use this code to Design > Custom CSS or Website > Website Tools > Custom CSS /* Fluid Engine Stacked */ @media screen and (max-width:767px) { .fe-62f27edd36f56172b4650d13>div { grid-area: unset !important; display: block !important; width: 100% !important; margin-bottom: 20px; } .fe-62f27edd36f56172b4650d13 { display: block !important; padding-left: 6vw; padding-right: 6vw; } .fe-62f27edd36f56172b4650d13 .sqs-block-image .design-layout-fluid * { position: relative !important; } .fe-62f27edd36f56172b4650d13>div:not(:first-child) { width: 50% !important; float: left !important; } .fe-62f27edd36f56172b4650d13>div:nth-child(2n+4) { clear: left !important; } }

Hi, It is fine to me

Actually to make same spacing, we will need to use Code Block to recreate these buttons. If you want to test this, let me know, we will give the code

You can add this code to Page Settings > Advanced > Code Injection (page where you have problem) If you use Personal/Basic Plan, let me know which pages do you have problem, we can give another code <style> header#header img { filter: invert(1); -webkit-filter: invert(1); } </style>

Hi, We can't remove that bar. You can change its color by adding this to Design > Custom CSS (or Website > Website Tools > Custom CSS0 body { background-color: black; }

You try adding this to Design > Custom CSS or Website > Website Tools > Custom CSS /* resize portfolio on homepage */ @media screen and (max-width:767px) { .portfolio-hover[data-mode="hover-cover"] { min-height: unset !important; height: 30vh; } }

If you share link to page where you have problem + provide code, we can check easier

Use this code @media screen and (max-width:767px) { .lessons-item-related-item-list { display: grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; grid-gap: 10px !important; width: 100% !important; } }

#Style 8 . First you need to set Grid – Simple (or Grid – Overlay) to 4 columns Next use this CSS code (this code for 60 items, If you only have a few items, you can remove the unnecessary code. div#gridThumbs { grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-rows: repeat(10,minmax(0,0.3fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(1) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(2) { grid-column: ~"1 / 2" !important; grid-row: ~"2/4" } a.grid-item:nth-child(4) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(5) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(6) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(7) { grid-column: ~"1 / 2" !important; grid-row: ~"5/7"; } a.grid-item:nth-child(9) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(10) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(11) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(12) { grid-column: ~"1 / 2" !important; grid-row: ~"8/10" } a.grid-item:nth-child(14) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(15) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(16) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(17) { grid-column: ~"1 / 2" !important; grid-row: ~"11/13"; } a.grid-item:nth-child(19) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(20) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(21) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(22) { grid-column: ~"1 / 2" !important; grid-row: ~"14/16" } a.grid-item:nth-child(24) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(25) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(26) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(27) { grid-column: ~"1 / 2" !important; grid-row: ~"17/19"; } a.grid-item:nth-child(29) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(30) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(31) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(32) { grid-column: ~"1 / 2" !important; grid-row: ~"20/22" } a.grid-item:nth-child(34) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(35) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(36) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(37) { grid-column: ~"1 / 2" !important; grid-row: ~"23/25"; } a.grid-item:nth-child(39) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(40) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(41) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(42) { grid-column: ~"1 / 2" !important; grid-row: ~"26/28" } a.grid-item:nth-child(44) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(45) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(46) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(47) { grid-column: ~"1 / 2" !important; grid-row: ~"29/31"; } a.grid-item:nth-child(49) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(50) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(51) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(52) { grid-column: ~"1 / 2" !important; grid-row: ~"32/34" } a.grid-item:nth-child(54) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(55) { grid-column: ~"2 / 5" !important; } a.grid-item:nth-child(56) { grid-column: ~"1 / 5" !important; } a.grid-item:nth-child(57) { grid-column: ~"1 / 2" !important; grid-row: ~"35/37"; } a.grid-item:nth-child(59) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(60) { grid-column: ~"2 / 5" !important; } #Style 9. Change to 4 columns, then use this CSS a.grid-item:nth-child(7n - 6), a.grid-item:nth-child(7n - 4) { grid-column: ~"1 / 3" !important; } a.grid-item:nth-child(7n - 5) { grid-column: ~"3 / 5" !important; } a.grid-item:nth-child(7n-1) { grid-column: ~"1 / 4" !important; } div#gridThumbs { grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-rows: repeat(12,minmax(0,0.5fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } #Style 10. Change to 3 columns, then use this CSS a.grid-item:nth-child(4n - 3) { grid-column: ~"1 / 4" !important; } div#gridThumbs { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(10,minmax(0,0.3fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } #Style 11. Change to 3 columns then use this CSS /* Portfolio 11 */ a.grid-item:nth-child(4n) { grid-column: ~"1 / 4" !important; } div#gridThumbs { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(10,minmax(0,0.3fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } #Style 12. Change to 3 columns then use this CSS code a.grid-item:nth-child(7n - 6) { grid-column: ~"1 / 4" !important; } div#gridThumbs { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(10,minmax(0,0.3fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } #Style 13 Change to 9 columns then use this CSS div#gridThumbs { grid-template-columns: repeat(9,minmax(0,1fr)); grid-template-rows: repeat(10,minmax(0,0.5fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(6n - 5) { grid-column: ~"1 / 4" !important; } a.grid-item:nth-child(6n - 4) { grid-column: ~"4 / 7" !important; } a.grid-item:nth-child(6n - 3) { grid-column: ~"7 / 10" !important; } a.grid-item:nth-child(6n - 2) { grid-column: ~"1 / 2" !important; } a.grid-item:nth-child(6n - 1) { grid-column: ~"2 / 9" !important; } a.grid-item:nth-child(6n) { grid-column: ~"9 / 10" !important; } #Style 14 Change to 3 columns then use this CSS code div#gridThumbs { grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-rows: repeat(10,minmax(0,0.3fr)) !important; } .portfolio-grid-overlay .grid-item { padding-bottom: 0 !important; height: 100%; } .portfolio-grid-overlay .grid-item .grid-image { position: static; } a.grid-item:nth-child(1) { grid-column: ~"1 / 3" !important; grid-row: ~"1 / 3" !important; } a.grid-item:nth-child(4) { grid-column: ~"1 / 2" !important; grid-row: ~"3 / 5" !important; } a.grid-item:nth-child(5) { grid-column: ~"2 / 3" !important; grid-row: ~"3 / 5" !important; } a.grid-item:nth-child(8) { grid-column: ~"1 / 3" !important; grid-row: ~"5 / 7" !important; } a.grid-item:nth-child(11) { grid-column: ~"1 / 2" !important; grid-row: ~"7 / 9" !important; } a.grid-item:nth-child(12) { grid-column: ~"2 / 3" !important; grid-row: ~"7 / 9" !important; } a.grid-item:nth-child(15) { grid-column: ~"1 / 3" !important; grid-row: ~"9 / 11" !important; } a.grid-item:nth-child(18) { grid-column: ~"1 / 2" !important; grid-row: ~"11 / 13" !important; } a.grid-item:nth-child(19) { grid-column: ~"2 / 3" !important; grid-row: ~"11 / 13" !important; } a.grid-item:nth-child(22) { grid-column: ~"1 / 3" !important; grid-row: ~"13 / 15" !important; } a.grid-item:nth-child(25) { grid-column: ~"1 / 2" !important; grid-row: ~"15 / 17" !important; } a.grid-item:nth-child(26) { grid-column: ~"2 / 3" !important; grid-row: ~"15 / 17" !important; } a.grid-item:nth-child(29) { grid-column: ~"1 / 3" !important; grid-row: ~"17 / 19" !important; } a.grid-item:nth-child(32) { grid-column: ~"1 / 2" !important; grid-row: ~"19 / 21" !important; } a.grid-item:nth-child(33) { grid-column: ~"2 / 3" !important; grid-row: ~"19 / 21" !important; } a.grid-item:nth-child(36) { grid-column: ~"1 / 3" !important; grid-row: ~"21 / 23" !important; } a.grid-item:nth-child(39) { grid-column: ~"1 / 2" !important; grid-row: ~"23 / 25" !important; } a.grid-item:nth-child(40) { grid-column: ~"2 / 3" !important; grid-row: ~"23 / 25" !important; } a.grid-item:nth-child(43) { grid-column: ~"1 / 3" !important; grid-row: ~"25 / 27" !important; } a.grid-item:nth-child(46) { grid-column: ~"1 / 2" !important; grid-row: ~"27 / 29" !important; } a.grid-item:nth-child(47) { grid-column: ~"2 / 3" !important; grid-row: ~"27 / 29" !important; } a.grid-item:nth-child(50) { grid-column: ~"1 / 3" !important; grid-row: ~"29 / 31" !important; } a.grid-item:nth-child(53) { grid-column: ~"1 / 2" !important; grid-row: ~"31 / 33" !important; } a.grid-item:nth-child(54) { grid-column: ~"2 / 3" !important; grid-row: ~"31 / 33" !important; } a.grid-item:nth-child(57) { grid-column: ~"1 / 3" !important; grid-row: ~"33 / 35" !important; } a.grid-item:nth-child(60) { grid-column: ~"1 / 2" !important; grid-row: ~"35 / 37" !important; }

You can add this to Design > Custom CSS or Website > Website Tools > Custom CSS /* Gallery title */ .image-slide-title { font-size: 30px !important; }

You are using new editor so you can edit page > click Mobile icon on top right > Adjust layout on mobile. This won't affect desktop. Detail: https://support.squarespace.com/hc/en-us/articles/6421525446541-Editing-your-site-with-Fluid-Engine In case you want to use code, you can add this to Design > Custom CSS or Website > Website Tools > Custom CSS /* align center mobile */ @media screen and (max-width:767px) { .fe-block-c461e9d41998d39cd274, .fe-block-yui_3_17_2_1_1689673570648_14702, .fe-block-bb9e1c1efb0bb85774d5, .fe-block-yui_3_17_2_1_1689673570648_15770, .fe-block-aad12378b9fee3d67686, .fe-block-yui_3_17_2_1_1689673570648_17334, .fe-block-6af2c16f4426d9fb474c, .fe-block-yui_3_17_2_1_1689673570648_19313, .fe-block-c6453da0cd513dcec53d, .fe-block-yui_3_17_2_1_1689673570648_20380 { grid-column-start: 3 !important; grid-column-end: 9 !important; }}

Hi, Like this?

You can add this to Design > Custom CSS or Website > Website Tools > Custom CSS div#mobileNav, #mobileMenuLink { background-color: #191C1C; }

Can you share link to this page? We can help easier

Yes. This is possible. You can see a video here https://www.loom.com/share/76674f9338104e84854bd5c16926057f My approach is you can add 3 text links to top Then add 3 sections under then share link to page where you added it, I will use code to make show - hide when clicking on these text links