.poppins-regular {
  font-family: "Poppins", serif;
  font-weight: 400;
  font-style: normal;
}

.poppins-medium {
  font-family: "Poppins", serif;
  font-weight: 500;
  font-style: normal;
}
.knewave-regular {
  font-family: "Knewave", serif;
  font-weight: 400;
  font-style: normal;
}

body{position:relative;margin:0; padding:0; font-family:"Poppins", Arial, sans-serif; height:auto;
background:url(images/bg.jpg) no-repeat 50% 0; background-size: cover;}
.container {background:url(images/bg.jpg) no-repeat 50% 0; background-size: cover; margin-top: -85px; position: relative; z-index: -1; padding-top: 50px; }
h1, h2, h3 {font-weight:600; letter-spacing:1px; margin:0;}
.topbg { height: 81px; background:url(images/curve.png) 50% 0 no-repeat; background-size:cover;}
.top1 {text-align:center; padding:10px;text-transform:uppercase; }
.top1 img {max-width:280px; -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-duration: .2s;
    animation-duration: .2s;}
.top1 h2 {font-weight:500;}
.top1 h3 {font-family: "Knewave", serif; font-weight: 400; color:#be2329; font-size:3em; line-height:1em;}
.percuma {font-family: "Knewave", serif; color:#be2329;}
.desc {padding:0 20px; color:#001b74;margin:0 10px 10px;}
p{text-align:center; margin:0}
p.free {font-size:40px; font-weight:700;font-family:"Bungee", sans-serif; color:#dd9700; letter-spacing:2px;}
.btn {background:#fdb61e;font-weight:500;color:#333;box-shadow:0 1px 2px rgba(0,0,0,.2);padding:10px 20px;border-radius:10px; vertical-align:top; text-decoration:none;}
.btn:hover {background:#ce1018;color:#fff}
a.link{background:#fff700 url(images/arrow-right.png) no-repeat 92% 50%; text-transform:capitalize; font-size:18px; padding:10px 50px 10px 20px; font-style:italic; color:#333;
	box-shadow:0 2px 2px rgba(0,0,0,.5); text-decoration:none;  border-radius:10px;
}
a.link:hover{background:#b7da3a url(images/arrow-right.png) no-repeat 92% 50%; color:#fff }
.click-btn {text-align: center;  margin-top: 20px; position:relative; z-index:5555;}
.pc {text-align:center;}
.pc img {padding-left:16%; max-width:350px;}
.asyraf {position:absolute;bottom:0;z-index:2;left:25%; }
.asyraf img {margin:0 0 -6px; max-width:280px}
.wrap2 {display:flex; align-items:center; justify-content: space-evenly; max-width:700px; padding:0 10px; margin: 0 auto;}

footer {background:#1f4c90;color:#aeedff; padding:20px;font-size:13px; text-align:center; border:1px solid #bbd6ff;border-width:8px 0 0;}
.footer {width:25%;margin-left:43%; }
.gnius {max-width:45px}
.title3 {font-size:18px;color:#ffe556;font-weight:600;}
.white {color:#fff;margin:5px 0 0;}

@media (max-width:1200px){
	.asyraf {left:20%}
}
@media (max-width:980px){
	.asyraf {left:15%}
	.footer {width:35%;}
}
@media (max-width:820px){
	.asyraf {left:10%}
	.footer {width:45%;}
}
@media (max-width:660px){
	.asyraf {left:5%;}
	.asyraf img {max-width:70%}
	.footer {width:65%;margin-left:30%;}
 .desc {font-size:1.2em;}
 p.free {font-size:3em;}
 .footer {font-size:1.1em;}
 .title3 {font-size:1.5em;}
}

@media (max-width:525px){
	.asyraf {left:2%;}
	.asyraf img {max-width:60%}
	.footer {width:60%;margin-left:40%;}
	.dawd {max-width:125px;}
	.pc img {padding:0; max-width:300px}
}