body {
font-family:tahoma;
background-image:url('../images/backgrim.jpg');
background-size:100% 100%;
 background-repeat: no-repeat;
  background-attachment: fixed;

}

.img-enlargable {
border:50px solid #fff;
}

.img {
display: block;
  object-position: 50% 50%;
  object-fit: cover;
  width: 100%;
  height: 100%;
  border-radius: 5px;
 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
border:1px solid #ccc;

}

main {

}
    ul {
      display: flex;
    }

    li {
      list-style-type: none;
      padding: 2px;
      position: relative;
    }

.large {
  position: absolute;
  left: -9999px;
}

li:hover .large {
  left: -150px;
  top: -150px;
  z-index:100;
}

.large-image {
   border:10px solid white;
   margin:20px;
   border-radius: 4px;
   box-shadow: 1px 1px 3px 3px rgba(127, 127, 127, 0.15);;
}

iframe {
padding:20px;
}

.links {
padding:5px;
float:left;
}




/* Add a black background color to the top navigation */
.links {
	    background-color: #333;
	        overflow: hidden;

	}

	/* Style the links inside the navigation bar */
	.links a {
		  float: left;
		    color: #f2f2f2;
		      text-align: center;
		        text-decoration: none;
			  font-size: 17px;
		  }

		  /* Change the color of links on hover */
		  .links a:hover {
			    background-color: #ddd;
			      color: black;
		      }

		      /* Add a color to the active/current link */
		      .links a.active {
			        background-color: #04AA6D;
				  color: white;
			  }

			  /* Right-aligned section inside the top navigation */
			  .links-right {
				    float: right;
			    }
