body{

background-image: url(backgruond.jpg);
background-attachment: fixed;
background-repeat: no-repeat;
background-size: cover;


}

.title{

color: rgba(245, 245, 245, 0.466);
font-size: 50px;
text-align: center;
border-radius: 30px;
margin-top: -5px;
font-style: italic;
text-transform: capitalize;



}

.title:hover{


color: rgba(231, 109, 27, 0.579);
transition: all 2s;



}
.img{

width: 465px;
height: 500px;
/* border: 2px solid rgba(255, 0, 0, 0.616); */
display: inline;
margin: 5.5px;
margin-top: 15px;
border-radius: 10% ;


}

.Garena{
color: black;
font-size: 30px;
text-decoration: none;
padding: 10px;
background-color: whitesmoke;
margin-top: 20px;
display: inline-block;
font-style: italic;


}

.Garena:hover{

    color: whitesmoke;
    background-color:rgba(255, 0, 0, 0.681) ;
transition: all 2s;


}




.Pub{

  background-color: whitesmoke;
  color: black;
  display: inline-block;
  font-size: 30px;
  text-decoration: none;
margin-top: 25px;
padding: 10px;
font-style: italic;


}

.Pub:hover{

background-color: black;
color: whitesmoke;
transition: all 2s;




}



.sites{

background-color: black;
color: rgba(255, 255, 255, 0.374);
font-size: 50px;
margin-top: 20px;
display: inline-block;
width: fit-content;
padding: 10px;
margin-left: 35%;
margin-bottom: 20px;
text-transform: capitalize;

}

.sites:hover{

color: white;
transition: all 2s;


}


.img2{



width: 465px;
height: 500px;
/* border: 2px solid rgba(255, 0, 0, 0.616); */
display: inline;
margin: 5.5px;
margin-top: 15px;
border-radius: 10% ;




}

.img3{


    width: 500px;
    height: 500px;
    /* border: 2px solid rgba(255, 0, 0, 0.616); */
    display: inline;
    margin: 5.5px;
    margin-top: 15px;
    border-radius: 10% ;



}

.call{

background-color: whitesmoke;
color: black;
font-size: 30px;
display: inline-block;
margin-top: 20px;
text-decoration: none;
padding: 10px;
font-style: italic;




}

.call:hover{


    background-color: goldenrod;
    color: whitesmoke;
transition: all 2s;





}





.free{

width: 600px;
height: 500px;
border-radius: 30px;
margin-top: 30px;
display: inline-block;
margin-left: 10px;



}



.back{

width: 200px;
height: 200px;
border-radius: 50%;
object-fit: cover;
animation: rotate   3s linear infinite;
display: inline;
margin: 7px;

}

@keyframes rotate{

from{


    transform: rotate(0deg);


}
to{

    transform: rotate(360deg);


}


}