@charset "utf-8";
@import "reset.css";
@import "fonts/stylesheet.css";
/*
.your-style {
    font-family: 'Helvetica Neue';
    font-weight: 300; //Light
	font-weight: normal; //Normal
	font-weight: 500; //Medium
	font-weight: bold; //Bold
    font-style: normal;
}
*/

div, img, table, h1 {transition:width 0.3s, height 0.3s, transform 0.3s;}
@media screen and (min-width:0\0) {div, img, table, h1 {transition:none;}} /* IE için özel */

body {margin:0px; padding:0px; background:#fff; font-family:'Helvetica Neue'; font-size:16px;	color:#000; text-rendering: optimizelegibility;}

*:focus {outline:0;}
* {box-sizing:border-box;}
img {border:none;}

#menubars {display:block; position:absolute; top:40px; right:10px; height:25px; z-index:2000; cursor:pointer;}
.topmenu {display:none !important; transition:0.0s!important; width:420px; backdrop-filter: blur( 4px );}
.topmenu.fade-ready {display:block !important; opacity:0;}
.topmenu:after {display:block; clear:both; content:"";}
.topmenu {position:absolute; top:80px; right:0px; z-index:1500; padding:30px 10px 0 10px; background:rgba(242,242,242,0.8);}
.mlink {
	display:block; font-weight: 500; margin:10px 10px 15px 20px; color:#333;
	font-size:16px; line-height:130%; text-decoration:none; text-align:right; padding:0px 30px 0px 0px;
	background:url(images/point.png); background-size:contain; background-position:right center; background-repeat:no-repeat;
}
.mlink:hover {text-decoration:underline;}

.container {
	background:#fff; width:100%; height:auto; Xborder:1px solid red; position:relative;
	margin:0 auto; position:relative; word-wrap: break-word;
	/*padding-right:110px; padding-left:110px;*/
}
.container:after {display:block; clear:both; content:"";}

.header {
	position:fixed; top:0px; display:block;	width:100%; height:105px;
	background:#eee; z-index:10; box-shadow: 3px 5px 5px 0px rgba(0,0,0,0.14);
}
.header .container2 {/* var öncesi IE için fallback */
	width:90%; Xmax-width:1024px; height:100%; Xoutline:1px solid blue;
	position:relative; margin:0 auto;
}
.headband {background-color:#00B0C7; height:50px;}
.reportname {position:absolute; z-index:0; top:40px; color:#E9322B; font-weight: bold; font-size:20px; width:100%; text-align:center;}
.cizgi {position:absolute; bottom:35px; width:100%; height:2px; background:#1C2D5A;}
.logo {max-width:35%; position:absolute; left:0px; top:20px; z-index:2;}
.fullpdf {position:absolute; right:60px; top:28px;}
.fullpdf img {height:40px;}

.slayts {width:100%; height:100%; background:#fff; position:relative; margin:0 auto; padding:0 0%; clear:both; overflow:hidden; Xoutline:1px solid red;}
.slayt {position:absolute; top:0; left:50%; transform: translate(-50%, 0); Xwidth:70%; height:90%; z-index:100}
.slaytsabit {position:absolute; top:0; left:50%; transform: translate(-50%, 0); width:90%; height:100%; z-index:100; text-align:center;}
.slayt img {width:100%; Xmax-height:100%;}
.slaytsabit {display:block;}
.slaytsabit img {width:90%; max-width:1000px; Xmax-width:80%; Xmax-height:100%;}
.slayttitle {font-weight:bold; font-size:22px; text-align:center; color:#1C2D5A; position:absolute; bottom:5%; left:50%; transform:translate(-50%, 0); z-index:999;}
.harita {z-index:400;}

.section {overflow:hidden;}

.manset {font-size:43px; font-weight:300; text-align:center; color:#002360; line-height:110%; font-size:clamp(20px, calc(2.5vw),42px); width:90%;}
.manset strong {font-weight:700;}

.s1 img {animation: yatay 6s ease-in infinite;}
.s2 img {animation: dikey 6s ease-in infinite;}
.s3 img {animation: rotasyon 9s linear infinite;}
.s4 img {animation: rotasyon 12s linear infinite;}
.slayttitle span {display:block; animation: growing 0.5s linear; animation-delay: 0s; transform-origin: bottom center;}

.b1 {width:100%;}
.b2 {width:20%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
.b3 {width:70%; position:absolute; left:50%; bottom:20%; transform: translate(-50%, 0);}
.b2 img {width:100%;}
.b3 img {width:100%;}
.b2 img {animation: glowing 4s linear infinite;}
.b1 img {animation: rotasyon2 8s linear infinite;}

.c1 {width:100%;}
.c1 img {width:100%;}
.c2 {width:45%; position:absolute; left:-20%; top:50%; transform: translate(0%, -50%);}
.c2 img {width:100%;}
.c3 {width:60%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); z-index:500;}
.c3 img {width:100%;}
.c2 img {animation: rotasyon2 12s linear infinite;}
.c1 {
	animation: anim1 20s Infinite;
	animation-direction: alternate;
	transform-origin: top right;
	animation-timing-function: linear;
}
.d1 {width:100%;}
.d1 img {width:100%;}
.d3 {width:60%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
.d3 img {width:100%;}
.d1 {
	animation: anim1 20s Infinite;
	animation-direction: alternate;
	transform-origin: top right;
	animation-timing-function: linear;
}
.e1 {width:100%;}
.e1 img {width:100%;}
.e3 {width:60%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
.e3 img {width:100%;}
.e1 {
	animation: anim1 20s Infinite;
	animation-direction: alternate;
	transform-origin: top right;
	animation-timing-function: linear;
}

@keyframes dikey {
  0% {transform: translatey(0px);}
  50% {transform: translatey(10px);}
  100% {transform: translatey(0px);}
}
@keyframes yatay {
  0% {transform: translatex(0px);}
  50% {transform: translatex(10px);}
  100% {transform: translatex(0px);}
}
@keyframes rotasyon {
  0% {transform:rotate(0deg);}
  50% {transform:rotate(3deg);}
  75% {transform:rotate(-2deg);}
  100% {transform:rotate(0deg);}
}
@keyframes rotasyon2 {
  0% {transform:rotate(0deg) scale(1);}
  50% {transform:rotate(1deg) scale(1.1);}
  75% {transform:rotate(-1deg) scale(1.2);}
  100% {transform:rotate(0deg) scale(1);}
}
@keyframes growing {
  0% {transform:scale(100%, 0%);}
  100% {transform:scale(100%, 100%);}
}
@keyframes glowing {
  0% {opacity:0.2;}
  20% {opacity:1.0;}
  80% {opacity:1.0;}
  100% {opacity:0.2;}
}
@keyframes anim1 {
	from {transform: scale(1, 1);}
	to {transform: scale(1.15, 1.15);}
}

div[class*="panel"] {margin:40px auto 40px auto; min-height:550px;}
div[class*="panel"] img {max-width:100%;}

.panel1 {background:#20285C; padding:0px 0 0px 0; overflow:hidden;}
.panel2 {background:#0A1B25; padding:0px 0 0px 0; overflow:hidden;}
.panel3 {background:#1C2D5A; padding:20px;}
.panel4 {border-top:1px solid #1C2D5A; border-bottom:1px solid #1C2D5A; padding:20px; padding-bottom:100px!important;}
.panel5 {background:#E5E5E5;}
.panel6 {background:#0A1B25;}
.panel6 p {color:#00B0C7; width:50%; margin-top:60px;}

.ikili {display:flex;}
.ikili1 {flex:1 0 52.5%; position:relative;}
.ikili2 {padding:20px 40px;}

.more {position:absolute; bottom:5rem; right:20%;}
.more a, .more a:visited {text-decoration:none; font-weight:300; color:#fff; background:#002360; padding:5px 15px; border-radius:5px;}
.more a:hover {Xtext-decoration:underline;}

.baslik {color:#000; font-weight:bold; font-size:clamp(15px, calc(2.8vw),40px); text-align:center; line-height:120%; margin:2.5vh auto 2.5vh auto;}
.faaliyetler {display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; align-content:flex-start; margin:0px 15% 10% 15%;}
.faaliyetler h1:not(.bos) {
	display:flex; width:19%; height:clamp(60px, calc(15vh), 100px); margin-bottom:20px; padding:0px 10px 0px 10px;
	justify-content:center; align-items:center; Xoutline:1px solid red; position:relative;
	color:#6D6F71; font-weight: bold; text-align:center; line-height:110%; font-size:clamp(10px, calc(1.3vw), 18px); 
	background-color:#fff; border:4px solid #0DC0DC; overflow:hidden;
}
h1.bos {display:flex; width:19%; height:15vh; margin-bottom:25px;}
.faaliyetler h1:not(.bos):hover:before {position:absolute; top:-50%; left:-60%; z-index:0; content:url(images/anim/c2.png); width:100px; height:100px; opacity:0.5; animation: rotasyon2 8s linear infinite;}
.faaliyetler h1 a {z-index:100; color:inherit; text-decoration:none;}
.faaliyetler h1 a:hover {color:#000;}

a.devam {display:block; margin:20px 0 0px 0; background-color:#1C2D5A; text-align:center; padding:8px 0 8px 0;}
a.devam img {max-width:80%;}
a.pdf {position:absolute; right:0; bottom:20px;}

.footer {background:#00B0C7; text-align:center; font-size:19px; color:#fff; padding:15px 0 15px 0;}

@media (max-width: 900px) {
	.container {margin-left:10px; margin-right:10px; width:calc(100% - 20px);}
	.mobile {display:block;}
	.desktop {display:none;}
	.reportname {top:70px; font-size:12px; width:100%; text-align:left;}
	.logo {max-width:55%; left:0px; top:20px;}
	.mlink {font-size:14px;}
	.slayttitle {font-size:20px; bottom:5%;}
	.slayts {height: auto;}
	.slaytsabit {position:relative; top:auto; left:5%; transform:none;}
	.c1, .d1, .e1 {animation:none;}
	.b2 {width:30%; top:56%;}
	.b3 {width:98%;}
	.c3 {width:90%;}
	.d3 {width:90%;}
	.e3 {width:90%;}
	.faaliyetler h1:not(.bos) {font-weight:300;}
	div[class*="panel"] {margin:40px auto 40px auto; min-height:100px;}
	h2 {font-size:30px;}
	h1 {font-size:16px; margin-bottom:15px;}
	p {font-size:13px; line-height:110%;}
	p.f22 {font-size:15px;}
	a.pdf {bottom:0;}
	a.pdf img {height:40px;}
	.ikili {flex-flow:column;}
	.ikili1 {flex:1 0 100%;}
	.ikili1 img {width:100%; max-width:100%;}
	.ikili2 {padding:10px 20px 30px 20px;}
	.faaliyetler {margin:0px 2% 1% 2%;}
}

@media (min-width: 901px) {
	.container {max-width:1200px;}
	.logo {max-width:38%;}
	.mobile {display:none;}
	.desktop {display:block;}
}