Divi Template

BGCC Site Image Sizes

Location Example Min
W x H		 Max
W x H		 Example 1 Col Size Example 2 Col Size Example 3 Col Size Example 4 Col Size Format Size PSD Template Image Library Screenshot
Global Club Logo 300 x 77 600 x 155 300 x 77 N/A N/A N/A png < 25 kb Download N/A View
Home Main Slider BG 1425 x 800 1920 x 1080 1425 x 800 N/A N/A N/A jpg < 300 kb Download View View
Home Main Slider Graphic 300 x 300 1000 x 600 max 1000 x 600 max 470 x 560 N/A N/A png < 300 kb Download N/A View
Home Intro Section BG 1425 x 400 1920 x 540 1425 x 400 N/A N/A N/A jpg < 200 kb Download View View
Page Section BG 1425 x 800 1920 x 1080 1425 x 800 N/A N/A N/A jpg < 200 kb Download View View
Page Feature Image Banner 1425 x 400 1920 x 540 1425 x 400 N/A N/A N/A jpg < 200 kb Download View View
Page In-copy Image Banner 238 x any 1140 x any 1140 x any 538 x any 338 x any 238 x any jpg < 50 kb Download View View
Page National CTA Image 445 x 365 445 x 365 N/A 445 x 365 N/A N/A jpg < 50 kb Download View View
Page CTA Hover BG 238 x 250 1140 x 250 1140 x 250 538 x 250 338 x 250 238 x 250 jpg < 50 kb Download View View
Page CTA BG 238 x any 1140 x any 1140 x any 538 x any 338 x any 238 x any jpg < 50 kb Download View View
Page Sponsor Logo 238 x 119 600 x 300 600 x 300 600 x 300 338 x 169 238 x 119 png < 25 kb Download N/A View
Page Team Photo 300 x 300 300 x 300 300 x 300 300 x 300 300 x 300 300 x 300 jpg, png < 50 kb Download N/A View
Page Gallery Slider Image 600 x 400 1000 x 667 max 1000 x any max 1000 x any max 1000 x any max 1000 x any jpg, png < 100 kb Download N/A View
Page Gallery Grid Image 600 x 400 1000 x 667 max 1000 x any max 1000 x any max 1000 x any max 1000 x any jpg, png < 100 kb Download N/A View
Page In-copy image 238 x any 1140 x any 1140 x any 538 x any 338 x any 238 x any jpg, png, gif < 50 kb Download View View
Page Icon Graphics 238 x 238 350 x 350 350 x 350 350 x 350 350 x 350 250 x 250 png < 50 kb Download N/A View
Blog Feature Image 825 x 344 1920 x 800 1920 x 800 1425 x 594 N/A N/A jpg < 200 kb Download View View
Blog In-copy Image 848 x any 848 x any 848 x any 400 x any 251 x any 177 x any jpg, png < 100 kb Download View View
Events Feature Image 1000 x 667 1425 x 950 1000 x 667 N/A N/A N/A jpg < 100 kb Download View View
Events In-copy Image 1170 x any 1920 x any 1425 x any N/A N/A N/A jpg, png < 200 kb Download View View

Intro Title

Intro text requires the Text Module (settings > advanced > css class) to have the class “intro-txt”. Click here for example of usage.

Large Headers

<H1> – Curabitur blandit tempus porttitor. (40px, bold, navy)

<H2> – Curabitur blandit tempus porttitor. (40px, bold, navy)

Small Headers

<H3> – Curabitur blandit tempus porttitor. (34px, bold, green)

<H4> – Curabitur blandit tempus porttitor. (26px, semi, dark grey)

<H5> – Curabitur blandit tempus porttitor. (22px, semi, dark grey)

Body Texts

<P> <Strong> <Italic> – Curabitur blandit tempus porttitor. (16px, dark grey)

<P> <Italic> – Curabitur blandit tempus porttitor. (16px, dark grey)

<P> – Curabitur blandit tempus porttitor. (16px, dark grey)

<ul><li> Unordered List (16px)

  • Unordered list 1 – default green button and text
  • <span>Unordered list 2</span> – use <span> tag for dark grey text
  • Unordered list 3

<ol><li> Ordered list (16px)

  1. Ordered list 1 – default dark grey text
  2. Ordered list 2
  3. Ordered list 3

Colour Values

Primary

Orange – (HEX) #FBA519; // (RGB) rgba(251, 165, 25, 1)
Red – (HEX) #F0494A; // (RGB) rgba(240, 73, 74, 1)
Yellow – (HEX) #FBEE23; // (RGB) rgba(251, 238, 35, 1)
Teal – (HEX) #2EBCB4; // (RGB) rgba(46, 188, 180, 1)
Blue – (HEX) #00A4E3; // (RGB) rgba(0, 164, 227, 1)
Purple – (HEX) #5422C8; // (RGB) rgba(0, 164, 227, 1)
Green – (HEX) #7AC142; // (RGB) rgba(122, 193, 66, 1)
Navy – (HEX) #202656; // (RGB) rgba(32, 38, 86, 1)

Neutral

Black – (HEX) #000000; // (RGB) rgba(0, 0, 0, 1)
Night Rider – (HEX) #333333; // (RGB) rgba(51, 51, 51, 1)
Dim Grey – (HEX) #666666; // (RGB) rgba(102, 102, 102, 1)
Grey – (HEX) #888888; // (RGB) rgba(136, 136, 136, 1)
Dark Grey – (HEX) #AAAAAA; // (RGB) rgba(170, 170, 170, 1)
Gainsboro – (HEX) #DDDDDD; // (RGB) rgba(221, 221, 221, 1)
Whisper – (HEX) #EEEEEE; // (RGB) rgba(238, 238, 238, 1)

Custom Text Colour Classes

.txt-green – Green colour texts
.txt-blue – Blue colour texts
.txt-yellow – Yellow colour texts
.txt-teal – Teal colour texts
.txt-navy – Navy colour texts
.txt-purple – Purple colour texts
.txt-red – Red(Coral) colour texts
.txt-orange – Orange colour texts