@import url("css/uploadifive.css");
@import url("css/jquery.fancybox.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/Swiper/5.3.7/css/swiper.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css");
@import url("css/material-design-color-palette.min.css");
@import url("js/tour/css/bootstrap-tour.min.css");
@import url("https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css");
@import url('https://fonts.googleapis.com/css?family=Poppins:400,400i,500,500i,600,600i,700,700i&display=swap&subset=latin-ext');
@import url("https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css");

body{font-family: "Poppins", sans-serif; background:#f6fbfe; background: linear-gradient(180deg,#fff,#f7f7f7); }
.fotorama__stage{background: #fff; box-shadow:0 5px 15px rgba(0,0,0,.2); }
.fotorama--fullscreen .fotorama__nav, 
.fotorama--fullscreen .fotorama__stage{background: #fff !important;}
.makaleDetayResmi{border:solid #eee 2px; border-radius:5px;}
/* Sticky footer styles
-------------------------------------------------- */
html { position: relative; min-height: 100%; margin:0px !important;}
body { padding-bottom: 60px; background-color: #f6fbfe; }
footer{ position: absolute; bottom: 0; width: 100%; height: 60px; line-height: 20px; background-color: #485b67; font-size:12px;}

body > .container { padding: 30px 15px 0;}
footer > .container { padding-right: 15px; padding-left: 15px; color:#b0b8bd; padding-top: 15px;}
.copyright{display: block; float: right;}

.header{padding:20px 30px; transition:.25s ease-in-out}
.header .nav-item{margin:0 0 0 30px;padding:0; display:inline-block;position:relative;}
.header .nav-item:hover:after{width:100%}
.header .nav-item::after{display:block;height:1px;width:0;left:0;right:0;position:absolute;bottom:-2px;content:"";background:white;transition:.5s}
.header .nav-link:hover,
.header .nav-link{display: block; color:white !important; transition:color 150ms ease; padding:0px !important;}
.header .nav-link.active{ font-weight:bold;}
.header.scrollHeader{background: white; padding:10px 20px;transition:.25s ease-in-out}
.header.scrollHeader .nav-link:hover,
.header.scrollHeader .nav-link{color:black !important;}
.header.scrollHeader #menuIcon { top:30px; right:20px; }
.header.scrollHeader #menuIcon span{background:#00839b !important;}


.SayfaSerit{position: relative; background-size: auto 100% !important; background-position:top  !important; height: 300px;}
.SayfaSerit h1{position: absolute;  bottom: 0px;  display: inline-block; font-weight: bold !important; color:#fff; text-transform: uppercase; font-size:36px; }



.mainbody{position:relative; display:block; margin: 100px 0 0 0; z-index: 0 !important;}
code { font-size: 80%; }
.weblink{text-align: right;}
/*#resim[type="file"]{display:none; margin:0;}*/
.resim-onizleme{border:solid #eee 2px; width:100%; height:150px; line-height:150px; text-align:center; margin-bottom:10px; overflow:hidden;}
.file-info{display:block; margin-bottom:10px;}

.custom-file-control:lang(tr)::after {content: "Dosya Seçin...";}
.custom-file-control:lang(tr)::before {content: "Gözat";}
.custom-file-control.selected:lang(tr)::after {content: "" !important;}


.custom-file-name:after {content: attr(data-content) !important;}
.custom-file-name:before {content: 'Gözat' !important;}
.dondur{position:absolute; top:10px; right:10px; z-index:5;}
.resim-onizleme{position:relative; display:block; width:265px; height:200px; text-align:center; border:solid #eee 1px; overflow:hidden; line-height:200px;}
.custom-file-label[data-label]::after { content: attr(data-label); }


.bg-faded{border:none !important;}
.card:hover{  animation-play-state: running;}

p{white-space: pre-line;}
.navbar .dropdown-menu-right{right: 0 !important; left: auto !important;}

p{white-space: pre-line;}
.navbar .dropdown-menu-right{right: 0 !important; left: auto !important;}
.text-gold{color: #fecc68;}
.text-gold:hover{color: #d6ab54;}


.translation-links .dropdown-menu li,
.translation-links .dropdown-menu a{ color:#333 !important; display:block !important; width:100% !important;}
.translation-links .dropdown-menu li:hover,
.translation-links .dropdown-menu li.active{background:#efefef !important; color:#333 !important; display:block !important;}
.translation-links .dropdown-menu a i{ margin-right:5px;}

.text-limiter{width:60%;}
.ellipsis{white-space: nowrap;  text-overflow: ellipsis; }
.note-popover{display:none;}
a:hover{text-decoration: none; cursor:pointer;}
.topmenu {background:#5c6b78; }
.topmenu ul{margin: 0; padding: 0; list-style: none; }
.topmenu .row div:nth-child(2) ul{float:right; }
.topmenu li{display: inline-block;}
.topmenu li a{display: block; color: #fff; padding: 10px 15px; font-size: 14px;}
.topmenu li a:hover{background:rgba(255,255,255,.2); }
.topmenu li a i{display: inline-block; font-size: 18px; vertical-align: middle;} 

.navbar-nav{color:#6f8398; font-weight: bold;}
.navbar-nav .active > .nav-link{color:#133476 !important;}

.sitelerSlider{margin: 0;}
.sitelerSlider .carousel-item{height: 850px;}

.SolAltIconlar{left: 25px; }
.SagAltIconlar{right: 25px;}
.SolAltIconlar, .SagAltIconlar{position: fixed; bottom: 25px; visibility: visible; background-color: transparent; margin:0; padding:0; list-style:none; z-index: 200000 !important; }
.SolAltIconlar li, .SagAltIconlar li{position: relative; display:block; margin-top: 20px; }
.animatedFixed{ width: 50px; height: 50px; display:inline-block; cursor: pointer;transform-origin: center;}
.animatedFixed > .wiconWrap {width: 60px; height: 60px; top: 0; left: 0; position: absolute; transition: all 0.2s ease-in-out; border-radius: 100%; border: 2px solid transparent; transition: all .5s;}
.animatedFixed > .wicon {width: 40px; height: 40px; top: 10px; left: 10px; position: relative; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: 2px solid transparent; transition: all 0.2s ease-in-out; transform-origin: 50% 50%;}
.animatedFixed > .wicon i{color:#fff; position:absolute; top:9px; left:9px; transform-origin: 50% 50%;}

.animatedFixed.whatsapp > .wiconWrap {background:rgba(79, 206, 93,.5);}
.animatedFixed.whatsapp > .wicon {background:rgb(79, 206, 93);} 

.animatedFixed.phone > .wiconWrap {background:rgba(18, 120, 255,.5);}
.animatedFixed.phone > .wicon {background:rgb(18, 120, 255);} 


.altserit{ background:linear-gradient(to left,  #39a45cff 0px, #39a45cbb 50%,  #39a45cff 100%), url('images/altserit.png') no-repeat center center; padding: 20px;}
.altserit .container{position: relative;}
.altserit a.bilgialmakistiyorumBtn{display: block; position: absolute; left:41%; top:30%; z-index: 2; transform-origin: 50%;}
.altserit .row > div.box1,
.altserit .row > div.box2
{background-repeat: no-repeat; text-align: center; color: #fff; text-shadow:2px 2px 10px rgba(70,70,70,.7);}
.altserit .row > div small{display: block; font-size: 22px; margin-top: 8px;}
.altserit .row > div b{display: block; font-size: 30px;}
.altserit .row > div:first-child {line-height: 30px; padding-top: 10px;}
.altserit .row > div:first-child b{display: block; font-weight: bold; font-size: 40px; margin-left: -130px;}
.altserit .row > div:first-child small{display: block; font-weight: bold; font-size: 30px; margin-left: 0px;}
.altserit .row > div:last-child small{display: block; font-size: 23px;}

.kategorilerBg{background: #39a45c;}

.hosgeldiniz{padding: 100px 10px; color: #6f8398;}
.hosgeldiniz h1, .hosgeldiniz h2{ font-weight: bold;}
.hosgeldiniz h1{font-size: 24px; color: #5c6b78;}
.hosgeldiniz h2{font-size: 18px; color: #133476; margin-bottom: 40px;}


.ekiplerBar{padding:30px 0; text-transform: uppercase; color:#fff; background:linear-gradient(to left,  rgb(19, 52, 118,.8) 0px, rgb(19, 52, 118,.8) 100%), url('images/referanslar.gif') no-repeat top center; background-size: 100% auto;}

.swiper-button-next,
.swiper-button-prev{color: #fff; top:260px !important;}
.swiper-pagination-bullet{background-color: #fff;}
/*.swiper-slide .resim{ height: auto; width: auto;}*/
.swiper-container{padding-top: 30px; padding-bottom: 30px;}
.swiper-wrapper{padding-top: 30px; padding-bottom: 50px; }
.swiper { width: 100%; height: 100%;}
.swiper-slide { text-align: center; font-size: 18px; height: 300px; display: flex; justify-content: center; align-items: center; }
.swiper-slide .resim { display: block; width: 100%; height: 100%; object-fit: cover; overflow: hidden; border-radius: 5px; box-shadow: 5px 5px 10px rgba(0,0,0,.2);}
.swiper-slide .resim img{ display: block; width: 100%; height: 100%; object-fit: cover; }
.swiper-slide::after{ content: attr(data-baslik); display: inline-block; position: absolute; top:100%; color: #fff; padding: 5px; 
	/*white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 200px;*/
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.makaleguruplari {padding: 70px 0 30px 0;}
/*.makaleguruplari h3{color: #6f8398; font-size: 18px; position: relative; margin-bottom: 30px;}
.makaleguruplari h3 span{background: #f6fbfe; padding-right: 10px; font-weight: bold; z-index: 2; position: relative; text-transform: uppercase;}
.makaleguruplari h3:before{content:""; position:absolute; bottom:10px; left:0; right:0; height:2px; background: #133476; z-index: 0;}*/
.makaleguruplari .row > div{margin-bottom:30px; }
.makaleguruplari .row > div .resim{position:relative;  display: block; height: 250px; border-radius: 3px; box-shadow:0px 2px 5px rgba(0,0,0,0.2);transition: .3s all ease; overflow: hidden; background-size: 100% auto;}
.makaleguruplari .row > div .resim:hover{ box-shadow:0px 5px 25px rgba(0,0,0,0.4); transform: scale(1.02) ; transition: .3s all ease;}
.makaleguruplari .row > div .resim::before{position: absolute; content: ""; display: block; width: 100%; top:0px; left:0; top:0; bottom:0; z-index: 0; background:linear-gradient(to top, rgb(19, 52, 118,.3) 30%, rgb(19, 52, 118,.7) 100%);}
.makaleguruplari .row > div .resim h1{position: absolute; bottom: 10px; left: 10px; right: 10px; font-size:24px; padding: 5px 10px; background: #46a465; color: #fff;  border-radius: 3px; box-shadow:0px 2px 5px rgba(0,0,0,0.2); z-index: 1; }

.referanslar .resim {display:block; height:200px; margin-bottom:30px; border-radius: 3px; box-shadow:0px 2px 5px rgba(0,0,0,0.2); transition: .3s all ease; }
.galeri .resim {display:block; height:350px; margin-bottom:30px; border-radius: 3px; box-shadow:0px 2px 5px rgba(0,0,0,0.2); transition: .3s all ease; }

.makalelistesi div a{position: relative; display:block; height: 200px; color: #fff; border-radius: 3px; box-shadow:0px 2px 5px rgba(0,0,0,0.2);transition: .3s all ease; overflow: hidden; background-size: 100% auto;}
.makalelistesi div a:before{content:""; position: absolute; background:linear-gradient(to bottom, rgb(220, 53, 69,0) 30%, rgb(19, 52, 118,.8) 100%); top:0; left:0; bottom:0; right:0; z-index:1;}
.makalelistesi div a:hover{ box-shadow:0px 5px 25px rgba(0,0,0,0.4); transform: scale(1.02); transition: .3s all ease;}
.makalelistesi div a .resim{display:block; height: 100%; transition: .3s all ease; z-index:0;}
.makalelistesi div a:hover .resim{display:block; height: 100%; transform: rotate(10deg) scale(1.2); transition: .5s all ease;}
.makalelistesi div a b{position: absolute; left: 0; right: 0; bottom:0; padding:10px; z-index:3;}

.ekiplistesi div a{position: relative; display:block; height: 300px; color: #fff; border-radius: 3px; box-shadow:0px 2px 5px rgba(0,0,0,0.2);transition: .3s all ease; overflow: hidden; background-size: 100% auto;}
.ekiplistesi div a:before{content:""; position: absolute; background:linear-gradient(to bottom, rgb(220, 53, 69,0) 30%, rgb(19, 52, 118,.8) 100%); top:0; left:0; bottom:0; right:0; z-index:1;}
.ekiplistesi div a:hover{ box-shadow:0px 5px 25px rgba(0,0,0,0.4); transform: scale(1.02); transition: .3s all ease;}
.ekiplistesi div a .resim{display:block; height: 100%; transition: .3s all ease; z-index:0;}
.ekiplistesi div a:hover .resim{display:block; height: 100%; transform: rotate(10deg) scale(1.2); transition: .5s all ease;}
.ekiplistesi div a b{position: absolute; left: 0; right: 0; bottom:0; padding:10px; z-index:3;}

#kategoriMenu{display: block !important;}
#kategoriMenu li{display: block !important; border-bottom:solid rgba(0,0,0,.2) 1px;}
#kategoriMenu li:last-child{border: none;}
#kategoriMenu li a{color:#fff; font-size:16px;}

.navbar-toggler:focus,
.navbar-toggler:hover{outline: 0;outline: none; background: #eee;}
.navbar-toggler {padding:10px 15px;}
.navbar-toggler i{border-color: #133476;}


/* Menu Ikon Animasyonu */
#menuIcon{display:block; position: absolute; top:35px; right:30px; width:30px;height:20px;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;-o-transition:.5s ease-in-out;transition:.5s ease-in-out;cursor:pointer}
#menuIcon span{display:block;position:absolute;height:3.5px;width:100%;background:#fff;border-radius:3px;opacity:1;left:0;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition:.25s ease-in-out;-moz-transition:.25s ease-in-out;-o-transition:.25s ease-in-out;transition:.25s ease-in-out;}
#menuIcon span:nth-child(1){top:0}
#menuIcon span:nth-child(2){top:10px}
#menuIcon span:nth-child(3){top:20px}
#menuIcon.open span:nth-child(1){top:10px;background: #133476; -webkit-transform:rotate(135deg);-moz-transform:rotate(135deg);-o-transform:rotate(135deg);transform:rotate(135deg)}
#menuIcon.open span:nth-child(2){opacity:0;left:-60px;background: #133476;}
#menuIcon.open span:nth-child(3){top:10px;background: #133476; -webkit-transform:rotate(-135deg);-moz-transform:rotate(-135deg);-o-transform:rotate(-135deg);transform:rotate(-135deg)}

.altbaslik{color: #133476; font-size: 18px; position: relative; margin: 30px auto 10px;}
.altbaslik span{background: #f6fbfe; padding-right: 10px; font-weight: bold; z-index: 2; position: relative; text-transform: uppercase;}
.altbaslik:before{content:""; position:absolute; bottom:10px; left:0; right:0; height:2px; background: #46a465; z-index: 0;}


.anasayfaResim{position: relative; display: inline-block; padding: 10px; }
.anasayfaResim img{position: relative; display: inline-block; z-index: 1;}
.anasayfaResim::before{content:""; width: 100px; height: 150px; position: absolute; display: inline-block; z-index: 0; background: #133476; left: 0px; top: 0px;}
.anasayfaResim::after{content:""; width: 100px; height: 150px; position: absolute; display: inline-block; z-index: 0; background: #39a45c; right: 0px; bottom: 0px;}

@media only screen and (max-width: 992px) {
   
	#menuIcon{z-index: 1;}
    #navbarNavDropdown ul li .dropdown-menu{display: none !important;}
	/*#navbarSupportedContent{background: #fff;}
	#navbarSupportedContent .nav-link{color: #485b67  !important; padding-top: 10px; padding-bottom: 10px;}*/

		
}
@media (max-width : 1400px){
}
@media (max-height : 480px){
}
@media (max-width : 1199px){
}
@media (max-width : 991px){
	
	.sitelerSlider .carousel-item{height: 400px;}
	.navbar-nav{position: absolute; left: 0; right: 0; background: #fff; padding: 10px; box-shadow: 0 2px 10px rgba(0,0,0,.2); transition: all cubic-bezier(0.175, 0.885, 0.32, 1.275) 300ms !important;}
	.navbar-nav .nav-item{border-bottom:solid #b0b8bd33 1px; text-align: center; margin-left:0px !important;}
	.navbar-nav .nav-item:last-child{border-bottom:none !important;}
	.navbar-nav .nav-link{color:#6f8398 !important; font-weight: bold; padding: 10px !important;}
	.navbar-nav .nav-link:hover{color:#133476 !important; font-weight: bold; padding: 10px !important;}
	.navbar-nav .active > .nav-link{color:#133476 !important;}
}

@media (max-width : 1024px){
	.swiper-slide{height: 220px;}
}
@media (max-width : 1023px){
	
	body{padding-bottom: 100px;}
	footer{  height: 100px;  text-align: left;}
	.anasayfaResim{position: relative; display: inline-block; padding: 7px; }
}

@media (max-width : 767px){
	
	.swiper-container{padding-left: 20px; padding-right: 20px;}
	
	.swiper-wrapper{padding-top: 10px; padding-bottom: 50px; } 
	/* .swiper-slide::after{ bottom:-70px; font-size: 16px; line-height: 16px;} */
	.ekiplerBar{ background-position: center !important; background-size:  auto 100%;}
	
	.swiper-slide { height: 400px;}

	.swiper-button-next,
	.swiper-button-prev{color: #fff; top:300px !important;}

	.sitelerSlider .carousel-item{height: 300px;}
	
	
	footer{  height: 160px;  text-align: center !important;}
	.copyright{display:block; margin-top:20px; float: none;}
	.makaleguruplari .row > div .resim h1{font-size:24px;}
	
	.SayfaSerit h1{font-size:26px;}
	.hosgeldiniz{padding: 50px 10px;}
}


@media (max-width : 576px){
	.swiper-slide::after{ bottom:-40px; font-size: 18px; max-width: 250px;}
	
	.SayfaSerit h1{font-size:20px;  }
}
@media (max-width : 480px){
	.sitelerSlider .carousel-item{height: 350px;}

}
@media (max-width : 360px){
}
@media (max-height : 768px){
}