<meta charsets="utf-8"/>
<meta name="author" content="Henry Letellier"/><html>
<head>
<meta charsets="utf-8"/>
<meta name="author" content="Henry Letellier"/>
</head>
<body>
<article id="article">
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
<p>bla bla bla bla bla bla bla bla bla</p>
</article>
<aside id="asideFollow" style="display:block;">
<table id="tableFollow">
<tr id="trFollow">
<td id="tdFollowYoutube">
<youtube><a class="link" id="youtubeLink" href="http://bit.ly/34iZAK9" title="Follow me on Youtube" alt="Follow me on Youtube" target="_blank" rel="noreferrer" rel="noopener"><img id="youtubeImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/yt/youtube.svg"/></a></youtube>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowBehance">
<behance><a class="link" id="behanceLink" href="https://bit.ly/3aR79eo" title="Follow me on Behance" alt="Follow me on Behance" target="_blank" rel="noreferrer" rel="noopener"><img id="behanceImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/Glyphicons/Behance/behance.svg"/></a></behance>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowPatreon">
<patreon><a class="link" id="patreonLink" href="http://bit.ly/2M5ipu3" title="Follow me on Patreon" alt="Follow me on Patreon" target="_blank" rel="noreferrer" rel="noopener"><img id="patreonImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/patreon/patreon.svg"/></a></patreon>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowFacebook">
<facebook><a class="link" id="facebookLink" href="http://bit.ly/2EieENH" title="Follow me on Facebook" alt="Follow me on Facebook" target="_blank" rel="noreferrer" rel="noopener"><img id="facebookImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/facebook/facebook.svg"/></a></facebook>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowInstagram">
<Instagram><a class="link" id="instagramLink" href="http://bit.ly/2PRGBkG" title="Follow me on Instagram" alt="Follow me on Instagram" target="_blank" rel="noreferrer" rel="noopener"><img id="instagramImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/Instagram/instagram.svg"/></a></Instagram>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowCodepen">
<codepen><a class="link" id="codepenLink" href="https://bit.ly/35h8rOH" title="Follow me on CodePen" alt="Follow me on CodePen" target="_blank" rel="noreferrer" rel="noopener"><img id="codepenImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/codepen/codepen.svg"/></a></codepen>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowDev">
<dev><a class="link" id="devLink" href="https://bit.ly/3dduRmT" title="Follow me on Dev" alt="Follow me on Dev" target="_blank" rel="noreferrer" rel="noopener"><img id="devImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/dev-to/dev-to.svg"/></a></dev>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowRepl">
<repl><a class="link" id="replLink" href="http://bit.ly/2PyDqQd" title="Follow me on repl" alt="Follow me on repl" target="_blank" rel="noreferrer" rel="noopener"><img id="replImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/repl.it/favicon.svg"/></a></repl>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowDiscord">
<discord><a class="link" id="discordLink" href="https://bit.ly/3bWrGzK" title="Follow me on Discord, tell me what you think aout this page" alt="Follow me on Discord, tell me what you think aout this page" target="_blank" rel="noreferrer" rel="noopener"><img id="discordImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/discord/discord.svg"/></a><span class="hidden" id="DS" onclick="ds()">...</span></discord>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowIn">
<in><a class="link" id="linkedinLink" href="https://bit.ly/2WniPjI" title="Follow me on Patreon" alt="Follow me on Patreon" target="_blank" rel="noreferrer" rel="noopener"><img id="inImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/linkedin/linkedin.svg"/></a></linkedin>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowViadeo">
<Viadeo><a class="link" id="viadeoLink" href="https://bit.ly/3aBXhFm" title="Follow me on Viadeo" alt="Follow me on Viadeo" target="_blank" rel="noreferrer" rel="noopener"><img id="viadeoImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/viadeo/Viadeo.svg"/></a></Viadeo>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowMyWeb">
<myweb><a class="link" id="myWebLink" href="comming soon" title="Follow me on Comming soon" alt="Follow me on Comming soon" target="_blank" rel="noreferrer" rel="noopener"><img id="myWebImg" src="Comming logo(brand), on hover active page logo logo"/></a><span id="un()" id="UN">...</span></myweb>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowGit">
<git id="git"><a class="link" id="githubLink" href="https://bit.ly/2YcQ4ce" title="Follow me on Github" alt="Follow me on Github" target="_blank" rel="noreferrer" rel="noopener"><img id="gitImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/github/github.svg"/></a></git>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowSteam">
<steam id="steam"><a class="link" id="steamLink" href="https://bit.ly/2zBtO1u" title="Follow me on Steam" alt="Follow me on Steam" target="_blank" rel="noreferrer" rel="noopener"><img id="steamImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/steam/steam.svg"/><img src=""/></a></steam>
</td>
</tr>
<tr id="trFollow">
<td id="tdFollowSuperProf">
<steam id="Super"><a class="link" id="superLink" href="https://bit.ly/2VZRMwe" title="Follow me on Superprof" alt="Follow me on Superprof" target="_blank" rel="noreferrer" rel="noopener"><img id="SuperImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/superprof/superprof-icone-noire.svg"/><img src=""/></a></steam>
</td>
</tr>
<!-- <tr id="trFollow">
<td id="tdFollowBoostEtudes">
<boostetudes id="boostEtudes"><a class="link" id="boostLink" href="http://boostetudes.fr/" title="Follow me on BoostEtudes" alt="Follow me on BoostEtudes" target="_blank" rel="noreferrer" rel="noopener"><img id="boostEtudesImg" src="https://raw.githubusercontent.com/HenraL/Follow-me/master/follow-me/img/boost_etudes/cropped-Boost-etudes.svg"/><!--<img src=""/>--><!--</a></boostetudes>
</td>
</tr> -->
<tr id="trfollow">
<td id="tdfollowCopSmall">
<p id="copSmall"><cop>©Créé par Henry Letellier</cop></p>
</td>
</tr>
</aside>
<p><cop>©Créé par Henry Letellier</cop></p>
</body>
</html>
<!-- https://s3-us-west-2.amazonaws.com/s.cdpn.io/131045/404.png -->
/*Assining article properties*/
#article{
margin-left:600px;
padding:50px;
}
/*Assining properties to the aside beacon*/
#asideFollow{
position:fixed;
bottom: 0px;
display:block;
float:left;
border:none 0px;
display: inline-block;
margin-left:20px;
}
/*Defining table Follow properties*/
#tableFollow{
border: none, 0px;
margin-left:0px;
box-sizing: border-box;
margin-inline-start: 0px;
margin-inline-end: 0px;
display: inline-block;
text-align:left;
border-collapse:collapse;
width:67px;
height:170px;
text-overflow: hidden;
overflow: scroll;
}
/*Definning trFollow cells*/
#trFollow{
background-color:white;
cell-width:5px;
cell-height:5px;
}
/*Defining tdFollow cells*/
#tdFollowYoutube, #tdFollowBehance, #tdFollowPatreon, #tdFollowFacebook, #tdFollowInstagram, #tdFollowCodepen, #tdFollowDev, #tdFollowRepl, #tdFollowDiscord, #tdFollowIn, #tdFollowViadeo, #tdFollowMyWeb, #tdFollowGit, #tdFollowSteam, #tdfollowCopSmall, #tdFollowSuperProf, #tdFollowBoostEtudes{
width:37px;
height:37px;
margin-right:0px;
margin-lef:0px;
}
/*Defining individual tdFollow... cells*/
#tdFollowYoutube{background-color:blue;}
#tdFollowBehance{background-color:royalblue;}
#tdFollowPatreon{background-color:limegreen;}
#tdFollowFacebook{background-color:red;}
#tdFollowInstagram{background-color:purple;}
#tdFollowCodepen{background-color:coral;}
#tdFollowDev{background-color:gold;}
#tdFollowRepl{background-color:teal;}
#tdFollowDiscord{background-color:aqua;}
#tdFollowIn{background-color:firebrick;}
#tdFollowViadeo{background-color:lime;}
#tdFollowMyWeb{background-color:crimson;}
#tdFollowGit{background-color:beige;}
#tdFollowSteam{background-color:silver;}
#tdfollowCopSmall{bakground-color:forestgreen;}
#tdFollowSuperProf{background-color:aqua;}
#tdFollowBoostEtudes{background-color:forestgreen;}
/*Defining size of each icon*/
#youtubeImg, #behanceImg, #patreonImg, #facebookImg, #instagramImg, #codepenImg, #devImg, #replImg, #discordImg, #inImg, #viadeoImg, #myWebImg, #gitImg, #steamImg, #SuperImg{
width:38px;
height:38px;
}
/*#boostEtudesImg{
width:80px;
height:37px;
}*/
/*Defining actions on hover*/
#youtubeImg:hover, #behanceImg:hover, #patreonImg:hover, #facebookImg:hover, #instagramImg:hover, #codepenImg:hover, #devImg:hover, #replImg:hover, #discordImg:hover, #inImg:hover, #viadeoImg:hover, #myWebImg:hover, #gitImg:hover, #steamImg:hover, #SuperImg:hover,#boostEtudesImg:hover{
transform:rotate(360deg);
transition: .50s;
}
#superProfHidden{
display:false;
width:37px;
height:37px;
}// https://www.glyphicons.com/
function ds(){
document.getElementById('DS').innerHTML="Hanra#8087"
}
function un(){
document.getElementById
}
External CSS
This Pen doesn't use any external CSS resources.
External JavaScript
This Pen doesn't use any external JavaScript resources.