@media only screen and (min-width: 320px) and (max-width: 768px) {

	
	@keyframes grow-progress {
	from {
		transform: scaleX(0);
	}

	to {
		transform: scaleX(1);
	}
}

#progress {
	position: fixed;
	left: 0;
	bottom: 0px;
	width: 100%;
	height: 100vh;
	z-index: -10;
	transform-origin: 0% 0%;
	animation: grow-progress auto linear;
	animation-timeline: --page-scroll;
	background-color: #fff;
}

	body {
		/**
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
        **/
		padding: 0px 0px 0px 0px;
		position: relative !important;
		overflow-x: hidden !important;
		text-shadow: rgba(0, 0, 0, .01) 0 0 1px;
		font-weight: normal;
		overflow: overlay;
		background-color: #000 !important;
		font-family: "Funnel Display", sans-serif !important;
		outline: none !important;
		color: #fff !important;
		-webkit-transition: all 0.2s ease-in-out;
		text-decoration: none;
		margin: 0px !important;
		direction: ltr;
		position: relative;
		text-rendering: optimizeLegibility;
		/* veya optimizeSpeed */
		font-feature-settings: "liga" 0;
		-webkit-font-smoothing: antialiased;
		/* veya subpixel-antialiased */
		font-optical-sizing: auto !important;
	}

	body.dew-no-scroll {
  overflow: hidden;
}


	.banner {
		width: 100%;
		height: 550px;
		overflow: hidden;
		position: relative;
		z-index: 1;
	}

	.main-video {
		position: absolute;
		left: 0px;
		right: 0px;
		top: 0px;
		bottom: 0px;
		width: 100%;
		height: 100%;
		margin: auto;
		object-fit: cover;
	}

	.main-video2 {
		padding: 0px !important;
		margin: 0px !important;
		width: 100%;
		height: 100%;
		margin: auto;
		object-fit: cover;
	}

	.marquee-video {
		padding: 0px !important;
		margin: 0px !important;
		width: 100%;
		height: 100%;
		margin: auto;
		filter: grayscale(1) brightness(0.4);
		position: relative;
		z-index: -1;
		object-fit: cover;
	}


	.header {
		padding: 0px;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		color: white;
		transition: transform 0.5s ease, opacity 0.5s ease;
		z-index: 9998;
	}

	/* Yukarı scroll (görünsün) */
	.header.show {
		opacity: 1;
		transform: translateY(0);
	}

	/* Aşağı scroll (kaybolsun) */
	.header.hide {
		opacity: 0;
		transform: translateY(-100%);
	}


	.logo {
		width: 300px;
		height: 65px;
		background-color: rgba(0, 0, 0, 0.7);
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		background-image: url(../images/idaf-ico.svg);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 90% 90%;
		cursor: pointer;
		transition: 0.1s ease-in-out;
	}

	.logo:active {
		background-size: 88% 88%;
		transition: 0.1s ease-in-out;
	}

	.menu-area {
		width: 100%;
		height: 65px;
		position: relative;
		display: none !important;
		align-items: center;
		justify-content: end;
		background-color: rgba(0, 0, 0, 0.7);
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		border-bottom: 1px solid #333;
		border-left: 1px solid #333;
		padding-left: 20px;
	}


	.main-btn {
		width: auto;
		height: 65px;
		font-size: 20px;
		font-weight: 600;
		color: #000;
		border-right: 1px solid #333;
		padding: 0px 15px 0px 15px;
	}


	.header-glass {
		overflow: hidden;
		background: transparent;
		transition: all 0.25s cubic-bezier(0.34, 1.56, 0.64, 1);
		box-shadow: inset 0 0 0 1px color-mix(in srgb,
				var(--c-light) calc(var(--glass-reflex-light) * 10%),
				transparent),
			inset 1.8px 3px 0px -2px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 90%), transparent),
			inset -2px -2px 0px -2px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 80%), transparent),
			inset -3px -8px 1px -6px color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 60%), transparent),
			inset -0.3px -1px 4px 0px color-mix(in srgb,
				var(--c-dark) calc(var(--glass-reflex-dark) * 12%),
				transparent),
			inset -1.5px 2.5px 0px -2px color-mix(in srgb,
				var(--c-dark) calc(var(--glass-reflex-dark) * 20%),
				transparent),
			inset 0px 3px 4px -2px color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 20%), transparent),
			inset 2px -6.5px 1px -4px color-mix(in srgb,
				var(--c-dark) calc(var(--glass-reflex-dark) * 10%),
				transparent),
			0px 1px 5px 0px color-mix(in srgb,
				var(--c-dark) calc(var(--glass-reflex-dark) * 10%),
				transparent),
			0px 6px 16px 0px color-mix(in srgb,
				var(--c-dark) calc(var(--glass-reflex-dark) * 8%),
				transparent);
		transition: background-color 400ms cubic-bezier(1, 0, 0.4, 1),
			box-shadow 400ms cubic-bezier(1, 0, 0.4, 1);
	}


	.glass-filter {
		position: absolute;
		inset: 0;
		z-index: 0;
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
		filter: url(#liquid-lens);
	}

	.glass-overlay {
		position: absolute;
		inset: 0;
		z-index: 1;
		background: var(--lg-bg-color);
	}

	.glass-specular {
		position: absolute;
		inset: 0;
		z-index: 2;
		border-radius: inherit;
		box-shadow:
			inset 1px 1px 0 var(--lg-highlight),
			inset 0 0 5px var(--lg-highlight);
	}


	.dewcontainer {
		width: 100%;
		height: auto;
		margin: auto;
	}

	.dewcontainer-white {
		width: 100%;
		height: auto;
		margin: auto;
		background-color: #fff;
	}

	h2 {
		font-family: "Funnel Display", sans-serif !important;
		font-size: 40px !important;
		color: #fff !important;
		display: block !important;
		line-height: 45px !important;
		font-weight: 300 !important;
		letter-spacing: -2px !important;
		mix-blend-mode: difference;
	}



	.sticky-top {
		position: sticky;
		top: 100px;
	}

	.main-ico {
		width: 60px;
		margin-bottom: 20px;
		height: auto;
		mix-blend-mode: difference;
		display: block;
	}

	.space {
		width: 100%;
		height: 50px;
	}


	.dewtab-container {
		border-top: 1px solid #000;
		height: auto;
	}

	.dewtab-tabs {
		border-right: 1px solid #000;
		width: 100% !impotant;
	}

	.dewtab-tab {
		font-family: "Funnel Display", sans-serif !important;
		color: #fff;
		mix-blend-mode: difference;
		text-align: center;
		font-weight: 300;
		font-size: 17px;
		display: flex;
		width: 19%;
		display: inline-block;
		letter-spacing: 0px !important;
		align-items: center;
		padding: 20px 0px;
		cursor: pointer;
		transition: background-color 0.3s;
		position: relative;
		overflow: hidden;
		mix-blend-mode: difference;
		transition: 0.2s ease-in-out;
	}

	.dewtab-tab:hover{
		background-color: #fff;
		color: #000;
	}


	.dewtab-contents {
		overflow: hidden;
		background-color: transparent;
		width: 100%;
		height: auto;
		padding: 40px;
		padding: 0px;
		mix-blend-mode: difference;
	}

	.dewtab-content {
		display: none;
	}

	.dewtab-content.dewtab-active {
		display: block;
	}


	.dewtab-contentbox {
		mix-blend-mode: difference;
		width: 100%;
		height: 100% !important;
		position: relative;
	}


	.content-video {
		padding: 0px !important;
		margin: 0px !important;
		width: 100%;
		height: 100%;
		margin: auto;
		object-fit: cover;
	}

	.content-ico {
		font-size: 40px;
		animation: content-ico 2s linear infinite;
		display: block;
		mix-blend-mode: difference;
	}


	.content-title {
		font-family: "Funnel Display", sans-serif !important;
		font-size: 40px;
		color: #fff;
		mix-blend-mode: difference;
		font-weight: 300;
		display: block;
	}


	@keyframes content-ico {
		0% {
			color: rgba(255,255,255,0.4);
			font-variation-settings:
				'FILL' 0,
				'wght' 100,
				'GRAD' -25,
				'opsz' 48;
		}

		50% {
			color: rgba(255,255,255,1);
			font-variation-settings:
				'FILL' 0,
				'wght' 800,
				'GRAD' -25,
				'opsz' 48;
		}

		100% {
			color: rgba(255,255,255,0.4);
			font-variation-settings:
				'FILL' 0,
				'wght' 200,
				'GRAD' -25,
				'opsz' 48;
		}
	}


	.tab-frame {
		width: 100%;
		display: flex;
		height: 100%;
		flex-direction: column;
	}

	.tab-div {
		width: 100%;
		height: 50%;
	}

	.border-top-dew {
		border-top: 1px solid #000;
	}


	.mainmenu-btn {
		font-size: 20px;
		display: inline-block;
		margin-left: 15px;
		margin-right: 20px;
		font-weight: 600;
		color: #000;
		letter-spacing: -0.03vw;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: 0.1s ease-in-out;
		background-repeat: no-repeat;
		background-position: center bottom -10px;
		background-size: 60px;
		background-image: url(../images/menu-bottom.svg);
	}

	.mainmenu-btn:hover {
		background-repeat: no-repeat;
		background-position: center bottom 10px;
		background-size: 30px;
		background-image: url(../images/menu-bottom.svg);
		transition: 0.1s ease-in-out;
	}

	.dew-menu-toggle {
		transition: 0.1s ease-in-out;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 70px;
		height: 100%;
		margin-left: 15px;
		background-size: 35% auto;
		cursor: pointer;
		z-index: 1001;
		color: #000;
	}

	.dew-menu-toggle:hover{
		transition: 0.1s ease-in-out;
		background-color: #000;
	}

	.dew-menu-toggle:hover img {
		transition: 0.1s ease-in-out;
  filter: brightness(0) invert(1);
  transition: filter 0.3s ease;
}

	.dew-dropdown-menu {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background-color: rgba(255,255,255,1);
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		transform: translateY(-100%);
		opacity: 0;
		transition: transform 0.25s ease, opacity 0.25s ease;
		z-index: 99998;
		overflow-y: auto;
	}

	.dew-dropdown-menu.dew-active {
		transform: translateY(0);
		opacity: 1;
	}



	.dew-menu-close {
		z-indeX:9998;
		transition: 0.1s ease-in-out;
		border: none;
		cursor: pointer;
		width: 70px;
		height: 70px;
		background-color: transparent;
		border-left: 1px solid #000;
		border-bottom: 1px solid #000;
		display: flex;
		align-items: center;
		background-color: #fff;
		justify-content: center;
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		filter: brightness(1) invert(0);
	}

	.dew-menu-close:hover{
		transition: 0.1s ease-in-out;
		background-color: #000;
	}

	.dew-menu-close:hover img{
		transition: 0.1s ease-in-out;
  		filter: brightness(1) invert(1);
	}

	.dew-menu-close img{
		transition: 0.1s ease-in-out;
  		filter: brightness(0) invert(0);
	}


	.dew-menu-content {
		padding: 0px;
		position: relative;
		height: 100%;
		overflow: hidden;
	}


	.menu-left{
		width: 100%;
		height: 60vh;
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		background-image: url(../images/menu-img.jpg);
		border-right: 1px solid #000;
		border-bottom:1px solid #000;
	}


	.menu-right{
		width: 100%;
		height: 60vh;
		border-bottom:1px solid #000;
		padding: 0px !important;
	}

	.menu-bottom{
		width: 100%;
		height: 40vh;
		background-color: transparent;
		position: relative;
	}



	.test{
		position: fixed;
		left: 0px;
		right: 0px;
		top: 0px;
		bottom: 0px;
		margin: auto;
		z-index:-1;
		background-color: #fff;
	}

	.dewards-menu-box {
	position: relative;
	width: 100%;
	height: 100%;
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
	padding: 40px !important;
	overflow: hidden; /* arka plan taşmasın */
	
	}

	.dewards-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 0.5s ease; /* fade efekti */
	z-index: 0;
	}

	.dewards-menu-item {
	display: flex;
	height: 12%;
	justify-content: space-between;
	align-items: center;
	font-size: 70px;
	font-weight: 700;
	letter-spacing: -2px;
	cursor: pointer;
	transition: color 0.3s ease;
	z-index: 1; /* yazılar arka planın üstünde */
	position: relative;
	transition: 0.2s ease-in-out;
	background-image: url(../images/menu-arrow.png);
	background-repeat: no-repeat;
	background-position: left -100px center;
	background-size: auto 25%;
	}

	.dewards-menu-box:hover .dewards-menu-item {
	color: rgba(0,0,0,1);
	transition: 0.2s ease-in-out;
	text-shadow: 0px 0px 50px rgba(255,255,255,0.5);
	}

	.dewards-menu-item:hover {
	background-position: left 0px center;
	color: #fff !important;
	padding-left: 50px !important;
	transition: 0.2s ease-in-out;
	}

	.dewards-menu-text {
	pointer-events: none;
	transition: 0.2s ease-in-out;
	}


	.dewmenu-social{
		width: 100%;
		height: 70px;
		border-bottom: 1px solid rgba(0,0,0,.15);
		padding: 0px !important;
	}

	.dewmenu-social-title{
		font-size: 19px;
		font-weight: 700;
		color: #000;
		display: inline-block;
	}

	.dew-social-box{
		width: 60px;
		height: 60px;
		background-color: #fff;
		border:1px solid #000;
		cursor: pointer;
		margin: auto 6px auto 6px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		border-bottom:1px solid rgba(0,0,0,.15);
		transition: 0.1s ease-in-out;
	}

	.dew-social-box:hover{
		background-color: #000;
		transition: 0.1s ease-in-out;
	}

	.dew-social-box:hover img{
		filter: brightness(0) invert(1);
		transition: 0.1s ease-in-out;
	}


	.submenu{
		font-size: 35px;
		color: #000;
		display: block;
		font-weight: 700;
		transition: 0.1s ease-in-out;
	}

	.submenu:hover{
		opacity: 0.6;
		transition: 0.1s ease-in-out;
	}

		.dewards-marquee {
		mix-blend-mode: difference;
		position: absolute;
		left: 0px;
		right: 0px;
		top: 0px;
		overflow: hidden;
		white-space: nowrap;
		width: 100%;
		height: 20vh;         
		display: flex;
		align-items: center;    
		padding: 0;
		}

		.dewards-marquee-content {
		padding-top: 60px;
		display: inline-block;
		animation: dewards-marquee 60s linear infinite;
		}

		.dewards-marquee-content a {
		display: inline-block;
		font-size: 1px;        
		line-height: 1;   
		font-weight: 800;      
		margin: 0 50px;
		text-decoration: none;
		cursor: pointer;
		color: #fff;
		transition: 0.1s ease-in-out;
		letter-spacing: -10px !important;
		}

		/*
		.dewards-marquee:hover .dewards-marquee-content {
		animation-play-state: paused;
		}
		*/

		.dewards-marquee-content a:hover {
		color: transparent;
		-webkit-text-stroke: 2px #fff;
		mix-blend-mode: difference;
		transition: 0.1s ease-in-out;
		}

		@keyframes dewards-marquee {
		0% { transform: translateX(0); }
		100% { transform: translateX(-50%); } 
		}


		.dewards-marquee-2 {
		mix-blend-mode: difference;
		position: absolute;
		left: 0px;
		right: 0px;
		top: 20vh;
		overflow: hidden;
		white-space: nowrap;
		width: 100%;
		height: 20vh;
		display: flex;
		align-items: center;
		padding: 0;
		}

		.dewards-marquee-content-2 {
		padding-top: 60px;
		display: inline-block;
		animation: dewards-marquee-2 60s linear infinite;
		}

		.dewards-marquee-content-2 a {
		display: inline-block;
		font-size: 1px;
		line-height: 1;
		font-weight: 800;
		margin: 0 50px;
		text-decoration: none;
		cursor: pointer;
		color: transparent;
		color: #fff;
		transition: 0.1s ease-in-out;
		letter-spacing: -10px !important;
		}

		/*
		.dewards-marquee-2:hover .dewards-marquee-content-2 {
		animation-play-state: paused;
		}
		*/

		.dewards-marquee-content-2 a:hover {
		color: transparent;
		-webkit-text-stroke: 2px #fff;
		mix-blend-mode: difference;
		transition: 0.1s ease-in-out;
		}

		@keyframes dewards-marquee-2 {
		0%   { transform: translateX(-50%); }
		100% { transform: translateX(0); }
		}



		.main-title{
			mix-blend-mode: difference;
			font-size: 40px;
			color: #fff;
			display: block;
			text-align: center;
			margin-top: 50px;
			border-bottom: 1px solid #fff;
			font-weight: 500;
			letter-spacing: -2px;
		}


		.person-box{
			width: 100%;
			height: auto;
			position: relative;
			transition: 0.1s ease-in-out;
			margin-top: 15px;
			margin-bottom: 20px;
		}


		.person-box-img {
			width: 100%;
			height: 280px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
			clip-path: polygon(
			0 0, 
			calc(100% - 40px) 0, 
			100% 40px, 
			100% calc(100% - 40px), 
			calc(100% - 40px) 100%, 
			0 100%
			);
		}



		.person-title{
			font-size: 28px;
			line-height: 33px;
			font-weight: 600;
			color: #fff;
			letter-spacing: -1px;
			display: block;
			mix-blend-mode: difference;
			transition: 0.1s ease-in-out;
		}

		.person-subtitle{
			font-size: 20px;
			font-weight: 500;
			color: #fff;
			letter-spacing: -0.5px;
			display: block;
			mix-blend-mode: difference;
			transition: 0.1s ease-in-out;
		}

		.person-content{
			width: 100%;
			height: auto;
			margin-top: 10px;
			left: 0px;
			right: 0px;
			bottom: 0px;
			transition: 0.1s ease-in-out;
		}


		.dewspace{
			width: 100%;
			height: 50px;
		}

		.person-cta{
			display: inline-block;
			cursor: pointer;
			width: auto;
			height: auto;
			padding: 15px;
			border: 1px solid #fff !important;
			width: 100%;
			text-align: center;
			font-size: 16px;
			font-weight: 600;
			color: #fff;
			mix-blend-mode: difference;
			background-image: none;
			transition: 0.0s ease-in-out;
		}

		.person-cta:hover{
			background-color: #fff;
			color: #000;
			transition: 0.0s ease-in-out;
		}


		p{
			font-size: 15px !important;
			font-weight: 300 !important;
			letter-spacing: -0.2px !important;
			color: #fff !important;
			mix-blend-mode: difference !important;
			display: block !important;
			line-height: 22px !important;
		}

		.bulten-field{
			margin-top: 15px;
			width: 100%;
			height: auto;
			letter-spacing: -0.6px;
			padding: 15px 25px;
			border: 1px solid rgba(0,0,0,.15);
			font-weight: 600;
			color: #000;
			font-size: 17px;
			font-family: "Funnel Display", sans-serif !important;
		}

		.bulten-field:focus{
			border: 1px solid #000;
			outline: 1px solid #000;
		}


		.bulten-cta{
			margin-top: 15px;
			width: 100%;
			font-weight: 600;
			letter-spacing: -0.6px;
			height: auto;
			padding: 15px 25px;
			border: 1px solid rgba(0,0,0,.15);
			font-size: 17px;
			color: #000;
			text-align: center;
			cursor: pointer;
		}

		.bulten-cta:hover{
			background-color: #000;
			border: 1px solid #000;
			color: #fff;
		}


		.footer{
			padding-bottom: 100px;
			width: 100%;
			height: auto;
			border-top: 1px solid rgba(0,0,0,.15);
		}

		.footer-logo{
			width: 100%;
			height: auto;
			padding: 30px;
		}

		.footer-logo img{
			width: 70%;
			margin: auto;
		}

		.footer-box1{
			width: auto;
			height: auto;
			padding: 30px;
			border-left: 1px solid #000;
			border-right: 1px solid #000;
		}

		.footer-box2{
			width: auto;
			height: auto;
			padding: 30px;
			border-right: 1px solid #000;
		}

		.footer-box3{
			width: auto;
			height: auto;
			padding: 30px;
		}

		.footer-link{
			font-size: 25px;
			font-weight: 700;
			color: #000;
			display: block;
			margin-bottom: 20px;
			letter-spacing: -1px;
			cursor: pointer;
		}

		.footer-link:hover{
			opacity: 0.7;
		}










		
	.hamburger-menu {
		background-color: rgba(0, 0, 0, 0.7);
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		border-radius: 0px;
		padding: 17px 20px 20px 20px;
		position: absolute;
		top: 0px;
		right: 0px;
		position: fixed;
		width: 65px;
		height: 65px;
		cursor: pointer;
		z-index: 99999999998;
		transition: 0.1s ease-in-out;
	}

	.hamburger-menu:active{
		background-color: #fff;
		transition: 0.1s ease-in-out;
	}

	.hamburger-menu.active{
		top: -5px;
		right: 10px;
		transition: 0.1s ease-in-out;
	}

	.hamburger-menu:active span {
		display: block;
		width: 100%;
		height: 3px;
		background-color: #fff;
		margin: 4px 0;
		border-radius: 10px;
		transition: transform 0.3s ease, opacity 0.3s ease;
	}

	.hamburger-menu span {
		display: block;
		width: 100%;
		height: 3px;
		background-color: #fff;
		margin: 4px 0;
		border-radius: 10px;
		transition: transform 0.3s ease, opacity 0.3s ease;
	}

	.side-menu {
		background-color: #fff;
		position: fixed;
		top: 0px;
		left: -100%;
		width: 100%;
		height: 100vh;
		overflow: scroll;
		color: #fff;
		transition: left 0.3s ease-in-out;
		z-index:9999997 !important;
		overflow: hidden;
	}

	.side-menu-content{
		width: 95%;
		overflow: auto;
		height: 100%;
		padding-bottom: 100px;
		position: absolute;
		left:0px;
		righT:0px;
		padding-top: 0px;
		top: 40px !important;
		margin: auto;
	}

	.side-menu ul {
		list-style: none;
		padding: 0;
	}

	.side-menu ul li {
		padding: 10px 20px;
	}

	.side-menu ul li a {
		color: #fff;
		text-decoration: none;
	}

	.side-menu ul li a:hover {
		text-decoration: underline;
	}

	.close-btn {
		background-color: #1a431e;
		position: absolute;
		top: 15px;
		right: 15px !important;
		border: none;
		font-weight: 100;
		color: white;
		z-index:9999998;
		font-size: 20px;
		line-height: 0px;
		cursor: pointer;
		display: inline-block;
		transition: 0.1s ease-in-out;
		padding: 10px;
		border-radius: 15px;
	}

	.close-btn:active{
		background-color: #0CA19B;
	}


	.close-btn-text{
		font-size: 12px;
		font-weight: 400;
		margin-left: 10px;
		color: #fff;
		display: inline-block;
	}

	.menu-open .hamburger-menu span:nth-child(1) {
		transform: rotate(45deg) translate(5px, 5px);
	}

	.menu-open .hamburger-menu span:nth-child(2) {
		opacity: 0;
	}

	.menu-open .hamburger-menu span:nth-child(3) {
		transform: rotate(-45deg) translate(5px, -5px);
	}

	.menu-open #side-menu {
		left: 0px !important;
		top: 0px !important;
		opacity: 1;
	}


	.mob-menu-26{
		width: 100%;
		height: auto;
		border: 1px solid rgba(255,255,255,.35);
		background-color: #000;
		display: flex;
		margin-bottom: 10px;
	}

	.mob-menu-text-26{
		width: calc(100% - 60px);
		padding-left: 30px;		
		display: flex;
		color: #fff;
		flex-direction: column;
		justify-content: center; 
	}

	.mob-menu-ico-26{
		width: 60px;
		height: 60px;
		border-right: 0.3px solid rgba(255,255,255,.55);
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		font-size: 25px;
		font-variation-settings:
				'FILL' 0,
				'wght' 400,
				'GRAD' -25,
				'opsz' 48;
	}

	.mob-menu-content-text-26{
		color: #fff;
		font-size: 18px;
		font-weight: 600;
		display: block;
	}


	.mob-menu{
		width: 100%;
		height: auto;
		border: 1px solid rgba(0,0,0,.15);
		display: flex;
		margin-bottom: 10px;
	}

	.mob-menu:active{
		background-color: #000;
	}

	.mob-menu:active .mob-menu-ico{
		color: #000;
		background-color: #ececec;
		border-right: 1px solid #fff;
		font-variation-settings:
				'FILL' 1,
				'wght' 400,
				'GRAD' -25,
				'opsz' 48;
	}


	.mob-menu-ico{
		width: 60px;
		height: 60px;
		border-right: 0.3px solid rgba(0,0,0,.15);
		display: flex;
		align-items: center;
		justify-content: center;
		color: #000;
		font-size: 25px;
		font-variation-settings:
				'FILL' 0,
				'wght' 400,
				'GRAD' -25,
				'opsz' 48;
	}


	.mob-menu-text{
		width: calc(100% - 60px);
		padding-left: 30px;		
		display: flex;
		flex-direction: column;
		justify-content: center; 
	}

	.mob-menu-content-text{
		color: #000;
		font-size: 18px;
		font-weight: 600;
		display: block;
	}

	.mob-menu-subtext{
		font-size: 13px;
		font-weight: 500;
		display: block;
		color: #000;
	}

	.mob-menu:active .mob-menu-subtext{
		color: #fff;
	}

	.mob-menu:active .mob-menu-content-text{
		color: #fff;
	}

	.mob-line-title{
		font-size: 13px;
		font-weight: 600;
		letter-spacing: 2px;
		color: #000;
		display: block;
		margin-bottom: 10px;
	}


	.mob-menu2{
		width: 100%;
		height: auto;
		border: 1px solid rgba(0,0,0,.15);
		display: flex;
		margin-bottom: 10px;
	}

	.mob-menu2:active{
		background-color: #000;
	}

	.mob-menu2:active .mob-menu-ico2{
		background-color: #ececec;
	}

	.mob-menu2:active .mob-menu-content-text2{
		color: #fff;
	}

	.mob-menu-ico2{
		width: 40px;
		height: 40px;
		border-right: 1px solid rgba(0,0,0,.15);
		display: flex;
		align-items: center;
		justify-content: center;
		color: #000;
		font-size: 17px !important;
		font-variation-settings:
				'FILL' 0,
				'wght' 600,
				'GRAD' -25,
				'opsz' 48;
	}

	.mob-menu-content-text2{
		color: #000;
		font-size: 14px;
		font-weight: 600;
		display: block;
	}


	.dewnav{
		width: 100%;
		height: 70px;
		background-color: rgba(255, 255, 255, 0.9);
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		position: fixed;
		left: 0px;
		right: 0px;
		bottom: 0px;
		z-index:99989;
	}

	.dewnav-btn{
		width: 100%;
		height: 70px;
		text-align: center;
		border: 1px solid transparent;
	}

	.dewnav-btn:Active{
		transform: scale(0.9);
		border: 1px solid #000;
	}

	.dewnav-btn-ico{
		width: 100%;
		height: auto;
		padding-top: 10px;
		text-align: center;
	}

	.dewnav-btn-ico img{
		width: 22%;
	}

	.dewnav-btn-text{
		width: 100%;
		height: auto;
		padding-top: 5px;
		text-align: center;
		font-size: 11px;
		color: #000;
		font-weight: 700;
		display: block;
	}
	




	.content-banner-space{
			width: 100%;
			height: 100px;
		}


		.whitebg{
			width: 100%;
			height: auto;
			background-color: #fff;
		}


		.inner-title{
			font-size: 70px;
			font-weight: 800;
			letter-spacing: -3px;
			text-align: center;
			color: #000;
			display: block;
			line-height: 75px;
		}

		.content-border{
			border-bottom: 1px solid rgba(0,0,0,.15);
			border-top: 1px solid rgba(0,0,0,.15);
		}
		
		.content-border-right{
			border-right: 1px solid rgba(0,0,0,.15);
		}

		.content-border-bottom{
			border-bottom: 1px solid rgba(0,0,0,.15);
		}

		.event-date-area{
			font-size: 20px;
			font-weight: 600;
			color: #000;
		}

		.event-date-area-sub{
			font-size: 12px;
			font-weight: 900;
			letter-spacing: 2px;
			color: rgba(0,0,0,.5);
			display: block;
		}
		
		.event-date-area-ico{
			position: relative;
			color: rgba(0,0,0,.5);
			display: inline-block;
			font-size: 14px;
			top: 3px;
			margin-right: 10px;
			font-variation-settings:
				'FILL' 0,
				'wght' 500,
				'GRAD' -25,
				'opsz'48;
		}


		.event-slogan{
			width: 100%;
			font-size: 19px;
			font-weight: 400;
			color: #000;
			line-height: 27px;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			margin: auto;
			text-align: center;
			gap: 10px;
		}

		.event-slogan-ico{
			margin-right: 5px;
			animation: backBounce 1.5s ease-in-out infinite;
			font-size: 21px;
			font-variation-settings:
				'FILL' 0,
				'wght' 500,
				'GRAD' -25,
				'opsz'48;
		}

		@keyframes backBounce {
			0%   { transform: translateX(0); }
			20%  { transform: translateX(-5px); }
			40%  { transform: translateX(3px); }
			60%  { transform: translateX(-3px); }
			80%  { transform: translateX(2px); }
			100% { transform: translateX(0); }
		}

		.event-sticky{
			position: sticky;
			top: 30px;
		}


		.event-content-title{
			font-size: 27px;	
			line-height: 35px;
			font-weight: 700;
			color: #000;
			display: block;
			margin-bottom: 20px;
		}


		.event-fit-img{
			object-fit: cover;
		}

		.breathing-img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			animation: breathe 7s ease-in-out infinite;
			}

			@keyframes breathe {
			0%, 100% {
				transform: scale(1);
			}
			50% {
				transform: scale(1.1);
			}
		}

		.event-cta{
			padding: 10px 10px;
			font-weight: 500;
			font-size: 13px;
			margin: auto;
			color: #000;
			border: 1px solid rgba(0,0,0,.15);
			background-color: #fff;
			display: inline-block;
			margin-top: 30px;
			cursor: pointer;
			display: inline-flex;
			align-items: center;
			gap: 10px;
			transition: 0.1s ease-in-out;
		}

		.event-cta-ico{
			font-size: 20px;
			transition: 0.1s ease-in-out;
			font-variation-settings:
				'FILL' 0,
				'wght' 500,
				'GRAD' -25,
				'opsz'48;
		}

		.event-cta:hover{
			transition: 0.1s ease-in-out;
			background-color: #000;
			color: #fff;
		}

		.event-cta:hover .event-cta-ico{
			transition: 0.1s ease-in-out;
			font-variation-settings:
				'FILL' 0,
				'wght' 500,
				'GRAD' -25,
				'opsz'48;
		}

		.sanal-frame{
			width: 100%;
			height: 300px;
		}


		.art-box-img{
			width: 100%;
			height: 400px;
			left: 0px;
			right: 0px;
			top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
		}

		.sergi-box-img{
			width: 100%;
			height: 350px;
			left: 0px;
			right: 0px;
			top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
		}

		.sergi-box-img:hover{
			transition: 0.1s ease-in-out;
			filter:contrast(1.5);
		}

		.arts-content{
			width: 100%;
			height: auto;
			margin-top: 20px;
			left: 0px;
			right: 0px;
			bottom: 0px;
			transition: 0.1s ease-in-out;
		}


		.content-main-title {
			font-size: 40px;
			color: #000;
			line-height: 45px;
			display: block;
			font-weight: 700;
			text-align: center;
			letter-spacing: -2px;
			position: relative;
		}



		.artist-box{
			width: 100%;
			height: auto;
			margin-bottom: 50px;
			position: relative;
			transition: 0.1s ease-in-out;
		}


		.sponsor-logo-area{
			width: 100%;
			height: auto;
			box-shadow: 0px 0px 40px rgba(0,0,0,.05);
			margin-bottom: 35px;
		}

		.sponsor-logo-area img{
			transform: scale(0.7);
			width: 100%;
			margin: auto;
			text-align: center;
			filter: grayscale(1);
			transition: 0.1s ease-in-out;
		}

		.sponsor-logo-area:hover img{
			transform: scale(0.76);
			filter: grayscale(0);
			transition: 0.1s ease-in-out;
		}


			
		.sub-box{
			width: 100%;
			height: auto;
			padding-top: 100%;
			position: relative;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			cursor: pointer;
			background-color: #fff;
			transition: 0.1s ease-in-out;
			margin-bottom: 20px;
		}

		.sub-box-overlay{
			position: absolute;
			top: 0px;
			left: 0px;
			right: 0px;
			bottom: 0px;
			background-color: rgba(255,255,255,.5);
			z-index:90;
			backdrop-filter: invert(70%) saturate(80%);
			-webkit-backdrop-filter: invert(70%) saturate(80%);
			transition: 0.1s ease-in-out;
		}

		.sub-box:hover .sub-box-overlay{
			background-color: rgba(255,255,255,0.5);
			backdrop-filter: invert(0%) saturate(260%);
			-webkit-backdrop-filter: invert(0%) saturate(260%);
			transition: 0.1s ease-in-out;
		}

		.sub-box-btn{
			z-index:99;
			position: absolute;
			left: 0px;
			bottom: 0px;
			padding: 10px 10px;
			font-size: 13px;
			font-weight: 500;
			color: #000;
			background-color: rgba(255, 255, 255, 0);
			backdrop-filter: blur(15px);
			-webkit-backdrop-filter: blur(15px);
			display: inline-flex;
			align-items: center;
			gap: 5px;
		}


		.sub-box-ico{
			font-size: 16px;
			font-variation-settings:
				'FILL' 1,
				'wght' 700,
				'GRAD' -25,
				'opsz' 48;
		}


		.detail-title{
			font-size: 40px;
			font-weight: 700;
			letter-spacing: -1px;
			color: #000;
			display: block;
			line-height: 45px;
			text-align: center;
		}


			
		.detail-banner{
			width: 100%;
			height: 300px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
		}


		.content-panel-title{
			font-size: 20px;
			font-weight: 600;
			color: #000;
			display: block;
			line-height: 25px;
			letter-spacing: -0.5px;
			text-align: center;
		}

		.content-panel-subtitle{
			font-size: 17px;
			font-weight: 700;
			letter-spacing: -0.5px;
			color: rgba(0,0,0,.6);
			display: block;
			line-height: 22px;
			margin-top: 5px;
			text-align: center;
		}


		.panel-title{
			font-size: 20px;
			font-weight: 700;
			line-height: 25px;
			color: #fff;
			letter-spacing: -0.5px;
			display: block;
			mix-blend-mode: difference;
			transition: 0.1s ease-in-out;
		}

		.panel-subtitle{
			font-size: 17px;
			font-weight: 500;
			color: #fff;
			letter-spacing: -0.5px;
			display: block;
			mix-blend-mode: difference;
			transition: 0.1s ease-in-out;
		}

		.panel-box-img{
			width: 100%;
			height: 200px;
			left: 0px;
			right: 0px;
			top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
		}

		.panel-box-img:hover{
			transition: 0.1s ease-in-out;
			filter:contrast(1.5);
		}


		.soylesi-box-img{
			position: relative;
			width: 100%;
			height: 250px;
			left: 0px;
			right: 0px;
			top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
		}

		.soylesi-box-img:hover{
			transition: 0.1s ease-in-out;
			filter:contrast(1.5);
		}

		.soylesi-box-img-time{
			position: absolute;
			left: 0px;
			padding: 10px 20px;
			bottom: 0px;
			font-size: 15px;
			color: #000;
			font-weight: 600;
			background-color: rgba(255, 255, 255, 0.7);
			backdrop-filter: blur(15px);
			-webkit-backdrop-filter: blur(15px);
		}

		.atolye-box-img{
			position: relative;
			width: 100%;
			height: auto;
			padding-top: 100%;
			left: 0px;
			right: 0px;
			top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
		}

		.panel25-box-img{
			position: relative;
			width: 100%;
			height: auto;
			padding-top: 125%;
			left: 0px;
			right: 0px;
			top: 0px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
			transition: 0.1s ease-in-out;
		}


		


	.modal-close{
		opacity: 1 !important;
		background-color: transparent;
		overflow: hidden;
		width: calc(100% - 20px);
		height: 50px;
		position: absolute !important;
		left:0px;
		right: 0px;
		background-color: #000;
		padding: 10px;
		bottom: 10px;
		margin: auto;
		transition: 0s;
		z-index: 999999911 !important;
		cursor: pointer;
		transform: scale(1);
		background-image: url(../images/close-02.svg);
		background-size: auto 65%;
		background-repeat: no-repeat;
		background-position: center center;
		transition: 0.1s ease-in-out;
	}

	.modal{
		z-index:99999998989 !important;
	}
	
	.modal-close:hover{
		transform: scale(1.1);
		transition: 0.1s ease-in-out;
	}
	
	.modal-close:active{
		transform: scale(1);
		transition: 0.1s ease-in-out;
	}
	
	
	.modal-qr{
		margin: auto;
		left: 0px;
		right: 0px;
		max-width: 100% !important;
	  }
	
	
	  .modal-dialog{
		margin: auto !important;
		
	  }
	
	
	.modal-content{
	  outline: 1px solid rgba(255,255,255,0) !important;
	  position: relative;
	  border: none !important;
	  overflow: hidden;
	  margin: 10px !important;
	  padding: 25px 10px 60px 10px !important;
	  height: auto !important;
	  background-color: #f4f2f8 !important;
	  width: 100% !important;
	  pointer-events: auto;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	  border-radius:0px !important;
	  z-index:98989434389 !important;
	  }
	
	
		.show{
		height: auto !important;
		margin: 0px !important;
		background-color: rgba(0,0,0,.0);
		backdrop-filter: blur(50px) saturate(100%);
		-webkit-backdrop-filter: blur(50px) saturate(100%);
		z-index:9999996 !important;
		}
	
		.modal-backdrop{
		display: none !important;
		}
	
		body.modal-open {
		overflow: hidden;
		z-index:9998 !important;
		}
	
		.modal-backdrop.show{
		z-index:998 !important;
		opacity: 0 !important;
		}


		.modalimg{
			width: 100%;
			height: 250px;
			margin-bottom: 10px;
			background-repeat: no-repeat;
			background-position: center center;
			background-size: cover;
		}

		.opencall-cta{
			display: none;
		}

}