diff --git a/style.css b/style.css index b406f93..b8bcc18 100644 --- a/style.css +++ b/style.css @@ -149,12 +149,6 @@ i{ margin-left:-2vw; margin-right:3vw } -div.gallery{ - border:1px solid #6272a4 -} -div.gallery:hover{ - border:1px solid #8be9fd -} div.gallery img{ width:100%; height:auto @@ -289,3 +283,52 @@ div.desc{ } } + +.image-container { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + margin: 20px; +} + +.image-container img { + max-width: 100%; + margin-bottom: 10px; + flex: calc(33.33% - 10px); + border-radius: 15px; + box-sizing: border-box; +} + + .gallery { + display: flex; + flex-wrap: wrap; + justify-content:left; +margin-left: 7vw; +margin-right: 7vw; + } + + .image-container { + position: relative; + width: calc(33.33% - 20px); + margin: 10px; + overflow: hidden; + border-radius: 10px; + } + + .image { + width: 100%; + height: auto; + border-radius: 10px; + } +@media screen and (max-width:1150px){ + .image-container { + flex-direction: column; + align-items: center; + } + .gallery { + justify-content: flex-start; + } + .image-container { + width: calc(100% - 20px); + } + }