/* UMUM */
@font-face {font-family: 'Oswald';src: url('Oswald.ttf') format('truetype');font-weight: normal;font-style: normal;}
html,body{width:100%; height:100%; padding:0;margin:0; }
div,iframe,img{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box; word-wrap: break-word; }
div {-webkit-background-size: cover;-moz-background-size: cover; -o-background-size: cover;background-size: cover; }
.icon_1 {height:170px; width: auto; }
.icon_2 {height:260px; width: auto; }
.kotak_1{ position:absolute;top:10%; left:8%; }
.kotak_2{position:absolute;top:25%; left:22%; }
.kotak_3{position:absolute;top:25%; left:50%;margin-left:-130px; }
.kotak_4{ position:absolute;top:25%; right:22%; }
.kotak_5{position:absolute;top:10%; right:8%;}


.footer {background-color:rgba(0,0,0,0.4); width:100%; height:auto; padding:0px 10%; color: #FFF; position:absolute; bottom:20px;}
p { font-size:15px; font-family:calibri; line-height:20px; }
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.icon_1 {height:140px; width: auto; }
.icon_2 {height:220px; width: auto; }
.kotak_1{ position:absolute;top:10%; left:4%; }
.kotak_2{position:absolute;top:25%; left:18%; }
.kotak_3{position:absolute;top:25%; left:50%;margin-left:-110px; }
.kotak_4{ position:absolute;top:25%; right:18%; }
.kotak_5{position:absolute;top:10%; right:4%;}


}


@media only screen and (max-width: 767px) {

.icon_1 {height:100px; width: auto; }
.icon_2 {height:160px; width: auto; }
.kotak_1{ position:absolute;top:10%; left:1%; }
.kotak_2{position:absolute;top:21%; left:14%; }
.kotak_3{position:absolute;top:19%; left:50%;margin-left:-80px; }
.kotak_4{ position:absolute;top:21%; right:14%; }
.kotak_5{position:absolute;top:10%; right:1%;}

}

@media only screen and (max-width: 479px) {
.icon_1 {height:100px; width: auto;}
.icon_2 {height:180px; width: auto;  }

.kotak_1{ position:absolute;top:0;left:1%; width: auto; }
.kotak_2{position:absolute;top:0; left:auto; right:1%;width: auto; }
.kotak_3{position: absolute;top:60px;left:50%;margin-top:0px; margin-left:-90px;}
.kotak_4{ position:absolute;top:199px;left:1%; width: auto;}
.kotak_5{position:absolute;top:199px; left:auto; right:1%;width: auto; }

.footer { position:absolute; top:350px; width:100%; height:auto; padding:10px 10px;}
p { font-size:13px; font-family:calibri; line-height:20px; }

}