Week 1 -TA Getty (Copy 573) (Branch 775)

✨ CHATCHANON KEAWSUKKHO

<html>
  <head>
    <style>
		@import url('https://fonts.googleapis.com/css2?family=Prompt&display=swap');
	</style>
    <title>Let's Start</title>
    <style>
      body{
        cursor: url(https://imgur.com/fKMATMB.png), auto;
        background:linear-gradient(to top, violet,#ee69a8);
        margin:2em;
        font-family: 'Prompt', sans-serif;
      }
      @keyframes star{ 
        from{
          margin-top: -500px;
          transform: rotate(0turn);
        }
        to{
          margin-top: 1750px;
          transform: rotate(1turn);
        }
      }
      .starplattinumbyjojotaro{
         opacity: 0.4;
         animation-name: star;
         animation-duration: 4s;
         animation-iteration-count: infinite;
         position: absolute;
         display: block;
         width: 0px;
         height: 0px;
         border-right:  100px solid transparent;
         border-bottom: 70px  solid white;
         border-left:   100px solid transparent;
         -moz-transform:    rotate(35deg);
         -webkit-transform: rotate(35deg);
         -ms-transform:     rotate(35deg);
         -o-transform:      rotate(35deg);
      }
      .starplattinumbyjojotaro:before {
         border-bottom: 80px solid white;
         border-left: 30px solid transparent;
         border-right: 30px solid transparent;
         position: absolute;
         height: 0;
         width: 0;
         top: -45px;
         left: -65px;
         display: block;
         content: '';
         -webkit-transform: rotate(-35deg);
         -moz-transform:    rotate(-35deg);
         -ms-transform:     rotate(-35deg);
         -o-transform:      rotate(-35deg);

}
      .starplattinumbyjojotaro:after {
         position: absolute;
         display: block;
         top: 3px;
         left: -105px;
         width: 0px;
         height: 0px;
         border-right: 100px solid transparent;
         border-bottom: 70px solid white;
         border-left: 100px solid transparent;
         -webkit-transform: rotate(-70deg);
         -moz-transform:    rotate(-70deg);
         -ms-transform:     rotate(-70deg);
         -o-transform:      rotate(-70deg);
         content: '';
         }
      .namecard{
        border-radius: 2rem;
        width:50%;
        margin-left:auto;
        margin-right:auto;
        margin-bottom:50px;
        text-align:center;
        background: url("https://pbs.twimg.com/media/EoDwi7EUwAAwKUs?format=jpg&name=large");
 		 background-size: cover;
 		 background-position: center;
        padding:2em;
        box-shadow: 0 10px 30px hsl(60, 80%, 50%);
        position: relative;
        top: 0;
        left: 0;
        transition: 3s;
        animation: MoveUpDown 1s linear infinite;
      }
      @keyframes MoveUpDown {
            8% {
                top: 5px;
                text-decoration: none;
            }
        }
      .title{
        text-shadow: 3px 2px #d0743b;
      	color:#ee69a8;
      }
      .imgcontainer{
	background-color:pink;
		}

.img{
        width:inherit;
        height:inherit;
        opacity:0.8;
      }	
      a{
        cursor: url(https://imgur.com/fKMATMB.png), auto;
        color:black;
      }
    </style>
  </head>
  <body>
    <div class="starplattinumbyjojotaro">
    </div>
    <div class="starplattinumbyjojotaro" style="margin-left: 200px; animation-delay: 0.5s;">
    </div>
    <div class="starplattinumbyjojotaro" style="margin-left: 350px; animation-delay: 1s;">
    </div>
    <div class="starplattinumbyjojotaro" style="margin-left: 450px; animation-delay: 1.5s;">
    </div>
    <h3>
    <div class="namecard">
      <h1 class="title">
        GroupA: Team P'Getty
      </h>
      <h2>
        สวัสดีค้าบบบบบบ!!!
      </h2>
       </h3>
        
      
    </div>
    
    <h3>
      
    
    <div class="namecard">
      <img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
        ปลื้ม : <a href="https://www.facebook.com/profile.php?id=100010069969302">Jedsadakorn 
        P'leum</a><br>
      </p>
    </div>
    <div class="namecard">
      <img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
       นิก :  <a href="https://www.facebook.com/profile.php?id=100005283108642">Nikk Pettavee</a><br>
      </p>
    </div>
    <div class="namecard">
      
      <img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
       	มาร์ค : <a href="https://www.facebook.com/chatchanonmark">Chatchanon Kaewsukkho</a><br>
      </p>
    </div>
    <div class="namecard">
   
      <img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
         อัลตร้า : <a href="https://www.facebook.com/kaiwin.nawin.7?_rdc=1&_rdr">Kaiwin Naw-in</a><br>
      </p>
    </div>
    <div class="namecard">

<img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
       เกอร์ : <a href="https://www.facebook.com/placanom/">Tanakit Suparp</a><br>
      </p>
    </div>
    <div class="namecard">

<img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
       แบงค์ : <a href="https://www.facebook.com/kittipop.pangtrakool/">Bank Kittipob</a><br>
      </p>
    </div>
    <div class="namecard">

<img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
         โมเด็ม : <a href="https://www.facebook.com/mo.modem.10/">Jin Cho</a><br>
      </p>
    </div>
    <div class="namecard">
      <img src="https://facebookbrand.com/wp-content/uploads/2019/04/f_logo_RGB-Hex-Blue_512.png?w=512&h=512" width="50">
      <p>
         โอม : <a href="https://www.facebook.com/thitiwut11/">Thitiwut Hoontamai</a><br>
      </p>
        </div>
      </h2>
  </body>
</html>