a:link {
    color: red;
  }
  
  /* visited link */
  a:visited {
    color: green;
  }
  
  /* mouse over link */
  a:hover {
    color: hotpink;
  }
  
  /* selected link */
  a:active {
    color: blue;
  }
.port {
	padding: 5%;
}
.gallery-item {
	position: relative;
	box-shadow: 0 5px 10px 1px rgba(0, 0, 0, 0.5);
}
/* overlay */

.gallery-item img {
	width: 100%;
}
.gallery-item .overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.9);
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 20px;
	z-index: 1;
	opacity: 0;
	transition: opacity 0.5s ease;
}
.gallery-item:hover .overlay {
	opacity: 1;
}
.gallery-item .overlay h3 {
	font-size: 24px;
	margin-bottom: 10px;
}
.gallery-item .overlay p {
	font-size: 16px;
	margin-bottom: 20px;
}
.gallery-item .overlay .btn {
	font-size: 16px;
}
.modal {
	background: rgba(0, 0, 0, 0.8);
}
@media (max-width: 991px) {
	.gallery-item {
		margin-bottom: 30px;
	}
}
/* Image Gallery*/
.row {
    margin-top: 20px; /* Her satırın üstüne boşluk ekler */
  }
  .row:first-child {
    margin-top: 0; /* İlk satırın üst boşluğunu kaldırır */
  }
  /* Image Gallery*/

  /* Dropdown menüdeki öğelerin yazı rengini siyah yap */
  .dropdown-item {
    color: black !important; /* Varsayılan renk siyah */
  }

  /* Üzerine gelindiğinde (hover) rengi siyah kalsın */
  .dropdown-item:hover {
    color: black !important; /* Hover'da da renk siyah */
    background-color: rgba(0, 0, 0, 0.1); /* İsteğe bağlı: arka plan hafif gri olabilir */
  }

  
  .tooltip-text {
	visibility: hidden;
	position: absolute;
	background-color: #555;
	color: #fff;
	text-align: center;
	border-radius: 5px;
	padding: 5px;
	z-index: 1;
	opacity: 0;
	transition: opacity 0.3s;
}

.show-tooltip:hover .tooltip-text {
	visibility: visible;
	opacity: 1;
}

.card-text {
	display: inline-block;
	width: 100%;
}

.tooltip-container {
	position: relative;
	display: inline-block;
	cursor: pointer;
	color: blue;
	text-decoration: underline;
}

.modal-dialog {
	max-width: 60%; /* Modal genişliğini artır */
	max-height: 60%; /* Modal yüksekliğini artır */
  }
  
	.modal-content {
		position: relative;
		background-color: transparent; /* Modal içeriği arka planı şeffaf */
		border: none; /* Kenarlıkları kaldır */
	}
	
	.close-button {
	  position: absolute;
	  top: 10px;
	  right: 10px;
	  font-size: 24px;
	  color: white;
	  cursor: pointer;
	  z-index: 1050;
	  background-color: rgba(0, 0, 0, 0.5);
	  width: 40px;  /* Sabit genişlik */
	  height: 40px; /* Sabit yükseklik */
	  border-radius: 50%; /* Tam yuvarlak */
	  display: flex;
	  justify-content: center;
	  align-items: center; /* Hem yatay hem dikeyde ortalamak */
	  line-height: 0; /* İkonu tam ortalamak için */
  }
	.nav-button {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		font-size: 24px;
		color: white;
		background-color: rgba(0, 0, 0, 0.5);
		border: none;
		cursor: pointer;
		padding: 10px;
		z-index: 10;
	}
  
	.nav-button.left {
		left: 10px;
	}
  
	.nav-button.right {
		right: 10px;
	}
   
	.port {
		padding: 0;  /* Üst ve alt boşlukları sıfırlamak için */
		margin-top: 60px; /* Üst tarafa 10px boşluk ekler */
		display: flex;
		justify-content: center;  /* Yatayda ortalamak için */
		align-items: flex-start;  /* Üst tarafa yaslamak için */
		height: auto;  /* Yükseklik sabit değilse */
	  }
	  
	  .container {
		width: 100%;
		padding: 10;
		margin-top: 60px; /* Üst tarafa 10px boşluk ekler */
	  }
		.gallery-item {
			position: relative;
			box-shadow: 0 5px 10px 1px rgba(0, 0, 0, 0.5);
		}
		/* overlay */
		.gallery-item img {
			width: 100%;
		}
		.gallery-item .overlay {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.4);
			color: #fff;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			text-align: center;
			padding: 20px;
			z-index: 1;
			opacity: 0;
			transition: opacity 0.5s ease;
		}
		.gallery-item:hover .overlay {
			opacity: 1;
		}
		.gallery-item .overlay h3 {
			font-size: 24px;
			margin-bottom: 10px;
		}
		.gallery-item .overlay p {
			font-size: 16px;
			margin-bottom: 20px;
		}
		.gallery-item .overlay .btn {
			font-size: 16px;
		}
		.modal {
			background: rgba(34, 33, 33, 0.9);
		}
		@media (max-width: 991px) {
			.gallery-item {
				margin-bottom: 30px;
			}
		}
		
		/* Body ve html boyutunu tam ekran yap */
html, body {
	height: 100%;
	margin: 0;
	display: flex;
	flex-direction: column;
  }
  
  /* İçerik kısmını esnek tut */
  .container {
	flex: 1;
  }
  
  /* Footer'ı en alta sabitle */
  #Footer {
	margin-top: auto;
  }