:root {
	--bgnokta1: #134242;
	--bgnokta2: #eee;
	--aspect_ratio : 977.329/828.333;
}


.resim_col {
	width: 100%;
	aspect-ratio: var(--aspect_ratio);
	border-radius: 4px;
	transition: all 1s ease;
}

.resim__ {
	position: absolute;
	width: 100%;
	aspect-ratio: var(--aspect_ratio);
	top: 50%;
	right: 10px;
	transform: translate(0,-50%);
}

.salon_resim {
	position:absolute;
	top: 0;
	left: 0;
	height: 99%;
	width: 100%;
	text-align: center;
	z-index:1;
	margin:auto;
	opacity: 0;
}

.salon_resim img {
	width: auto;
	height: 100%;
}

.salon_svg{
	position:absolute;
	top: 0;
	left: 0;
	height: 99%;
	width: 100%;
	z-index:1;
	text-align: center;
}

.salon_svg svg {
	width: auto;
	height: 100%;
}
.salon_svg svg path {
	fill: none;
	stroke:#000;
	stroke-width: 1;/*0.5;*/
}

.p-6 {padding: 4rem;}  
.p-7 {padding: 5rem;}  
.p-8 {padding: 6rem;}
.p-9 {padding: 7rem;}
.p-10 {padding: 8rem;}
.p-11 {padding: 9rem;}
.p-12 {padding: 10rem;}
.p-13 {padding: 11rem;}
.p-14 {padding: 12rem;}
.p-15 {padding: 13rem;}
.p-16 {padding: 14rem;}
.pt-6 {padding-top: 4rem;}  
.pt-7 {padding-top: 5rem;}  
.pt-8 {padding-top: 6rem;}
.pt-9 {padding-top: 7rem;}
.pt-10 {padding-top: 8rem;}
.pt-11 {padding-top: 9rem;}
.pt-12 {padding-top: 10rem;}
.pt-13 {padding-top: 11rem;}
.pt-14 {padding-top: 12rem;}
.pt-15 {padding-top: 13rem;}
.pt-16 {padding-top: 14rem;}

.bgnokta1 {
	background-image:
	repeating-linear-gradient(112.5deg, var(--bgnokta1) 0px, var(--bgnokta1) 20px,transparent 20px, transparent 22px),
	repeating-linear-gradient(22.5deg, var(--bgnokta1) 0px, var(--bgnokta1) 20px,transparent 20px, transparent 22px),
	linear-gradient(90deg, hsl(168deg 19% 32%),hsl(168deg 19% 32%));
}

.bg-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  background: linear-gradient(to right, #eee 0%, #eee 25%, transparent 25%, transparent 100%);
}
.z-1 {z-index: 1;}
.z-2 {z-index: 2;}
.z-3 {z-index: 3;}
.z-4 {z-index: 4;}
.z-5 {z-index: 5;}
.z-6 {z-index: 6;}

.grayscale1 {filter: grayscale(1);}
.grayscale0 {filter: grayscale(0);}
.t_filter {
	transition: filter 1s ease;
}

.t_images_container {
	width: 80%;
	margin-bottom: 20px;
	position: relative;
	display:none;
}
.t_image {
	width: 70%;
	/*box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.3);*/
	transition: transform 0.5s ease;
}
.t_image {
  position:absolute;
}
.image1 {
	top: -14px;
	right: 70px;
}
.image2 {
	top: 35px;
	left: 54%;
}
.image3 {
	top: 236px;
	left: 35px;
}
.image4 {
	top: 363px;
	left: 210px;
}

#header .header-column {
	align-self: unset;
}

.nav-link {
	color: var(--light);
}