body{
    
    height: 100vh;
    background-image: url("/Images/background.png");
    background-size: cover
}

/* grid container */
.containerMain {
  display: grid;
justify-content: center;
  align-items: center;
 width: 900px;
  grid-template-columns:  50% 50%;
  padding: 10px;
grid-template-rows: 30px 160px;
    
gap:1px;
    grid-template-areas:
"ItemNavigation ItemNavigation"
"containerHobbyRoomclick containerHobbyRoomclick";

margin: 0 auto;
}
/* grid container */

/* list of items */
.ItemNavigation {
 
    grid-area: ItemNavigation;

}
.containerHobbyRoomclick {
    grid-area: containerHobbyRoomclick;}

/* list of items */

.FlexcontainterNavigation {
display: flex;
align-items: center;
justify-content: center;
height: 25px;
gap: 30px;
background-color: hsl(298.6,89.6%,89.7%, 0.2);
}

a{
color: #ffb4d9;
text-decoration: none;
font-family: 'Trebuchet MS', sans-serif;
  line-height: 1.5;
  letter-spacing: 1px;
  font-style: italic;  
}

.Navigation:hover{
background-color: rgba(200, 255, 255, 0.1);
    color: white;
    text-shadow: 1px 1px 5px white;
    transition: background-color 0.5s, color 0.5s, text-shadow 0.5s;}


.containerHobbyRoomclick{
display: flex;
align-items: center;
justify-content: center;
gap: 13%;
}

.DivIcon{
background-color: hsl(298.6,89.6%,89.7%, 0.3);
}

.ClickImage{
height: 200px;
width: 200pxpx;
    margin-right: 20px;
}

.description{
text-align: center;
color: #ffedff}





