
 /****************** PC TASARIM ******************/
 
 body {
    background: transparent;
   }
  
  
  .aropenicon {
    display: none;
  }
  
   .modal4{
    background-color: rgb(255, 255, 255);
    width:100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 999999999;
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
    padding: 0em;
   }
  
  
   .modal__content4{
    width: 100%;
    z-index: 999999999;
    height: 80%;
    background-color: rgb(255, 255, 255);
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0em;
    font-size: 15px;
    border-radius: 0em;
    opacity: 0;
    visibility: hidden;
    transition: all .5s; 
   }
  
  
   #modal4:target{
    opacity: 1;
    visibility: visible;
    z-index: 999999999;
   }
  
  
   #modal4:target .modal__content4{
    opacity: 1;
    visibility: visible;
    z-index: 999999999;
   }
  
  
   .modal__close4{
    color: #ffffff;
    position: absolute;
    top: 0%;
    right: 25%;
  
    z-index: 5;
    margin: 3.3em;
    z-index: 999;
   }
  
   .modal__close4:hover{
    color: #ffffff;
    position: absolute;
    top: 0%;
    right: 25%;
  opacity: 40%;
    z-index: 5;
    margin: 3.3em;
    z-index: 999;
   }
  
  
  
   .modal__heading4{
    color: rgb(255, 255, 255);
    margin-top: 6em;
    z-index: 999;
   }
  
    
   .modal__paragraph4{
    line-height: 2em;
    color: rgb(0, 0, 0);
    margin: 1em;
    z-index: 999;
    font-family: "Gilroy-Regular", sans-serif;
    font-size: 1.1rem;
   }
  
  
  
   .modal-open4{
    display: inline-block;
    color: rgb(0, 0, 0);
    position: fixed;
    z-index: 999;
    right: 300px;
    top: 0px;
    margin: 1.5em; 
   }  
  
  
  
  .grid-container{
    width: 100%;
    height: 99%;
    left: 0%;
    background-color: transparent;
    top: 0%;
    position: absolute;
    display: block;
    grid-gap: 0px;
    z-index: 98;
   }
  
  
  
  model-viewer {
    width:100%;
    height: 100%;
    position: absolute;
    top: 0%;
    left:0%;
    z-index: 1;
   }
  
  
   model-viewer{
    --progress-mask: transparent;
   
   --poster-color: transparent;
    z-index: 1;
    
   }
  
  
  
  
  
  
  
   .evinde-button-de {
    width: 19%;
    height: 6%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 1%;
    z-index: 9999;
    border: solid 1px white;
    border-radius: 10px;
    background: #3c3c3c6b;
    font-family: 'Roboto', sans-serif;
    color: rgb(255, 255, 255);
    background-size: 100%;
    cursor: pointer;
    justify-content: center;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
   
   }
  
  
  
   .evinde-button-de p {
  
    position:absolute;
    color: rgb(255, 255, 255);
    margin-left: 13%;
    font-size: 1.1vw;
    display: block;
  
   }
  
   #ar-icon-de {
    position: absolute;
    width: 8%;
    margin-left:-68.5%;
  
  
   }
   
  
  
  
  
  
  
   .evinde-button-en {
    width: 13%;
    height: 6%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 1%;
    z-index: 9999;
    border: solid 1px white;
    border-radius: 10px;
    background: #3c3c3c6b;
    font-family: 'Roboto', sans-serif;
    color: rgb(255, 255, 255);
    background-size: 100%;
    cursor: pointer;
    justify-content: center;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  
   
   }
  
   .evinde-button-en p {
  
    position:absolute;
    color: rgb(255, 255, 255);
    margin-left: 15%;
    font-size: 1.1vw;
    display: block;
  
   }
  
   #ar-icon-en {
    position: absolute;
    width: 11%;
    margin-left:-60%;
  
  
   }
  
  
  
  
  
   .evinde-button {
    width: 200px;
    height: 6%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 1%;
    z-index: 9999;
    border: solid 1px white;
    border-radius: 10px;
    background: #3c3c3c6b;
    font-family: 'Roboto', sans-serif;
    color: rgb(255, 255, 255);
    background-size: 100%;
    cursor: pointer;
    justify-content: center;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
   
   }
  
  
  
   .evinde-button p {
  
    position:absolute;
    color: rgb(255, 255, 255);
    margin-left: 15%;
    font-size: 1.1vw;
    display: block;
  
   }
  
   #ar-icon {
    position: absolute;
    width: 10%;
    margin-left:-60%;
  
  
   }
  
  
  
   
  
  /****************** PC TASARIM SON******************/
  
  
  
  
  
  
  
  
  /****************** MOBİL TASARIM ******************/
  
  
  @media only screen and (max-width: 600px) {
  
  
   body {
    background: transparent;
   }
  
  
  .modal4{
    display:none;
   }
  
  
  
  
  
  
   model-viewer {
    width: 100%;
    height: 100%;
    left: 0%;
    top:0%;
    position: fixed;
  
    z-index: 1; 
    --progress-mask: transparent;
   
    --poster-color: transparent;
   }
  
  
  .grid-container{
    width:99%;
    height: 99%;
    background-color: transparent;
    top: 30%;
    left: 0%;
    position: fixed;
    display: block;
    grid-gap: 0px;
    z-index: 98;
   
  }
  
  #ar-open-new {
    margin-left: auto;
    margin-right: auto;
    display: block;
    margin-top: 89vh;
  
  
  
    width: 256px;
    height: 50px;
    background-position: center;
    background: url(assets/ariconnew.png) no-repeat ;
    background-size: cover;
    box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
    border-radius: 10px;
    border: none;
  
  }
  
  #ar-open-new2 {
  display: none;
  
  z-index:999;
  }
  
  
  
  
  
  
  
  
  .aropenicon {
    width:230px;
    height: 8%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 1%;
    z-index: 9999;
    border: solid 1px white;
    border-radius: 10px;
    background: #000000;
    font-family: 'Roboto', sans-serif;
    color: rgb(255, 255, 255);
    background-size: 100%;
    cursor: pointer;
    justify-content: center;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  
   
   }
  
   .aropenicon p {
  
    position:absolute;
    color: rgb(255, 255, 255);
    margin-left: 20px;
    font-size: 14px;
    display: block;
  
   }
  
  
   #ar-icon {
    position: absolute;
    width: 16px;
    margin-left:-140px;
  
  
   }
  
  
  
  
   .aropenicon-en {
    width: 60%;
    height: 8%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 1%;
    z-index: 9999;
    border: solid 1px white;
    border-radius: 10px;
    background: #3c3c3c6b;
    font-family: 'Roboto', sans-serif;
    color: rgb(255, 255, 255);
    background-size: 100%;
    cursor: pointer;
    justify-content: center;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  
   
   }
  
   .aropenicon-en p {
  
    position:absolute;
    color: rgb(255, 255, 255);
    margin-left: 13%;
    font-size: 4.5vw;
    display: block;
  
   }
  
  
   #ar-icon-ar-en {
    position: absolute;
    width: 10%;
    margin-left:-55%;
  
  
   }
  
  
  
  
  
  
   .aropenicon-de {
    width: 80%;
    height: 8%;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 1%;
    z-index: 9999;
    border: solid 1px white;
    border-radius: 10px;
    background: #3c3c3c6b;
    font-family: 'Roboto', sans-serif;
    color: rgb(255, 255, 255);
    background-size: 100%;
    cursor: pointer;
    justify-content: center;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
  
   
   }
  
   .aropenicon-de p {
  
    position:absolute;
    color: rgb(255, 255, 255);
    margin-left: 12%;
    font-size: 4.5vw;
    display: block;
  
   }
  
  
   #ar-icon-ar-de {
    position: absolute;
    width: 8%;
    margin-left:-67%;
  
  
   }
  
  
  
  
   #evinde-icon {
     display: none;
   }
  
  
  
  
  
   }
  
  
  
  /****************** MOBİL TASARIM SON ******************/
  
  
  
  
  /****************** TABLET TASARIM ******************/
  
  @media only screen 
   and (min-device-width: 1024px) 
   and (max-device-width: 1366px) 
   and (-webkit-min-device-pixel-ratio: 2) 
   and (orientation: landscape){
  
    #evinde-icon {
      display: none;
    }
  
  
    .aropenicon {
      width: 260px;
      height: 55px;
      position: absolute;
      left: 4%;
      bottom: 4%;
      font-size: 18px;
      z-index: 9999;
      box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
      border-radius: 10px;
      background: #ffffff;
      font-family: 'Roboto', sans-serif;
      color: rgb(120, 120, 120);
      background-size: 100%;
     cursor: pointer;
     justify-content: center;
      overflow: hidden;
      display: block;
  
     
     }
  
  .aropenicon p {
  
     position:absolute;
     color: rgb(120, 120, 120);
  top: -2.5%;
  left: 29.5%;
     display: block;
       display: block;
  
     }
  
     #ar-icon {
      position: absolute;
      width: 9%;
      top: 28%;
      left: 14.5%;
  
     }
  
  
  
  
  
  }
  
  @media only screen 
  
   and (min-device-width: 1024px) 
   and (max-device-width: 1366px) 
   and (-webkit-min-device-pixel-ratio: 2) 
   and (orientation: portrait){
  
    #evinde-icon {
      display: none;
    }
  
  
  
     .qropenicon{
    display: none;
   }
  
  
  
  
   .aropenicon {
    width: 260px;
    height: 55px;
    position: absolute;
    left: 4%;
    bottom: 4%;
    font-size: 18px;
    z-index: 9999;
    box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
    border-radius: 10px;
    background: #ffffff;
    font-family: 'Roboto', sans-serif;
    color: rgb(120, 120, 120);
    background-size: 100%;
   cursor: pointer;
   justify-content: center;
    overflow: hidden;
  
   
   }
  
  .aropenicon p {
  
   position:absolute;
   color: rgb(120, 120, 120);
  top: -2.5%;
  left: 29.5%;
   display: block;
  
   }
  
   #ar-icon {
    position: absolute;
    width: 9%;
    top: 28%;
    left: 14.5%;
  
   }
  
  
  }
  
  
  
  
  @media only screen
  
  and (min-device-width: 600px)
  
  and (max-device-width: 1024px)
  
  and (-webkit-min-device-pixel-ratio: 2) 
  
  and (orientation: landscape){
  
   .qropenicon{
    display: none;
   }
  
   #evinde-icon {
    display: none;
  }
  
  
  
  
   .aropenicon {
    width: 260px;
    height: 55px;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 4%;
    font-size: 18px;
    z-index: 9999;
    box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
    border-radius: 10px;
    background: #ffffff;
    font-family: 'Roboto', sans-serif;
    color: rgb(120, 120, 120);
    background-size: 100%;
   cursor: pointer;
   justify-content: center;
    overflow: hidden;
    display: block;
  
   
   }
  
  .aropenicon p {
  
   position:absolute;
   color: rgb(120, 120, 120);
  top: -2.5%;
  left: 29.5%;
   display: block;
  
   }
  
   #ar-icon {
    position: absolute;
    width: 9%;
    top: 28%;
    left: 14.5%;
  
   }
  
  
  
  }
  
  
  
  
  @media only screen
  
  and (min-device-width: 600px)
  
  and (max-device-width: 1024px)
  
  and (-webkit-min-device-pixel-ratio: 2) 
  
  and (orientation: portrait){
  
  
  #evinde-icon {
    display: none;
  }
  
  
   .qropenicon{
    display: none;
   }
   .aropenicon {
    width: 260px;
    display: block;
    height: 55px;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 4%;
    font-size: 18px;
    z-index: 9999;
    box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
    border-radius: 10px;
    background: #ffffff;
    font-family: 'Roboto', sans-serif;
    color: rgb(120, 120, 120);
    background-size: 100%;
   cursor: pointer;
   justify-content: center;
    overflow: hidden;
  
   
   }
  
  .aropenicon p {
  
   position:absolute;
   color: rgb(120, 120, 120);
  top: -2.5%;
  left: 29.5%;
   display: block;
  
   }
  
   #ar-icon {
    position: absolute;
    width: 9%;
    top: 28%;
    left: 14.5%;
  
   }
  
  
  
  }
  
  
  
  
   @media only screen
  
  and (min-device-width: 800px)
  
  and (max-device-width: 1280px)
  
  and (-webkit-min-device-pixel-ratio: 2) 
  
  and (orientation: landscape){
  
   .qropenicon{
    display: none;
   }
  
   #evinde-icon {
    display: none;
  }
  
  
  
  
   .aropenicon {
    width: 260px;
    height: 55px;
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 4%;
    font-size: 18px;
    z-index: 9999;
    box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
    border-radius: 10px;
    background: #ffffff;
    font-family: 'Roboto', sans-serif;
    color: rgb(120, 120, 120);
    background-size: 100%;
   cursor: pointer;
   justify-content: center;
    overflow: hidden;
  
   
   }
  
  .aropenicon p {
  
   position:absolute;
   color: rgb(120, 120, 120);
  top: -2.5%;
  left: 29.5%;
   display: block;
  
   }
  
   #ar-icon {
    position: absolute;
    width: 9%;
    top: 28%;
    left: 14.5%;
  
   }
  
  
  
  }
  
  
  
  
  @media only screen
  
  and (min-device-width: 800px)
  
  and (max-device-width: 1280px)
  
  and (-webkit-min-device-pixel-ratio: 2) 
  
  and (orientation: portrait){
  
  
  #evinde-icon {
    display: none;
  }
  
  
   .qropenicon{
    display: none;
   }
   .aropenicon {
    width: 260px;
    height: 55px;
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    bottom: 4%;
    font-size: 18px;
    z-index: 9999;
    box-shadow: 0px -6px 10px rgba(255, 255, 255, 1), 0px 4px 15px rgba(0, 0, 0, 0.31);
    border-radius: 10px;
    background: #ffffff;
    font-family: 'Roboto', sans-serif;
    color: rgb(120, 120, 120);
    background-size: 100%;
   cursor: pointer;
   justify-content: center;
    overflow: hidden;
  
   
   }
  
  .aropenicon p {
  
   position:absolute;
   color: rgb(120, 120, 120);
  top: -2.5%;
  left: 29.5%;
   display: block;
  
   }
  
   #ar-icon {
    position: absolute;
    width: 9%;
    top: 28%;
    left: 14.5%;
  
   }
  
  
  
  }
  
  
  
  /****************** TABLET TASARIM SON ******************/