FONT: lATO
AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQq
FONT: MONTSERRAT
AaBbCcDdEeFfGgHhIiJj
TYPEKIT
Copy the code below, and paste it into the pages on *.afs.org where the fonts and settings for your AFS App Portal kit will be used. Make sure it goes near the top of the <head> tag. If you’re using a plugin or service that asks for a Typekit Kit ID, use this: yxq4shs
<link rel="stylesheet" href="https://use.typekit.net/yxq4shs.css">
GOOGLE FONTS
1. Embed: To embed these fonts into a webpage, copy this code into the <head> of your HTML document.
<link href="https://fonts.googleapis.com/css?family=Lato|Montserrat" rel="stylesheet">
2. Specify in CSS: Use the following CSS properties to specify these families:
font-family: 'Lato', sans-serif; font-family: 'Montserrat', sans-serif;
COLOR PALETTE
BLUE CMYK: 100/43/0/0 RGB: 0/122/194 HEX: #007AC2
BRIGHT BLUE CMYK: 100/0/0/0 RGB: 0/174/239 HEX: #00AEEF
PINK CMYK: 0/100/50/0 RGB: 237/20/91 HEX: #ED145B
VIOLET CMYK: 50/100/0/0 RGB: 146/39/143 HEX: #92278F
ANCHORS
Aliquam blandit et odio ut porttitor. Aenean a ipsum maximus dui scelerisque dictum. Sed tristique gravida dui, vel rutrum enim lacinia in. Pellentesque consectetur est urna, a venenatis nibh pretium a. Nullam est lacus, molestie id rutrum ultrices, tincidunt ac leo. Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam.
BUTTONS (3X Border radius)
EMBEDS
Hedalines
H1: Headline one and become a leader
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
H2: Headline two and become a leader in today’s fast-paced, global world
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
H3: Headline three, go abroad with AFS and become a leader in today’s fast-paced, global world
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
H4: Headline four go abroad with AFS and become a leader in today’s fast-paced, global world
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
H5: Headline five and go abroad with AFS and become a leader in today’s fast-paced, global world
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
H6: HEADLINE SIX GO ABROAD WITH AFS AND BECOME A LEADER IN TODAY’S FAST-PACED, GLOBAL WORLD
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
LISTS
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
- Lorem ipsum dolor sit amet
- Aliquam eu elit in mi sagittis lacini
- Nam id odio nec dolor
- Mauris sit amet odio a nisl venenatis consectetur
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla quis purus nec magna fringilla bibendum eu vitae enim.
- Lorem ipsum dolor sit amet
- Aliquam eu elit in mi sagittis lacini
- Nam id odio nec dolor
- Mauris sit amet odio a nisl venenatis consectetur
FANCY LISTS
Sequential lists can be applied to any list element (OL, UL, DL)
- Lorem ipsum dolor sit amet
- Aliquam eu elit in mi sagittis lacini Mauris sit amet odio a nisl venenatis consectetur Mauris sit amet odio a nisl venenatis consectetur Mauris sit amet odio a nisl venenatis consectetur
- Nam id odio nec dolor
- Mauris sit amet odio a nisl venenatis consectetur
PARAGRAPHS WITH DROP CAP
Sorem ipsum dolor sit amet, consectetur adipiscing elit. Cras volutpat, est sodales venenatis accumsan, turpis elit bibendum enim, eu pellentesque ligula augue nec risus. Aliquam blandit et odio ut porttitor. Aenean a ipsum maximus dui scelerisque dictum. Sed tristique gravida dui, vel rutrum enim lacinia in. Pellentesque consectetur est urna, a venenatis nibh pretium a. Nullam est lacus, molestie id rutrum ultrices, tincidunt ac leo. Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra. Suspendisse dapibus mi eu velit sagittis, sit amet hendrerit nibh pretium. Curabitur sed facilisis ante.
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra. Suspendisse dapibus mi eu velit sagittis, sit amet hendrerit nibh pretium. Curabitur sed facilisis ante.
MEDIA
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi sagittis lacinia. Nam id odio nec dolor cursus vulputate nec in urna. posuere vel mauris et aliquam. Ut feugiat non tellus at faucibus. Mauris sit amet odio a nisl venenatis consectetur vel ut lorem.

Aliquam blandit et odio ut porttitor. Aenean a ipsum maximus dui scelerisque dictum. Sed tristique gravida dui, vel rutrum enim lacinia in. Pellentesque consectetur est urna, a venenatis nibh pretium a. Nullam est lacus, molestie id rutrum ultrices, tincidunt ac leo. Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
Dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra. velit sagittis, sit amet hendrerit nibh pretium. Curabitur sed facilisis ante. Duis consequat velit diam.
Aliquam blandit et odio ut porttitor. Aenean a ipsum maximus dui scelerisque dictum. Sed tristique gravida dui, vel rutrum enim lacinia in. Pellentesque consectetur est urna, a venenatis nibh pretium a. Nullam est lacus, molestie id rutrum ultrices, tincidunt ac leo. Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra. velit sagittis, sit amet hendrerit nibh pretium. Curabitur sed facilisis ante. Duis consequat velit diam.
QUOTES
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra.
“I have definitely taken with me, a piece of their land, their culture and their love. I intend to become an AFS volunteer to help out other students from all around the world.”
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi sagittis lacinia. Nam id odio nec dolor cursus vulputate nec in urna. posuere vel mauris et aliquam. Ut feugiat non tellus at faucibus. Mauris sit amet odio a nisl venenatis consectetur vel ut lorem.
“I intend to become an AFS volunteer to help out other students from all around the world. I hope that other worthy Australians will be able to.”SAMUEL ESTOK
TABLES
Table Heading One | Table Heading Two | Table Heading Three |
---|---|---|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi. |
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi. | Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam eu elit in mi. |
Morbi consequat tempor est. Nullam rutrum sem ut gravida aliquam. Aenean pharetra dolor non sapien mollis rhoncus. In hac habitasse platea dictumst. Etiam ullamcorper eget est vitae dictum. Integer consectetur sed enim et viverra. Suspendisse dapibus mi eu velit sagittis, sit amet hendrerit nibh pretium. Curabitur sed facilisis ante.