Text

<p class="large" style="white-space:pre-line;text-align:center"><strong>Thank You for Being Part of the <span style="color:#fd0201">CNYS Black Expo</span> 6th Anniversary Celebration</strong></p>
<h1 style="white-space:pre-line;text-align:center"><strong><em>6 Years of</em></strong></h1>

Embed

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Dynamically Changing Title Slider</title>

<style>
/*This is the body background colour and is non-essential to functionality*/
body{
background: #3b3d3d;
}

/*This is the dynamic h1 class where all the changes are controlled from*/
.changingtext::before{
content: "Impact";
display: block;
position: relative;
color: #FF0000;
text-align: center;
font-family: 'Avenir Next', 'Roboto', sans-serif;
font-size: 5vw;
line-height: 1;
letter-spacing: -0.02em;
font-weight: 800;
animation-name: mychangea;
animation-duration: 8s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}

/*These are the keyframes that change the titles in the dynamic h1; I've created a sequence with varying opacities to produce a smoother transition between titles - feel free to further tweak these to your preference*/
@keyframes mychangea{
0% {content: "Impact"; opacity: 0.58;}
10% {content: "Impact"; opacity: 1;}
19% {content: "Impact"; opacity: 0;}
20% {content: "Community"; opacity: 0;}
30% {content: "Community"; opacity: 1;}
39% {content: "Community"; opacity: 0;}
40% {content: "Connection"; opacity: 0;}
50% {content: "Connection"; opacity: 1;}
59% {content: "Connection"; opacity: 0;}
60% {content: "Resilience"; opacity: 0;}
70% {content: "Resilience"; opacity: 1;}
79% {content: "Resilience"; opacity: 0;}
80% {content: "Opportunity"; opacity: 0;}
90% {content: "Opportunity"; opacity: 1;}
99% {content: "Opportunity"; opacity: 0;}
100% {content: "Impact"; opacity: 0;}
}
</style>
</head>



<body>
<div class="homepagebox">
<h1 class="changingtext"></h1>
</div>
</body>
</html>

Call to action

Gallery

Text + image

<h3 style="white-space:pre-line">Networking Opportunities</h3>
<p>The CNYS Black Expo is the perfect opportunity to network with members of the Black community. With a network of businesses, community partners, volunteers, and sponsors, you’ll be able to meet and mingle with people from all walks of life. Whether you’re looking to start a business, find a job, or just learn more about the culture, you’ll find something at the CNYS Black Expo. Plus, you’ll be able to exchange ideas and build connections that can last a lifetime.</p>

<h3 style="white-space:pre-line"><span style="color:#ff0000">Six Years</span> With Us</h3>
<p>This November marks the sixth anniversary of the CNYS Black Expo. We’re proud to have been able to bring together members of the Black community for five years and we’re looking forward to many more. Join us this November to celebrate six years of the CNYS Black Expo and all that it has to offer.</p>

6 Years of

Networking Opportunities

Six Years With Us