@charset "utf-8";
/* CSS Document */


.accordion {  width: 100%;  height: 100vh;  overflow: hidden;}

.accordion ul {  width: 100%;  display: table;  table-layout: fixed;  margin: 0;  padding: 0;}

.accordion ul li {  display: table-cell;  vertical-align: bottom;  position: relative;  width: 25%;  height:100vh;  background-repeat: no-repeat;background-position: center center;  transition: all 500ms ease;}

.accordion ul li::after {    content: '';    position: absolute;z-index: 999;    right: -57px;    width: 57px;    height: 100vh;    background: url("../pageFile/golgeSag.png") no-repeat left top;}

.accordion ul li .stn {  display: block;  overflow: hidden;  width: 100%;}

.accordion ul li .stn a.dikey-akordiyon-link {  display: block;  height:100vh;  width: 100%;  position: relative;  z-index: 3;  vertical-align: bottom;  padding: 15px 20px;  box-sizing: border-box;  color: #fff;  text-decoration: none;  font-family: Open Sans, sans-serif;  transition: all 200ms ease;}

.accordion ul li .stn a.dikey-akordiyon-link * {  opacity: 1;  width:auto;padding:6px 12px; left: 50%; margin-left: -78px;  text-overflow: ellipsis;  position: relative;  z-index: 5;  white-space: nowrap;  overflow: hidden;}

.accordion ul li .stn a.dikey-akordiyon-link h2 {  font-family: Montserrat, sans-serif;  text-overflow: clip;  font-size: 24px;  text-transform: uppercase;  margin-bottom: 2px;top: 160px;}

.accordion ul li .stn a.dikey-akordiyon-link p {  top: 160px;  font-size: 13.5px;}

.accordion ul li:nth-child(1) {   }
.accordion ul li:nth-child(2) {  }
.accordion ul li:nth-child(3) {  background-position: 34% center !important; }
 

 
.accordion ul:hover li { width: 20%; }
.accordion ul:hover li:hover { width: 40%; }
.accordion ul:hover li:hover a.dikey-akordiyon-link { background: rgba(0, 0, 0, 0.4); }
.accordion ul:hover li:hover a.dikey-akordiyon-link * {  opacity: 1;  -webkit-transform: translateX(0);  transform: translateX(0);}







.btn-genel-giris{position: absolute !important;width: 100%; top: 60%;text-align: center;height: auto; font: 42px 'Gilroy-Black'; color: #fff;}


 
 
 
.btn-genel-giris::after,
.btn-genel-giris::before{
      content: '';
      display: block;
      position: absolute;
      width: 20%;
      height: 40%;
      border: 2px solid;
      transition: all 0.6s ease;
      border-radius: 2px;z-index: -1;
}
.btn-genel-giris::after{
      bottom: 0;
      right: 0;
      border-top-color: transparent;
      border-left-color: transparent;
      border-bottom-color: #fff;
      border-right-color: #fff;
}
.btn-genel-giris::before{
      top: 0;
      left: 0;
      border-bottom-color: transparent;
      border-right-color: transparent;
      border-top-color: #fff;
      border-left-color: #fff;}



.accordion ul:hover li:hover a.dikey-akordiyon-link>.btn-genel-giris:after,
.accordion ul:hover li:hover a.dikey-akordiyon-link>.btn-genel-giris:before{
      width: 92%;
      height: 68%;


}




@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  
{  
    .container{padding: 0 15px; width: 100%;max-width: 100%;}
       .mobil-ust-str{z-index: 999;}
    .accordion ul li{background-size: 120%;}
    .logo{display: table; margin: 0 auto; float: none;}
    .ust-banner-sosyal-box{display: none;}
     
.logo-alt{position: absolute;background: url("../images/page/altKisimLogo.svg") no-repeat top center;width: 246px; height: 346px;left: 50%;margin-left: -123px; top:12px;}
	body { margin: 0; }
    
    .giris-logo{top: 24px; background-size: 270px;width: 278px; height: 52px; margin-left: -139px;}
    .btn-genel-giris {top: 48%;}

.accordion { height: auto; }
.accordion ul li,
.accordion ul li:hover,
.accordion ul:hover li,
.accordion ul:hover li:hover {
  position: relative;  display: table;  table-layout: fixed;  width: 100%;  -webkit-transition: none;  transition: none;    height: 33.33vh;}
 .accordion ul li .stn a.dikey-akordiyon-link{height: 33.33vh;}
}











 @media screen and (max-width: 600px) 
{
body { margin: 0; }
    
    .giris-logo{top: 24px; background-size: 270px;width: 278px; height: 84px; margin-left: -139px;}
    .btn-genel-giris {top: 48%;}

.accordion { height: auto; }
.accordion ul li,
.accordion ul li:hover,
.accordion ul:hover li,
.accordion ul:hover li:hover {
  position: relative;  display: table;  table-layout: fixed;  width: 100%;  -webkit-transition: none;  transition: none;    height: 33.33vh;}
 .accordion ul li .stn a.dikey-akordiyon-link{height: 33.33vh;}
    
}
 
    
    
.logo-box{position: absolute;width: 100%;height: 100%;display: block;}

.logo-box img{top: 50%;  position: relative;    display: table;         }
.logo-motusgrup{max-width: 332px;margin: -45px auto 0;}





 






.logo-scf{max-width: 242px;margin: -62px auto 0;}
.logo-motuscrankshaft{max-width: 278px;margin: -91px auto 0;}
.logo-motusdokum{max-width: 294px;margin: -47px auto 0;}
 
    
    