/*///////////////////////////////////////İNDEX PAGE BODY START///////////////////////////////////////*/
#body {
  height: 95vh;
  display: grid;
  grid-template-rows: 1.5fr 9fr 1.5fr;
  width: 90vw;
  overflow: hidden;
  margin: 2.5vh auto;
  transition-duration: 700ms;
}
.bg-dark {
  background-color: #000;
}
.bg-space{
  background-image: url(img/dark-space-bg.jpg);
  background-repeat: none;
  background-attachment: contain;
  background-position: right center;
  position: absolute;
  height: 100vh;
  width: 100%;
  top:0;
  left: 0;
  z-index: -9;
  filter: brightness(.4) ; 
  
}
/*///////////////////////////////////////İNDEX PAGE BODY END///////////////////////////////////////*/

/*/////////////////////////////////////////////// site transform start/////////////////////////////////////////////// */
.checkbox-active {
  height: 100vh;
  transform: scale(.7) translateX(-40%) translateZ(0);
  margin: 0 auto!important;
  height: 100vh!important;
  overflow: hidden;
  padding: 1rem;
}
/*/////////////////////////////////////////////// site transform end/////////////////////////////////////////////// */



/*///////////////////////////////////////FOOTER - START///////////////////////////////////////*/

.social-media-list {
  display:flex ;
  flex-direction: row-reverse;
}
.social-media-item {
  border:0.05rem solid #fff ;
  border-radius: 50%;
  height: 50px;
  width: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left:8px;
  transition: 500ms all linear;
  
}
.social-media-item a img {
  width: 80%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;

}

.social-media-item:hover::after {
  content: "";
  height: 55px;
  width: 55px;
  border-radius: 50%;
  position: absolute;
  animation: BorderSpin 12s infinite linear;
  z-index: -9;
}

.social-media-item.whatsapp-icon::after {
  border:2px dashed #419527;
}

.social-media-item.instagram-icon::after {
  border:2px dashed #bc2a8d;
}

.social-media-item.linkedin-icon::after {
  border:2px dashed #0072b1;
}


@keyframes BorderSpin {
  from {
      -webkit-transform: rotate(0deg)
  }
  to {
      -webkit-transform: rotate(360deg);
  }
}

/*///////////////////////////////////////FOOTER - END///////////////////////////////////////*/




/*///////////////////////////////////////HOME PAGE - START///////////////////////////////////////*/

video {
  position: fixed;
  bottom: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;
  z-index: -99;
  overflow: hidden;
  filter: brightness(.4) ; 
}

.container {
  color:#fff;
 
}

.container h4{
  font-size: 3.5rem;
  width: 80%;
}

.container h5 {
  font-size: 2rem;
  padding: 1rem 0rem;
}

.container p {
  font-size: 1.5rem;
  width: 50%;
}




/*///////////////////////////////////////HOME PAGE - END///////////////////////////////////////*/


/*///////////////////////////////////////HAKKIMIZDA - START///////////////////////////////////////*/
.container-hizmet,.container-hakkimizda, .container-iletisim {
  color:#fff;
  display: flex;
  width:100%;
  flex-direction: row;

}
.page-title{
  writing-mode: tb-rl;
  transform: rotate(-180deg);
  font-size: 3rem;
  color:#3c3c3c;
  border-left: 6px solid #421944;
  padding-left: 0.8rem;
  flex:1 11 ;
}

.page-title span {
  font-weight: 800;
}

.hakkimizda-box{
  padding-left: 2rem;
  flex: 0 6 auto;
  align-self: center;
  font-style: italic;
}
.hakkimizda-box p {
  padding: 1rem 0;
}
/*///////////////////////////////////////HAKKIMIZDA - END  ///////////////////////////////////////*/

/*///////////////////////////////////////HİZMETLERİMİZ - START///////////////////////////////////////*/


.hizmetler-list  {
  
  font-size: 0.9rem;
  font-weight: lighter;
  line-height: 120%;
  padding-left: 2rem;
  flex: 7 0;
  letter-spacing: 0.15rem;
}

.hizmetler-list ul li {
  padding: 1rem 0;
}
.animation-astronot {
 
 flex: 5 0;
 
}
.astronot{
 
  position: absolute;
  animation: float 5s infinite;
  
}
@keyframes float {
  50% {
    transform:  translateY(1.87em);
  }
}

/*///////////////////////////////////////HİZMETLERİMİZ - END  ///////////////////////////////////////*/


/*///////////////////////////////////////İŞLERİMİZ - START///////////////////////////////////////*/
.main-islerimiz {
  background-color: rgba(0, 0, 0, 0.8);
  align-items: flex-start;
  padding: 2rem;
  overflow-y: scroll;
}

.container-islerimiz {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
  
}

.isler-menu {
  border-bottom: 1px solid #fff;
  padding-bottom: 1rem;
}
.isler-menu ul{
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  flex-wrap: wrap;
  
}

.isler-menu ul li {
  padding: .3rem .8rem;
  font-size: .8rem;
}

.isler-menu ul li a {
  position: relative;
}

.isler-menu ul li: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);
  
  }
  }

.isler-menu ul li ::before {
  content: '';
  position: absolute;
  border-left: 1px solid;
  border-top: 1px solid;
  border-bottom: 1px solid;
  width: 6px;
  height: 13px;
  top: -5px;
  left: -12px;
  padding: 5px 0px;
}
.isler-menu ul li ::after {
  content: '';
  position: absolute;
  border-right: 1px solid;
  border-top: 1px solid;
  border-bottom: 1px solid;
  width: 6px;
  height: 13px;
  top: -5px;
  right: -12px;
  padding: 5px 0px;
}

.hide{
  display: none;
 
}
.product .itemBox{
  position: relative;
  display: block;
}


.yapilan-isler {
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  padding-top: 1rem;
}

.is-box {
  border:1px solid #fff;
  width: 250px;
  margin: 2.5%;
  height: 160px;
  overflow: hidden;
}

.is-box img {
  width: 100%;
  height: auto;
  filter: grayscale(1);
  transition-duration: 500ms;
}

.is-box:hover img{
  filter: grayscale(0);
}
/*///////////////////////////////////////İŞLERİMİZ - END  ///////////////////////////////////////*/

/*///////////////////////////////////////İLETİŞİM - START///////////////////////////////////////*/
.iletisim-box  {
  
  padding-left: 2rem;
  letter-spacing: 0.15rem;
  text-align: left;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.animation-ship{
  flex: 12; 
 }

 .uzay-gemisi{
   position: absolute;
   animation: float 5s infinite;
   width: 40rem;
   filter: brightness(.7);
 }

 .map{ width: 700px;
height: 350px;}

 
 @keyframes float {
   50% {
     transform:  translateY(1.87em);
   }
 }
/*///////////////////////////////////////İLETİŞİM - END  ///////////////////////////////////////*/