>>3
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous">
<style type="text/css">

@import 'https://fonts.googleapis.com/css?family=Sacramento|Short Stack|Kosugi';

*{
margin:0;
padding:0;
list-style:none;
box-sizing:border-box;
}

body{
background:#fff;
font-family:'Short Stack', 'Kosugi', '游ゴシック', 'YuGothic', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
font-weight:normal;
font-size:12px;
letter-spacing:1.55px;
line-height:1.95;
color:#555;
overflow-x:hidden;
}

a{
text-decoration:none;
color:#1eafed;
}

h1, h3{
padding:2em;
width:100vw;
background:repeating-linear-gradient(90deg, #fff, #fff 20px, #cbf1f5 0, #cbf1f5 40px);
font-family:'Sacramento', 'Kosugi', '游ゴシック', 'YuGothic', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
text-align:center;
text-transform:capitalize;
position:relative;
}

h1 div, h3 div{
background:#cbf1f5;
color:#fff;
border-radius:50%;
}

h1 div{
display:block;
top:88px;
left:50%;
transform:translateX(-50%);
font-size:39px;
line-height:94px;
width:100px;
height:100px;
position:absolute;
border:#fff solid 10px;
z-index:2;
}

h1 div .fas:hover, h3 div .fas:hover{cursor:pointer;}

h1 div .fas:hover{color:#ffc0d0;}

nav{text-align:center;}

.tp ul{
margin:0 2em;
display:flex;
justify-content:space-between;
align-items:flex-end;
}

nav ul li{display:inline-block;}

main{
max-width:500px;
margin:0 auto;
}

section{
margin:2em;
}

h2{
font-size:13px;
font-weight:normal;
color:#905858;
}

h3{
padding:2em;
width:100vw;
background:repeating-linear-gradient(90deg, #fff, #fff 20px, #cbf1f5 0, #cbf1f5 40px);
font-family:'Sacramento';
position:relative;
text-align:center;
text-transform:capitalize;
}

h3 div{
display:inline-block;
font-size:21px;
line-height:50px;
width:60px;
height:60px;
border:#fff solid 8px;
}

h3 div .fas:hover{color:#905858;}

article{margin:2em;}

aside{margin:1em 2em;}

h4{
font-size:21px;
color:#905858;
text-align:center;
}

.tx ul li{margin:0 .5em;}

.tx ul .fas{color:#905858;}

input[type], textarea{
background:#cbf1f5;
font-family:'Short Stack', 'Kosugi', '游ゴシック', 'YuGothic', 'Yu Gothic', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo, sans-serif;
font-weight:normal;
font-size:12px;
letter-spacing:1.55px;
line-height:1.95;
text-align:justify;
word-break:break-all;
color:#905858;
margin:5px 0;
padding:3px 5px;
width:auto;
height:auto;
border:#905858 solid 2px;
border-radius:4px;
text-shadow:none;
box-shadow:none;
resize:vertical;
outline:none;
vertical-align:middle;
}

input[type=text]{width:150px;}

input[type=submit]{
cursor:pointer;
text-transform:lowcase;
}

.nm input[type]{
margin:2em 3px 1em;
line-height:1.5;
}

.nm input[type=text]{width:70px;}

.nm input[type=submit]{
background:#905858;
color:#cbf1f5;
}

textarea{
width:85%;
height:16ch;
}

::selection{
background:rgba(255, 192, 208, .7);
color:#555;
}

::-moz-selection{
background:rgba(255, 192, 208, .7);
color:#555;
}

</style>