﻿body {
   
    font-family: 'Poppins', sans-serif;
margin:0;
padding:0;
}
/* Set padding to keep content from hitting the edges */


/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}



.instagram-posts{display: flex;gap: 10px;flex-direction: row;flex-wrap: wrap;}
.instagram-posts.yanli {display: grid; grid-template-columns: 1fr 1fr 1fr;grid-template-rows: 1fr 1fr; gap: 10px; margin-top:50px}
.instagram-posts.yanli .post:nth-child(1) { grid-row: span 2;}
.instagram-posts.yanli .post:nth-child(1) .instaebat{aspect-ratio: 1080 / 1920;}
.instagram-posts.yanli .post .instaebat{aspect-ratio: 1080/950;}
.instagram-posts.yanli>div{width:100%}

.instagram-posts>div{width: calc(25% - 8px);}
.instagram-posts>div a{display: flex;position:relative;overflow: hidden;flex-direction: column;}
.instagram-posts>div a:hover .txt{bottom: 0;}
.instagram-posts>div video{width: 100%;}
.instagram-posts>div img{ width: 100%;}
.instagram-posts .txt{position:absolute;bottom: -100%;left: 0;padding: 8%;color: #fff;z-index: 99;transition: 0.5s;}

.instagram-posts>div p{font-size: 15px;color: #fff;line-height: 18px;}
.instagram-posts .instaebat{aspect-ratio:1080 / 1350;position: relative;overflow: hidden;}
.instagram-posts .instaebat img, .instagram-posts .instaebat video {width: 100%;cursor: pointer;transition: 0.5s; height: 100%;-o-object-fit: cover; object-fit: cover; position: relative;}

.instagram-posts .bgblack {position: absolute;top: 0;left: 0;background: #000;z-index: 2;width: 100%;height: 100%;opacity: 0;transition: 0.5s;}
.instagram-posts > div a:hover .bgblack {opacity: .5;}
.instagram-posts .klip{position:absolute;right: 10px;z-index: 3;top: 10px;color: #fff;}

.head{text-align:center}
.baslik1 {font-size: 22px;color: #000;font-weight: 100;line-height: 38px;letter-spacing: 3px;}
.baslikbold {color: #000;font-weight: 500;margin-top: 0.3vh;font-size: 27px;line-height: 24px;letter-spacing: 8px;font-weight: 900;}

@media (max-width: 800px) {
    .instagram-posts.yanli {
        display: flex;
    }
}