Week 1, A-Thx (Copy 688) (Branch 705)

✨ นายสุเมธ เขตขาม

<html>

<head>
    <title>Let's Start
    </title>
    <style>
      	
      	@font-face {
           font-family: "Anuphan";
           src: url('https://www.jabont.com/jayss/fonts/Anuphan/Anuphan-Light.woff2') format('woff2');
           font-weight: 200;
        }
      
        body {
            background: #eee;
            margin: 2em;
            font-family: "Anuphan", sans-serif;
          background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(255,37,174,1) 0%, rgba(241,147,55,1) 53.4%, rgba(250,237,56,1) 99.5% );
        }

.namecard {
            width: 90%;
            margin: auto;
            text-align: center;
            background: black;
            padding: 2em;
            border-radius: 15px;
            color: white;
          	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
        }

.gcard {
            display: flex;
            width: 100%;
            height: 15vh;
        }
      
        .ncard {
            width: 100%;
            background: white;
            border-radius: 15px;
            color: black;
            margin: 10px;
            text-align: center;
          	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
          	transition: all .3s;
        }
      .ncard a {
			color: black;
        transition: all .2s;
      }
      
      .ncard a:hover {
			color: red;
      }
      
      .ncard:hover {
			background: #0abde3;
      }
      
      /*
        .title {
            color: #eee;
        }*/

a {
            color: #eee;
        }

h5 {}
    </style>
</head>

<body>
    
    <div class="namecard">
        <h1 class="title">
            Group C
        </h1>
        <p class="title">
            #TeamThx
        </p>
    </div>
    <div class="gcard">
        <div class="ncard title">
            <h2>บิ๊ก</h2>
            <a href="https://www.facebook.com/profile.php?id=100004024247741" target="_blank">Sumet Khetkam</a>
        </div>
        <div class="ncard title">
            <h2>ฟิล์ม</h2>
            <a href="https://www.facebook.com/profile.php?id=100009911313309" target="_blank">Pithawat Nuckong</a>
        </div>
    </div>
    <div class="gcard">
        <div class="ncard title">
            <h2>ซัน</h2>
            <a href="https://www.facebook.com/santa.nakano.9" target="_blank">Santa Nakano</a>
        </div>
        <div class="ncard title">
            <h2>นอร์ธ</h2>
            <a href="https://www.facebook.com/north.lightza/" target="_blank">Nlightza North</a>
        </div>
    </div>
    <div class="gcard">
        <div class="ncard title">
            <h2>ปอนด์</h2>
            <a href="https://www.facebook.com/profile.php?id=100005508646227" target="_blank">Panupong Keawkam</a>
        </div>
        <div class="ncard title">
            <h2>อั้ม</h2>
            <a href="https://www.facebook.com/nat.cha.37017/" target="_blank">ณัฐณิชา โล่ห์ชาวนา</a>
        </div>
    </div>
  	<div class="gcard last">
        <div class="ncard last title">
            <h2>โอ๊ค</h2>
            <a href="https://www.facebook.com/profile.php?id=100010523205274" target="_blank">Nattanan Ben</a>
        </div>
    </div>
</body>

</html>