Week 1 Group D Team P

✨ SOMCHAI CHONGRACHEN

<html>
<style>
    @import url("https://fonts.googleapis.com/css2?family=Baloo+Paaji+2:wght@400;500&display=swap");

.e{
    text-decoration: none;
}

.container {
  display: grid;
  grid-template-columns: 380px;
  grid-gap: 80px;
  justify-content: center;
  align-items: center;
  font-family: 'Baloo Paaji 2', cursive;
  margin-top: 3em;

}

body {
  margin: 0;
  cursor: url(https://cdn.discordapp.com/attachments/798880519911374858/798908766741331998/HAND_CURSOR_COMIC_1.cur), auto;
  background-color: ;
}

.eiei{
  font-family: 'Baloo Paaji 2', cursive;
  font-size: xx-large;
  padding: 20vh 0;
  background-image: url("https://cdn.discordapp.com/attachments/798880519911374858/798906540211961886/bg.jpeg");
  text-align: center;
  color: white;
  background-size: cover;
  background-attachment: fixed;
}

.pict{
  transition: 0.3s;
  /* background-position: center; */
  box-shadow: 0 10px 50px rgba(235, 25, 110, 1);
  background-color: gray; width:50%; padding-top: 50%; border-radius: 100%; margin-top: 10%; background-size: cover;
}

.pict:hover{
  background-size: 120%;
}

.card {
  background-color: #222831;
  height: 40rem;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: white;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2), 0px 0px 50px rgba(0, 0, 0, 0.2);
}

.card__name {
  margin-top: 0em;
  font-size: 1.2em;
}

.card__nickname {
  margin-top: 1em;
  font-size: 2em;
}

.btn {
  background: none;
  border: none;
  cursor: pointer;
  line-height: 1.5;
  font: 700 1.2rem 'Roboto Slab', sans-serif;
  padding: 0.75em 2em;
  letter-spacing: 0.05rem;
  margin: 1em;
  width: 13rem;
}

.btn:focus {
  outline: 2px dotted #55d7dc;
}

.social-icons {
  padding: 0;
  list-style: none;
  margin: 1em;
}

.social-icons li {
  display: inline-block;
  margin: 0.15em;
  position: relative;
  font-size: 1em;
}

.social-icons a {
  display: inline-block;
}

.social-icons a:before {
  transform: scale(1);
  -ms-transform: scale(1);
  -webkit-transform: scale(1);
  content: " ";
  border-radius: 100%;
  display: block;
  transition: all 265ms ease-out;
}

p {
  margin-top: 0;
}

.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
  font-size: 1.2em;
}

</style>
<body>
    <header class="eiei">
        <h1>Group D Team<a class="e" target="_blank" href="https://www.facebook.com/tanawat.kemwatcharalert/">P'NEW</a></h1>
    </header>
    <div class="container">
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907778479554590/best.jpg');"></div>
            <p class="card__nickname">เบส</p>
            <p class="card__name">ทัชชน เจริญภูวดล</p>
            <ul class="social-icons">
                <li><a target="_blank" href="http://instagram.com/thatchonn"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/thatchonn"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/9vObXFDucD"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0970404753</p>
            <p>Birthdate : 29/4/2545</p>
            <p>ID : 63070067</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907786913644594/pun.jpg');"></div>
            <p class="card__nickname">ปัณณ์</p>
            <p class="card__name">ปัณณธร กระแสร์วิก</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/punn_pnt/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/profile.php?id=100007892743556"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/N7nZ2GMbIo"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0623701515</p>
            <p>Birthdate : 5/2/2545</p>
            <p>ID : 63070106</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907779459842068/tae.jpg');"></div>
            <p class="card__nickname">เต้</p>
            <p class="card__name">พงศธร ภัทรศรีเวชการ</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/tt_tay_yy/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/iheretay/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/T7t7hkJHS7"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0958127404</p>
            <p>Birthdate : 19/10/2544</p>
            <p>ID : 63070110</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907787500322827/roong.png');"></div>
            <p class="card__nickname">สายรุ้ง</p>
            <p class="card__name">พิมพ์มาดา กรุ่นสูงเนิน</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/s.sairoong/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/roong.pimmada.50"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/QcTdDzAMR4"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0612452602</p>
            <p>Birthdate : 7/12/2544</p>
            <p>ID : 63070120</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907783063666718/fah.jpg');"></div>
            <p class="card__nickname">ฟ้า</p>
            <p class="card__name">พุทธิมา เดชดำนิล</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/mikaxris/?hl=th"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/fahputthima"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/Z9bYxMcDMp"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0988832672</p>
            <p>Birthdate : 19/9/2543</p>
            <p>ID : 63070127</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907779531145296/boss.jpg');"></div>
            <p class="card__nickname">บอส</p>
            <p class="card__name">ศุภชัย แก้วจุ้ย</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/boss_ssoq/?hl=th"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/boss.spicyz/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/jVSABdI-9q"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0957196167</p>
            <p>Birthdate : 18/10/2545</p>
            <p>ID : 63070168</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907781591728139/chai.jpg');"></div>
            <p class="card__nickname">ชัย</p>
            <p class="card__name">สมชัย จงราเชนทร์</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/_chaikidz/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/chaickdz"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/E-_2wE4d1p"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0824893219</p>
            <p>Birthdate : 6/3/2544</p>
            <p>ID : 63070172</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798908602580467712/ter.jpg');"></div>
            <p class="card__nickname">เตอร์</p>
            <p class="card__name">สรฉัตร สังขพันธ์</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/ter2002new/?hl=th"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/profile.php?id=100002201479250"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/ljkhTcb-CS"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0649041117</p>
            <p>Birthdate : 11/3/2545</p>
            <p>ID : 63070173</p>
        </div>
        <div class="card">
            <div class="pict" style="background-image: url('https://cdn.discordapp.com/attachments/798880519911374858/798907786162733056/nut.jpg');"></div>
            <p class="card__nickname">ณัฐ</p>
            <p class="card__name">อาณัฐ บุญเลิศ</p>
            <ul class="social-icons">
                <li><a target="_blank" href="https://www.instagram.com/3.31662/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906857208545290/ig.png" width="45" height="45" alt="IG"></a></li>
                <li><a target="_blank" href="https://www.facebook.com/smilenut.smile.5/"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906855794671646/fb.png" width="45" height="45" alt="FB"></a></li>
                <li><a target="_blank" href="https://line.me/ti/p/azK6NKm2KD"><img src="https://cdn.discordapp.com/attachments/798880519911374858/798906858281893939/line.png" width="45" height="45" alt="LINE"></a></li>
            </ul>
            <p>Tel : 0644072812</p>
            <p>Birthdate : 19/6/2544</p>
            <p>ID : 63070187</p>
        </div>
    </div>
</body>