<style type="text/css">
body{
font-family: "Helvetica", "Arial", serif;
color: #333;
background-color: #ccc;
margin: 1em 10%;
}
h1{
color: :333;
background-color: transparent;
}
a{
color: #c60;
background-color: transparent;
font-weight: bold;
text-decoration: none;
}
a:hover{
color: red;
}
ul {
padding: 0;
}
li {
float: left;
padding: 1em;
list-style: none;
}
img{
margin: 0 auto;
transition: all 3s;
}
.box{
width: 150px;
height: 150px;
}
.box:hover{
transform: rotateX(180deg);
}
.box1{
width: 150px;
height: 150px;
margin: 0 auto;
transition: all 2s ;
}
.box1:hover{
border-radius:50%;
}
.box2{
width: 150px;
height: 150px;
background-color: red;
border-radius:50% ;
transition: all 2s;
}
.box3{
transition: all 3s;
}
.box3{
width: 150px;
height: 150px;
background-color: orangered;
margin: 0 auto;
box-shadow: 5px 15px 2px blueviolet;
}
#imagegallery {
list-style: none;
}
#imagegallery li {
margin: 0px 20px 20px 0px;
padding: 0px;
display: inline;
}
#imagegallery li a img {
border: 0;
}
</style>