customhtmlv1.html

<div class="welcome-banner" style="background-color: #337ab7;
        color: white;
        min-height: 70px;
        line-height: 70px;
        text-align: center;
        font-size: 58px;">WELCOME TO BC30</div>
<div class="welcome-logobox" style="text-align:center;
    border: 1px solid white;
    background-color: black;
    margin: 20px 0px 25px 0px;
	height: 335px;">
	<img style="height: 100%; padding: 0px 0px;" src="https://media.giphy.com/media/jovzBqFcpt4NISxaZh/giphy.gif"/>
	</div>
<div class="bg-info" style="padding: 0px 10px 10px 10px;">
    <div class="row" style="padding: 0px 5px 0px 5px;">
        <ul class="nav nav-tabs nav-justified">
            <li class="active">
                <a data-toggle="tab" href="#bc30item1" style="height: 70px;">ABOUT OUR<br/>MEMBERS</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item2" style="height: 70px;">JOIN US<br/>ON SLACK</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item3" style="height: 70px;">JOINING<br/>THE CLAN</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item4" style="height: 70px;">ACTIVE<br/>MEMBERSHIP</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item5" style="height: 70px;">CONTACT<br/>A MOD</a>
            </li>
        </ul>
    </div>

    <div class="tab-content" style="padding-top: 20px; padding-bottom: 20px;">
        <div id="bc30item1" class="tab-pane fade active in">
            <p>We are a group of friendly Destiny 2 players, mostly from Europe but many of our members are also from North America.</p>
			<p>Having fun, showing respect and helping each other are the core philosophies of BC30. You will find a mix of guardians in BC30, from the tryhard triumph hunters and Rivensbane warlocks, to the Iron Banner casual Titans.</p>
			<p>We post a mix of sessions with different requirements. Some are KWTD but never 10+ clears, and some open to all or sherpas. We have active raid and pvp members in our group, some dedicating themselves to Shax’s crucible, others to the latest raid triumphs and many in between.</p>
			<p>We play and talk about other games, sometimes together but the world of Destiny is what brings us together. Having a sense of humor and a good attitude are a must. Come play!</p>
        </div>
        <div id="bc30item2" class="tab-pane fade">
            <p><a href="https://app.slack.com/client/T1JN12TBQ/C5T1VAD88" target="_blank">SLACK</a> is where all of our communication happens. We don’t really use the 100 inbuilt chat system. Join the slack, say hello. A mod should welcome you and explain where all the different conversations happen. This is your next step after <a href="https://www.the100.io/g/556?r=94914" target="_blank">joining the 100 group</a>.</p>
        </div>
        <div id="bc30item3" class="tab-pane fade">
			<p>Anyone can join the 100 page and join public games. If you want to be part of our clan tag here is a simple guide of how to best integrate yourself:</p>
			<p>Step 1 - <a href="https://www.the100.io/g/556?r=94914" target="_blank">Join us on the 100</a></p>
			<p>Step 2 - <a href="https://app.slack.com/client/T1JN12TBQ/C5T1VAD88" target="_blank">Join our slack</a>, say hello, tell us a bit about yourself and your experience with Destiny.</p>
			<p>Step 3 - <a href="https://www.the100.io/groups/556/gaming_sessions" target="_blank">Join some games</a> and say hello in person. Post a game of your own if you want and tell us about it in the right channel on slack, but give  enough days for it to fill, especially in content light moments in Destiny.</p>
			<p>Step 4 - <a href="https://docs.google.com/forms/d/e/1FAIpQLSeBJtNRckVPqI2RbRv27kLXpyR6KNQMSa2lkNq5jiI2xDnFhQ/viewform" target="_blank">Join the waiting list</a> and when you're still enjoying playing with us after a month we'll bump you into our clan when there's space. Contact a mod and let us know your waiting and keen if we for whatever reason don’t respond.</p>
        </div>
        <div id="bc30item4" class="tab-pane fade">
            <p>You will be expected to be an active member of the clan. Remaining as a member in good standing requires playing Destiny with your fellow BC30 members on a regular basis and signing up for and creating sessions on the100. Members who have stopped playing or taking part in clan activities for more than five months (or two Destiny releases) may be removed from the clan (this will be checked via the100.io and Destiny API). Being removed from the clan doesn't mean you're banned and as soon as you start playing Destiny again you're welcome back in our clan when there's room. We just want to maintain a healthy playing population, rather than a static dwindling one.</p>
        </div>
        <div id="bc30item5" class="tab-pane fade">
            <p>If you want any further information or want to talk to a mod email us <a href="https://docs.google.com/forms/d/e/1FAIpQLSdhmrYhW7ZKRa1YA1nBUESKeIO50bT_K-gLgyAybSeWu_Ewag/viewform?c=0&w=1" target="_blank">HERE</a>.</p>
        </div>
	</div>
	
	<div class="row" style="padding: 0px 5px 0px 5px;">
        <ul class="nav nav-tabs nav-justified">
            <li class="active">
                <a data-toggle="tab" href="#bc30item6" style="height: 70px;">GAMING<br/>SESSIONS</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item7" style="height: 70px;">100<br/>TIPS</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item8" style="height: 70px;">BC30<br/>RESOURCE</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item9" style="height: 70px;">CROSS<br/>PLATFORM</a>
            </li>
            <li>
                <a data-toggle="tab" href="#bc30item10" style="height: 70px;">CLAN<br/>STATS</a>
            </li>
        </ul>
    </div>

    <div class="tab-content" style="padding-top: 20px; padding-bottom: 20px;">
        <div id="bc30item6" class="tab-pane fade active in">
			<p>Below is a list of our current games. Join one or post your own.</p>
			<div class='row'> <div class='col-md-12'> <div class='bg-info' style='font-weight: bold; background-color: black'> Current gamingsessions, times are in UTC <div style='font-size: x-small'>updated: 05/05 21:20</div></div> <div class='bg-info'> <table cellspacing='0' cellpadding='0' style='width:100%;padding:0;margin:0;'></table> </div> </div> </div> <br>
		</div>
        <div id="bc30item7" class="tab-pane fade">
            <p>
				<ul class="list-styled" style="list-style: disc;">
					<li>Don't be shy. Join or create a game session. You'll find that we are very easy going and there to help you.</li>
					<li>Be respectful to your team and group/clan members.</li>
					<li>Make sure your name on the100 is the same as your PSN gamertag. If not say so in the comments or better yet change it in your profile.</li>
					<li>Not sure about the mechanics? Request a sherpa.</li>
					<li>Most of us have jobs and families, So plan ahead and create your sessions a few days in advance at the least.</li>
					<li>Use the Details box to clearly describe what you want to do and expect.</li>
					<li>Having trouble filling up your session? If you've set it to Group Only why not consider to open it up to the rest of the100.</li>
					<li>Start sending PSN chat invites five minutes before game time.</li>
					<li>Need to leave a game? Hey, that’s ok, life happens. Please do let your group know as far in advance as possible so they can backfill.</li>
					<li>People leaving the game? Don't panic! check for reserves, post in 'Guardian Down' in <a href="https://app.slack.com/client/T1JN12TBQ/C5T1VAD88" target="_blank">SLACK</a> to let people know there is a space.</li>
					<li>Be ready for the game about five minutes before game time, (gear, bounties etc).</li>
					<li>On the reserve list? Don't leave just yet and wait for about ten minutes after game time. It takes some time to invite everyone and you just might get an invite being the fourth reserve.</li>
				</ul>
			</p>
        </div>
        <div id="bc30item8" class="tab-pane fade">
			<p>We have put together a pretty comprehensive <a href="https://docs.google.com/spreadsheets/d/1kK2ttc38Cv8_0wbJBrkj-z9e8jvhISYltYLKBkH7SMA/edit#gid=805866215" target="_blank">Destiny 2 resource document</a> for everyone to enjoy. You will find nightfall tips, raid guides, challenge information, pvp tips and a plethora of generally useful links to help navigate the rich content from Destiny 2. We welcome any input / collaboration to make this even better and up to date.</p>
        </div>
        <div id="bc30item9" class="tab-pane fade">
			<p>We primarily (99%) play on Ps4. However there is a growing PC population since cross save, so every so often a pc game might hit the 100 or organised between friends. If you are also playing on pc let us know.</p>
		</div>
        <div id="bc30item10" class="tab-pane fade">
            <p>Coming soon!</p>
        </div>
	</div>
</div>

customhtmlv2.html

<div class="welcome-banner" style="background-color: #337ab7;
        color: white;
        min-height: 70px;
        line-height: 70px;
        text-align: center;
        font-size: 58px;">WELCOME TO BC30</div>
<div class="welcome-logobox" style="text-align:center;
    border: 1px solid white;
    background-color: black;
    margin: 20px 0px 25px 0px;
	height: 335px;">
	<img style="height: 100%; padding: 0px 0px;" src="https://media.giphy.com/media/jovzBqFcpt4NISxaZh/giphy.gif"/>
	</div>
<div class="bg-info" style="padding: 0px 10px 10px 10px;">
    <div class="row" style="padding: 0px 5px 0px 5px;">
        <ul class="nav nav-tabs nav-justified">
            <li class="active">
                <a data-toggle="tab" href="#bc30item1" style="height: 70px;">ABOUT OUR<br/>MEMBERS</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item2" style="height: 70px;">JOIN US<br/>ON SLACK</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item3" style="height: 70px;">JOINING<br/>THE CLAN</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item4" style="height: 70px;">ACTIVE<br/>MEMBERSHIP</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item5" style="height: 70px;">CONTACT<br/>A MOD</a>
            </li>
        </ul>
    </div>

    <div class="tab-content" style="padding-top: 20px; padding-bottom: 20px;">
        <div id="bc30item1" class="tab-pane fade active in">
            <p>We are a group of friendly Destiny 2 players, mostly from Europe but many of our members are also from North America.</p>
			<p>Having fun, showing respect and helping each other are the core philosophies of BC30. You will find a mix of guardians in BC30, from the tryhard triumph hunters and Rivensbane warlocks, to the Iron Banner casual Titans.</p>
			<p>We post a mix of sessions with different requirements. Some are KWTD but never 10+ clears, and some open to all or sherpas. We have active raid and pvp members in our group, some dedicating themselves to Shax’s crucible, others to the latest raid triumphs and many in between.</p>
			<p>We play and talk about other games, sometimes together but the world of Destiny is what brings us together. Having a sense of humor and a good attitude are a must. Come play!</p>
        </div>
        <div id="bc30item2" class="tab-pane fade">
            <p><a href="https://app.slack.com/client/T1JN12TBQ/C5T1VAD88" target="_blank">SLACK</a> is where all of our communication happens. We don’t really use the 100 inbuilt chat system. Join the slack, say hello. A mod should welcome you and explain where all the different conversations happen. This is your next step after <a href="https://www.the100.io/g/556?r=94914" target="_blank">joining the 100 group</a>.</p>
        </div>
        <div id="bc30item3" class="tab-pane fade">
			<p>Anyone can join the 100 page and join public games. If you want to be part of our clan tag here is a simple guide of how to best integrate yourself:</p>
			<p>Step 1 - <a href="https://www.the100.io/g/556?r=94914" target="_blank">Join us on the 100</a></p>
			<p>Step 2 - <a href="https://app.slack.com/client/T1JN12TBQ/C5T1VAD88" target="_blank">Join our slack</a>, say hello, tell us a bit about yourself and your experience with Destiny.</p>
			<p>Step 3 - <a href="https://www.the100.io/groups/556/gaming_sessions" target="_blank">Join some games</a> and say hello in person. Post a game of your own if you want and tell us about it in the right channel on slack, but give  enough days for it to fill, especially in content light moments in Destiny.</p>
			<p>Step 4 - <a href="https://docs.google.com/forms/d/e/1FAIpQLSeBJtNRckVPqI2RbRv27kLXpyR6KNQMSa2lkNq5jiI2xDnFhQ/viewform" target="_blank">Join the waiting list</a> and when you're still enjoying playing with us after a month we'll bump you into our clan when there's space. Contact a mod and let us know your waiting and keen if we for whatever reason don’t respond.</p>
        </div>
        <div id="bc30item4" class="tab-pane fade">
            <p>You will be expected to be an active member of the clan. Remaining as a member in good standing requires playing Destiny with your fellow BC30 members on a regular basis and signing up for and creating sessions on the100. Members who have stopped playing or taking part in clan activities for more than five months (or two Destiny releases) may be removed from the clan (this will be checked via the100.io and Destiny API). Being removed from the clan doesn't mean you're banned and as soon as you start playing Destiny again you're welcome back in our clan when there's room. We just want to maintain a healthy playing population, rather than a static dwindling one.</p>
        </div>
        <div id="bc30item5" class="tab-pane fade">
            <p>If you want any further information or want to talk to a mod email us <a href="https://docs.google.com/forms/d/e/1FAIpQLSdhmrYhW7ZKRa1YA1nBUESKeIO50bT_K-gLgyAybSeWu_Ewag/viewform?c=0&w=1" target="_blank">HERE</a>.</p>
        </div>
	</div>
	
	<div class="row" style="padding: 0px 5px 0px 5px;">
        <ul class="nav nav-tabs nav-justified">
            <li class="active">
                <a data-toggle="tab" href="#bc30item6" style="height: 70px;">GAMING<br/>SESSIONS</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item7" style="height: 70px;">100<br/>TIPS</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item8" style="height: 70px;">BC30<br/>RESOURCE</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item9" style="height: 70px;">CROSS<br/>PLATFORM</a>
            </li>
            <li class='nav-item'>
                <a data-toggle="tab" href="#bc30item10" style="height: 70px;">CLAN<br/>STATS</a>
            </li>
        </ul>
    </div>

    <div class="tab-content" style="padding-top: 20px; padding-bottom: 20px;">
        <div id="bc30item6" class="tab-pane fade active in">
			<p>Below is a list of our current games. Join one or post your own.</p>
			<div class='row'> <div class='col-md-12'> <div class='bg-info' style='font-weight: bold; background-color: black'> Current gamingsessions, times are in UTC <div style='font-size: x-small'>updated: 05/05 21:20</div></div> <div class='bg-info'> <table cellspacing='0' cellpadding='0' style='width:100%;padding:0;margin:0;'></table> </div> </div> </div> <br>
		</div>
        <div id="bc30item7" class="tab-pane fade">
            <p>
				<ul class="list-styled" style="list-style: disc;">
					<li class='nav-item'>Don't be shy. Join or create a game session. You'll find that we are very easy going and there to help you.</li>
					<li class='nav-item'>Be respectful to your team and group/clan members.</li>
					<li class='nav-item'>Make sure your name on the100 is the same as your PSN gamertag. If not say so in the comments or better yet change it in your profile.</li>
					<li class='nav-item'>Not sure about the mechanics? Request a sherpa.</li>
					<li class='nav-item'>Most of us have jobs and families, So plan ahead and create your sessions a few days in advance at the least.</li>
					<li class='nav-item'>Use the Details box to clearly describe what you want to do and expect.</li>
					<li class='nav-item'>Having trouble filling up your session? If you've set it to Group Only why not consider to open it up to the rest of the100.</li>
					<li class='nav-item'>Start sending PSN chat invites five minutes before game time.</li>
					<li class='nav-item'>Need to leave a game? Hey, that’s ok, life happens. Please do let your group know as far in advance as possible so they can backfill.</li>
					<li class='nav-item'>People leaving the game? Don't panic! check for reserves, post in 'Guardian Down' in <a href="https://app.slack.com/client/T1JN12TBQ/C5T1VAD88" target="_blank">SLACK</a> to let people know there is a space.</li>
					<li class='nav-item'>Be ready for the game about five minutes before game time, (gear, bounties etc).</li>
					<li class='nav-item'>On the reserve list? Don't leave just yet and wait for about ten minutes after game time. It takes some time to invite everyone and you just might get an invite being the fourth reserve.</li>
				</ul>
			</p>
        </div>
        <div id="bc30item8" class="tab-pane fade">
			<p>We have put together a pretty comprehensive <a href="https://docs.google.com/spreadsheets/d/1kK2ttc38Cv8_0wbJBrkj-z9e8jvhISYltYLKBkH7SMA/edit#gid=805866215" target="_blank">Destiny 2 resource document</a> for everyone to enjoy. You will find nightfall tips, raid guides, challenge information, pvp tips and a plethora of generally useful links to help navigate the rich content from Destiny 2. We welcome any input / collaboration to make this even better and up to date.</p>
        </div>
        <div id="bc30item9" class="tab-pane fade">
			<p>We primarily (99%) play on Ps4. However there is a growing PC population since cross save, so every so often a pc game might hit the 100 or organised between friends. If you are also playing on pc let us know.</p>
		</div>
        <div id="bc30item10" class="tab-pane fade">
            <p>Coming soon!</p>
        </div>
	</div>
</div>