@charset "utf-8";
/* CSS Document */


html, body {
background:#212529;
color:#fff; 
font-family: 'Montserrat', sans-serif;
}
a { 
text-decoration:none; 
color:#ff7300;}

a:hover { color:rgba(255,255,255,1.00);}

.bg-dark {
background:#000!important;}

/*####################################### NAVBAR #######################################*/

.navbar-brand {
padding:1rem 2rem;}

.navbar-brand .nav-logo { 
max-height:70px;}

.navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .show>.nav-link {
color: #ff7300;}

.navbar-dark .navbar-nav .nav-link {
color: rgb(255 255 255);
text-transform:Capitalize;}

.dropdown-menu { 
background:rgba(0,0,0,1.00);}

.dropdown-item {
color:#fff;	}

li.dropdown:hover .dropdown-menu{ display:block;}

.nav-link { position:relative; 
margin:0px 5px;}

.nav-link::before {
content:'';
position:absolute;
border-left:1px solid;
border-top:1px solid;
border-bottom:1px solid;
width:10px;
height:30px;
top:5px;
left:0px;
}

.nav-link::after{
content:'';
position:absolute;
border-right:1px solid;
border-top:1px solid;
border-bottom:1px solid;
width:10px;
height:30px;
right:0px;
top:5px;
}

.nav-item:hover {

animation:flash-menu .7s;

}
@keyframes flash-menu {
0% {
background:rgba(255,255,255);

filter: blur(5px);
}
100% {
background:rgba(0,0,0,0.00);

}
}
/*####################################### NAVBAR #######################################*/
/*####################################### HEADER #######################################*/
.home-banner {
background-color:#000;
height:100vh;
clip-path: polygon(50% 0%, 100% 0, 100% 60%, 50% 85%, 50% 85%, 0% 60%, 0 0);	
}

#videoBG {
padding:0px;
position:fixed;
z-index:-1;
width:100%;
height:auto;
left:0;
}

.banner-link {
clip-path: polygon(25% 10%, 25% 90%, 90% 50%);
background-color:#FF7300;
height:5rem;
width:5rem;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
z-index:1;  
transition:all 500ms;
}
.banner-link:hover {
background:#fff;	
}  

/*####################################### HEADER #######################################*/

/*####################################### MAİN #######################################*/
.baslik{
text-align: center;
font-size: 28px;
line-height: 38px;
border: 2px solid;
font-weight: 400;
display: table;
margin: 0 auto;
padding: 10px 25px;
margin-bottom:5rem;
color: #f3f5f7;
border-radius: 3px;
}
.card-cover { 
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
filter: grayscale(100%) blur(2px) ;
transition:all 300ms;
box-shadow:  20px 20px 60px #bebebe,
-20px -20px 60px #ffffff;}

.foto-blok .card-cover {
background-image:url(../img/kamera-bg.jpg); 
background-color:rgba(0,0,0,1.00);
}

.video-blok .card-cover {
background-image:url(../img/video-bg.jpg); 
background-color:rgba(0,0,0,1.00);
}
.card-cover:hover {
filter:grayscale(0%) ;
}
/*####################################### MAİN #######################################*/

/*####################################### FOOTER #######################################*/
.footer-logo img {
width:4rem;}

.text-right {
text-align:right;}

footer a { 
color:#FF7300; 
font-size:1.2rem; 
padding:1rem .5rem; 
bottom:0; 
right:0;
transition:linear 300ms;
}

footer a:hover {
color:#fff;}

.konvert:hover {text-decoration:none;}
/*####################################### FOOTER #######################################*/

/*####################################### HAKKIMIZDA #######################################*/
.hakkimizda-banner { 
height:22rem;
background-color:rgba(0,0,0,1.00);
background-image:url(../img/hakkimizda-banner.jpg);
background-repeat:no-repeat;
background-size:contain;
background-position:center center;
position:relative;
}

.hakkimizda-baslik {
color:#fff;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
font-size:50px;
font-weight:100;
}
.big-text {font-size:34px;}
.orange-text { color:#FF7300;}

/*####################################### HAKKIMIZDA #######################################*/

/*####################################### İLETİŞİM #######################################*/
.harita {
filter: grayscale(100%);}
/*####################################### İLETİŞİM #######################################*/

/*####################################### FOTO #######################################*/
.galery-box {padding: 0px 4px;  }
.galery-box-img {display: none; /* Hide all elements by default */}
.galery-box img {
margin-top: 8px;
vertical-align: middle;  
}

.foto-banner{
height:22rem;
background-color:rgba(0,0,0,1.00);
background-image:url(../img/foto-banner.jpg);
background-repeat:no-repeat;
background-size:contain ;
background-position:center center;
position:relative;}

.filter-button{
font-size: 15px;
text-align: center;
margin-bottom: 30px;
color: #fff;
background-color: #000000;
border-color: #808080;
}
.filter-button:hover{   
font-size: 18px;
border: 1px solid #000;
border-radius: 5px;
text-align: center;
color: #000;
background-color: #ff7300;
}


.btn-check:focus+.btn, .btn:focus, .btn-default:active{    
background-color: #ff7300;    
color: #fff;}

.port-image{width: 100%;}

.show {  display: block;}

.galery-box img:hover {
opacity: 1;
-webkit-animation: flash 1.5s;
animation: flash 1.5s;
}

@-webkit-keyframes flash {
	0% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}
@keyframes flash {
	0% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}
/*FOTO*/

/*VİDEO*/
.youtube-video{position:relative;}

.youtube-icon {
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
z-index:11;
color:rgba(231,0,3,1.00);
font-size:5rem;
}
		
.video-banner { 
height:22rem;
background-color:rgba(0,0,0,1.00);
background-image:url(../img/video-banner.jpg);
background-repeat:no-repeat;
background-size:contain;
background-position:center center;
position:relative;

}

.modal-dialog {
    max-width: fit-content;
    margin: 1.75rem auto;
}

.ana-video { position:absolute; opacity:100%;}
#video {width:1120px; height:630px;}
/*VİDEO*/

/*İŞLERİMİZ*/
.islerimiz-banner { 
height:22rem;
background-color:rgba(0,0,0,1.00);
background-image:url(../img/islerimiz-banner.jpg);
background-repeat:no-repeat;
background-size:contain;
background-position:center center;
position:relative;
}
/*İŞLERİMİZ*/

/*REFERANSLAR */
.referanslar-banner { 
height:22rem;
background-color:rgba(0,0,0,1.00);
background-image:url(../img/referanslar-banner.jpg);
background-repeat:no-repeat;
background-size:contain;
background-position:center center;
position:relative;
}
.sosyal-icon { font-size:22px;}

.referanslar-box img {
	filter: grayscale(100%);
	transition:linear 300ms;
	}
.referanslar-box img:hover {
	filter: grayscale(0%);
	
	}
/*REFERANSLAR */


/*İLETİŞİM*/
.iletisim-banner { 
height:22rem;
background-color:rgba(0,0,0,1.00);
background-image:url(../img/iletisim-banner.jpg);
background-repeat:no-repeat;
background-size:contain;
background-position:center center;
position:relative;
}
.sosyal-icon { font-size:22px;}
/*İLETİŞİM*/


@media (max-width: 1439.98px) { 
.home-banner {
    background-color: #000;
    height: 99vh;
    clip-path: polygon(50% 0%, 100% 0, 100% 55%, 50% 73%, 50% 73%, 0% 55%, 0 0);
}
#video {width:1020px; height:600px;}

 }
 
 @media (max-width: 1024.01px) {
	#video {width:768px; height:450px;} 
	 }
 


@media (max-width: 991.98px) { 
.nav-link::before {
content:'';
position:absolute;
border:0px;
width:10px;
height:30px;
top:5px;
left:0px;
}

.nav-link::after{
content:'';
position:absolute;
border:0px;
width:10px;
height:30px;
right:0px;
top:5px;
}

.navbar-brand { padding:0rem 1rem;}
 }
 
 @media (max-width: 768.1px) { 
.home-banner {
    background-color: #000;
    height: 45vh;
    clip-path: polygon(50% 0%, 100% 0, 100% 55%, 50% 73%, 50% 73%, 0% 55%, 0 0);
    position: relative;
	}
	
	.banner-link {
    clip-path: polygon(25% 10%, 25% 90%, 90% 50%);
    background-color: #FF7300;
    height: 5rem;
    width: 5rem;
    position: absolute;
    top: 35%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 1;
    transition: all 500ms;
}

.baslik {
    text-align: center;
    font-size: 16px;
    line-height: 26px;
    border: 2px solid;
    font-weight: 400;
    display: table;
    margin: 0 auto;
    padding: 10px 25px;
    margin-bottom: 2rem;
    color: #f3f5f7;
    border-radius: 3px;
}
#video {width:475px; height:250px;}

 }
 
@media (max-width: 475px) {
.big-text {
    font-size: 16px;
    background: black;
    padding: 2px;
    font-weight: 600;
}

.orange-text {
    color: #FF7300;
    background: black;
    padding: 2px;
}	

#video {width:370px; height:250px;}

	}