@import url("https://fonts.googleapis.com/css2?family=Inria+Serif:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap");
html, body{
    width: 1900px; 
    height: 2500px;
    padding: 0;
    margin: 0 auto;
    background-color: rgb(220, 245, 252);
}
body{
    font-family: "Inria Serif", serif;
    position: relative;
}
.paintings{
    position: relative;
}
.MonaLisa, .Swing, .GirlWithPearl, .StarryNight, .Scream, .GreatWave, .Back, .Tip{
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    border: 10px outset rgb(228, 228, 228);
    transition: 0.25s;
}
.Bluesky{
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    transition: 0.25s;
}
.Tip{
    width: 930px;
    height: 58px;
    left: 172px;
    top: 21px;
    font-size: 48px;
    border: 10px solid black;
    text-align: center;
}
.MonaLisa img {
    width: 100%;
    height: 100%;
}
.Swing img {
    width: 100%;
    height: 100%;
}
.GirlWithPearl img {
    width: 100%;
    height: 100%;
}
.StarryNight img {
    width: 100%;
    height: 100%;
}
.Scream img {
    width: 100%;
    height: 100%;
}
.GreatWave img {
    width: 100%;
    height: 100%;
}
.Back img {
    width: 100%;
    height: 100%;
}
.Tip img {
    width: 100%;
    height: 100%;
}
.MonaLisa{
    width: 546px;
    height: 732px;
    left: 1189px;
    top: 21px;
}
.Swing{
    width: 931px;
    height: 580px;
    left: 172px;
    top: 171px;
}
.GirlWithPearl{
    width: 483px;
    height: 524px;
    left: 172px;
    top: 806px;
}
.StarryNight{
    width: 1029px;
    height: 767px;
    left: 706px;
    top: 806px;
}
.Scream{
    width: 483px;
    height: 714px;
    left: 172px;
    top: 1430px;
}
.GreatWave{
    width: 1029px;
    height: 496px;
    left: 706px;
    top: 1648px;
}
.Bluesky{
    left:806px;
    top: 2250px;
}
.Back{
    width: 207px;
    height: 209px;
    left: 127px;
    top: 1858px;
    display: none;
}
.MonaLisa:hover, .Swing:hover, .GirlWithPearl:hover, .StarryNight:hover, .Scream:hover, .GreatWave:hover, .Tip:hover, .Bluesky:hover{
    cursor: pointer;
    transform: rotateZ(3deg);
}