body{
    margin:0;
    background:#5a2e69;
    
    color:white;
    font-family:Arial, Helvetica, sans-serif;
}

h1{
    text-align:center;
    padding:20px;
    font-weight:200;
    color:#d647c1;
}


p{
  text-align:center;
padding:20px;
font-size: 15 ;
font-weight:200;
color:#96ffff;
}

a{
  color:#43f0ae;
}
  

li{text-align:center;
padding:20px;
font-size: 15 ;
font-weight:200;
}

ul{
  text-align:center;
  font-size: 15 ;
  list-style-position:inside;
  color:#7db3ff
}

.karogaska{color:#ffff05;
}

.gallery{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
    gap:15px;
    padding:20px;
}

.gallery img{
    width:100%;
    height:220px;
    object-fit:cover;
    border-radius:15px;
    cursor:pointer;
    transition:0.3s;
    box-shadow:0 0 15px rgba(54,250,52,0.5);
}

.gallery img:hover{
    transform:scale(1.05);
    box-shadow:0 0 20px rgba(255,255,255,0.2);
}

/* zoom fullscreen */
#viewer{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(25,180,85,0.75);
    display:none;
    justify-content:center;
    align-items:center;
}

#viewer img{
    max-width:90%;
    max-height:90%;
}