Visual Research for LEE's Martial Arts:

Chosen design for reference (may go offline):
https://www.bradleysmith38.com/

https://webflow.com/blog/web-design-inspiration
-- https://cssnectar.com/ - use this one > category
-- https://www.siteinspire.com/ - use this one > styles
-- https://bestwebsite.gallery/
-- http://www.awwwards.com/

https://www.flux-academy.com/blog/the-best-websites-for-web-design-inspiration

=======================================================
CREATE FOLDERS:

10_visual_research_2hrs
11_site_structure_30mins
12_color_palette_20mins
13_sketches_2hrs
14_photo_image_collection_1hr
21_design_prototype
22_html_with_design_image
31_slicing
32_code_html_css
33_navigation_etc

=======================================================
PHOTOSHOP GUIDES
View > Guides > New Guide
View > Guides > Edit Selected Guide

VERTICAL GUIDES (provided)
0, 180, 193, 277 ... 1500, 1680

HORIZONTAL GUIDES (to created)
0, 50, 75, 275, 300, 500, 525, 700, 725, 900, 950, 1050

=======================================================
Color Code:

#2c2c2c			Dark Gray
#171717			Almost Black
#009dbc			Bright Blue
#8eac00			Olive Green
#e19501			Orange
#c55202			Red-Orange
#eaff0d			Neon Yellow

#fdfdfd			(gray) White (for text)

#f6ebeb			(gray) White (for logos)

=======================================================
SITE STRUCTURE

Lee's Martial Arts, Tennessee, USA

main sections:
- home 
- programs 
- schedule
	> calendar
- instructors
- locations
- contact us
	> about us
	> free class

image for shortcut 
1 about us 
	:: link to about us page
2 programs
	:: link to programs page
3 calendar
	:: link to calendar page
4 schedule
	:: link to schedule page
5 free class
	:: link to free class page

=======================================================
Photoshop Get Rid of Background - Quick
-	Select Layer
-	Properties panel > Quick Actions > Remove Background
Photoshop Get Rid of Background – Touch up
1.	Select Layer
2.	Select > Select And Mask
3.	View > Overlay (or B/W)
4.	Quick Selection tool OR Refine Edge Brush Tool
5.	“>” output setting
6.	Output Menu > New Layer with Layer Mask, click OK

=======================================================
Photoshop Fill Selection
= Edit > Fill

=======================================================
Photo merge group
= Select Group, Right Click > Merge Group"









========================================================
USE OUR UPDATED ONE WITH GUIDES

Bootstrap 5 GRID
https://www.behance.net/gallery/107572151/Bootstrap-5-Grid-Affinity-Designer#
(Need to add Grid to make it useful)

The template is 1690x1050px
It should work well for 1920 x 1080 screen resolutions 

Some free web templates for ideas:
https://thehotskills.com/free-bootstrap-5-templates/