<!DOCTYPE html>
<html>
<head>
<title>Flying Toucans Marching Band</title>
<link rel="icon" type="image/ico" href="favicon.ico" />
<link href='http://fonts.googleapis.com/css?family=Merienda+One' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Berkshire+Swash' rel='stylesheet' type='text/css'>
<style>
/* Style the header: https://designshack.net/articles/css/the-10-best-script-and-handwritten-google-web-fonts/ */
.header {
font: 100 20px 'Merienda One', Helvetica, sans-serif;
color: #ff3300;
text-align: center;
padding-top: 10px;
padding-bottom: 10px;
margin-top: 10px;
margin-bottom: 10px;
height: 100px;
width: 90%;
}
/* The navbar container */
.topnav {
height: 60px;
width: 90%;
text-align: center;
margin-left: 150px;
margin-top: 5px;
margin-bottom: 25px;
padding-top: 10px;
font-size: 24px;
font-weight: bold;
}
/* Navbar links */
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 8px 10px;
text-decoration: none;
}
/* Links - change color on hover */
.topnav a:hover {
background-color: GoldenRod ;
color: Maroon;
}
@media only screen and (max-width: 720px) {
h2 {
font: 100 16px 'Berkshire Swash', Helvetica, sans-serif;
color: #f2f2f2;
margin-left: 50px;
margin-top: 25px;
margin-bottom: 25px;
padding-top: 10px;
padding-bottom: 5px;
}
h4 {
text-align: justify;
font-size: 12px;
color: #ffff00;
margin-left: 50px; margin-right: 50px;
margin-bottom: 10px; margin-top: 10px;
}
h6 {
text-align: center;
font-size: 12px;
color: #ffcc00;
margin-top:50px; margin-bottom:20px;
}
}
@media only screen and (min-width: 720px) {
h2 {
font: 100 20px 'Berkshire Swash', Helvetica, sans-serif;
color: #f2f2f2;
margin-left: 100px;
margin-top: 20px;
margin-bottom: 20px;
padding-top: 10px;
padding-bottom: 5px;
}
h4 {
text-align: justify;
font-size: 18px;
color: #ffff00;
width: 85%;
margin-left: 100px; margin-right: 50px;
margin-right: 10px; margin-bottom: 10px;
}
h6 {
text-align: center;
font-size: 12px;
color: #ffcc00;
margin-top:50px;
margin-bottom:20px;
}
}
</style>
</head>
<body style="background-image:url('images/actual wallpaper.jpg'); background-repeat: no-repeat; background-size: cover;
background-position: 0% 0%; background-color: ##0000cc;">
<div class="header">
<img src="images/dasd_logo.jpg"
alt="https://s3.amazonaws.com/bandlogos.ussba.trigonroad.com/E85A6363-EEBF-0C55-B9917F951370BE04.jpg"
style="float:left; margin-bottom:20px; height: 160px; width: 120px; object-fit: contain;"
>
<h1> Flying Toucans Marching Band</h1>
</div>
<div class="topnav">
<a href="index.html">HOME</a>
<a href="gallery.html">GALLERY</a>
<a href="videos.html">VIDEOS</a>
<a href="audios.html">AUDIO TRACKS</a>
<a href="booking.html">EVENT BOOKING</a>
<a href="blog.html">BLOG</a>
<a href="contacts.html">CONTACTS</a>
<a href="about.html">ABOUT</a>
</div>
<center>
<img src="images/TocoToucan.png" style="width: 20%; padding-right: 25px; display: block; margin:auto" >
</center>
<h4> Welcome to the Flying Toucans Marching Band homepage, where you can enjoy the samples of previous performance videos, audio tracks and image gallery. The Flying Toucans Marching Band Group has been performing award winning shows for over a decade. Our group has nearly 100 members and our director, Ducky Toms, has been constantly perfecting our shows. Some of our award winning shows were Walking Giants, Away from Home, Jazzy Space, and The Homecoming Queen.
This year, our show will be Night with China featuring popular Chinese Songs. We do compete, so please help us by attending our amazing show. We are humble for our awards and donate a tenth of our money to charities. Hope you will enjoy our show this year. </h4>
<h2>Sample Videos</h2>
<center>
<iframe style="margin-right:50px; margin-bottom:10px;"
src="https://www.youtube.com/embed/YiWT4oiyiJQ" frameborder="0" allowfullscreen=""></iframe>
<iframe style="margin-right:50px; margin-bottom:10px;"
src="https://www.youtube.com/embed/vbWywm4u92s" frameborder="0" allowfullscreen=""></iframe>
<iframe style="margin-right:50px; margin-bottom:10px;"
src="https://www.youtube.com/embed/VgFmlcavoJc" frameborder="0" allowfullscreen=""></iframe>
</center>
<h2>Sample Audio Tracks</h2>
<center>
<audio style="margin-right:50px; margin-bottom:10px;" controls="controls">
<source src="audio/FireFliesCloser.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
<audio style="margin-right:50px; margin-bottom:10px;" controls="controls">
<source src="audio/HideAndSeekBallad.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
<audio style="margin-right:50px; margin-bottom:10px;" controls="controls">
<source src="audio/FireFliesOpener.mp3" type="audio/mp3">
Your browser does not support the audio element.
</audio>
</center>
<center>
<h6> Copyright © 2019 https://flyingtoucans.github.io </h6>
</center>
</body>