/* GALER*/
.imagecab{
	//border:1px solid blue;
    width: 99%;
    margin: 10px auto;
    position: relative;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
	
}

.cssimgbox {
	/* border:1px solid red; */
	width: 14vw;
    height: auto;
    margin: 1vw;
  -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
       -o-transition: all 0.3s;
      -ms-transition: all 0.3s;
          transition: all 0.3s;
}

.cssimgbox img.cssimgbox_mini{
	width:100%;
	height:auto;
	margin:0vw; padding:0.44vw; border:1px solid #D6D6D6;
	-moz-box-shadow: 1px 0.3vw 0.44vw 1px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 1px 0.3vw 0.44vw 1px rgba(0, 0, 0, 0.5);
	box-shadow: 1px 0.3vw 0.44vw 1px rgba(0, 0, 0, 0.5);
	-webkit-transition: 1s ease-in-out;
	transition: 1s ease-in-out;
}

.cssimgboxoverlay {/*menü açılınca ekranı siyah kapla*/
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0,0,0, 0.8);
	overflow-x: hidden;
	transition: 0.5s;
	z-index:999998;
	display:none;
	cursor: zoom-out;
	backdrop-filter: blur(5px);
	-moz-backdrop-filter: blur(5px);
}

.cssimgbox img.cssimgbox_mini:hover{
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
	-webkit-transition: .1s ease-in-out;
	transition: .1s ease-in-out;
	cursor: zoom-in;
	}

span.cssimgbox_full {
	display: none;
	z-index: 999999;
	position: fixed;
	pointer-events: none;
	cursor: default;
	transition: opacity 0.5s linear;
}

span.cssimgbox_full img {
	position: fixed;
	background-color: white;
	margin: 0;
	padding: 0;
	height: 100%;
	width: auto;
	max-width: 90%;
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	box-shadow: 0 0 20px black;
	-moz-border-radius: 2vw;
	-webkit-border-radius: 2vw;
	-khtml-border-radius: 2vw;
	border-radius: 2vw;
	overflow:hidden;
}

a.cssimgbox_title{
	z-index: 999999;
	position: fixed;
	visibility: hidden;
	color: rgba(255,255,255, 0.7);
	text-shadow: 1px 1px 1px rgba(0,0,0, 0.5);
	font-size:2vw;
	text-decoration: none;
	left: 50%;
	top: 4%;
	transform: translate(-50%, -50%);
}
a.cssimgbox_kapat,
a.cssimgbox_sol,
a.cssimgbox_sag{
	z-index: 999999;
	position: fixed;
	visibility: hidden;
	color: rgba(255,255,255, 0.5);
	text-shadow: 1px 1px 1px rgba(0,0,0, 0.5);
	font-size: 4vw;
	padding:2vw;
	text-decoration: none;
}

a.cssimgbox_sol{top: 42%; left:0;}
a.cssimgbox_sag{top: 42%; right:0;}
a.cssimgbox_kapat {top:0; right:0}


a.cssimgbox_kapat:hover,
a.cssimgbox_sol:hover,
a.cssimgbox_sag:hover {color:#fff;}

a:target ~ a.cssimgbox_title,
a:target ~ a.cssimgbox_kapat,
a:target ~ a.cssimgbox_sol,
a:target ~ a.cssimgbox_sag {
	visibility: visible;
}

a:target > img.cssimgbox_mini + span.cssimgbox_full {
	display: inline-block;
	visibility: visible;
	opacity: 1;
	pointer-events: initial;
}

a:target ~ .cssimgboxoverlay {
	transition: 0.5s;
	opacity: 1;
	display:block;
}
/* This is the end of CSSBox */

/* Mobil Responsive */
@media screen and (max-width: 799px) {
	.cssimgbox {width:84vw}
	a.cssimgbox_kapat{font-size: 10vw;padding:12vw 1vw;}
	a.cssimgbox_sol,a.cssimgbox_sag{font-size: 10vw;padding:2vw;top:45%}
	a.cssimgbox_title{font-size:4vw;top:15%;
}
	
	.imagecab{padding:0}
	span.cssimgbox_full img {
		height: auto;
	}
	
	
}