html{
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
}

::selection{
    background:#023;
    color:#fff;
    }
    
::-webkit-scrollbar {
    width: 3px;
    border:.1vh solid #00223323;
    background:#fff;
    }

::-webkit-scrollbar-thumb {
    background:#023;
    }

button{
    border-width:0;
    color:#023;
    font-weight:bold;
    cursor:pointer;
}

button:hover{
    opacity:.8;
}

form{
    display:grid;
}

input, textarea, select{
    border:.1vh solid #00223323;
    border-radius:3px;
    padding:1%;
    margin:1% 0;
}
label{
    font-weight:bold;
}

textarea{
    resize:none;
}

body{
    background:#00223305;
    letter-spacing: 1.23px;
    color:#023;
    font-family: Open Sans;
    overflow:hidden;
    }
    
h1,h2,h3,h4,h5,h6{

    }
    
a{
    text-decoration:none;
    color:#023;
    font-weight:bold;
    }
    
a:hover{
    opacity: .8;
    }

.genislik{
    width:90vw;
    margin:auto;
}
.sinir{
    border:.1vh solid #00223323;
}
.yaricap{
    border-radius:3px;
}
.dis-bosluk{
    margin:1% 0;
}
.dis-bosluk-yok{
    margin:0;
}
.ic-bosluk{
    padding:1%;
}
.ana-arkaplan{
    background:#000;
}
.ikinci-arkaplan{
    background:#d23;
}
.beyaz-arkaplan{
    background:#fff;
}
.ana-renk{
    color:#000;
}
.ikinci-renk{
    color:#d23;
}
.beyaz-renk{
    color:#fff;
}

.kenar{
    border:.1vh solid #00223323;
    border-radius:3px;
}

.dugme{
    background: linear-gradient(0deg, #fff, #00223323 );
    padding:1vh 1vw;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px #00223323;
    text-align:left;
    }
    
.dugme:active{
    box-shadow:0 0 0 1px #00223323;
    font-size:99%;
    }

.devre-disi{
    display:none;
}


/* Üst */
    
#ust{
    height:10vh;
    display:grid;
}

.ust-kutu{
    display:flex;
    justify-content: space-between;
    align-items: center;
}

#ust h1{
    margin:0;
    display: grid;
    align-content: center;
}

#logo{
background:#fff;
padding:0 1vw;
border-radius:3px;
font-size:23px;
}

#logo::before{
    content:"K#";
    background:#000;
    color:#fff;
    padding:0 10px;
    margin-right:5px;
    border-radius:3px;
}

.menu-ac{
    width:5vh;
    min-width:23px;
    min-height:23px;
    height:5vh;
    color:#fff;
    display:grid;
    align-content:center;
    text-align:center;
    transition: all 200ms;
    }
    
.kapat{
    position:fixed;
    right:3vw;
    top:23vh;
    background: #d04;
    color: #fff;
    width: 50px;
    height: 50px;
    display: grid;
    align-items: center;
    text-align: center;
    border-radius:100%;
    z-index:2;
    }
    
       
/*! Üst */
    
/* Orta */ 
    
#orta{
    height: 85vh;
    overflow:auto;
    }
    
/*! Sayfa */ 

.sayfa{
    position: fixed;
    top: 10vh;
    bottom: 5vh;
    left: 0;
    right: 0;
    z-index:3;
    transition: opacity 500ms;
    visibility: hidden;
    opacity: 0;
    background:#000 ;
    overflow:auto;
    }
    
.sayfa:target {
    visibility: visible;
    opacity: 1;
    }
    
.sayfa-ust{
    border-radius:3px;
    background:#fff;
    padding:1%;
    margin:1vh auto;
    }

.sayfa-ust h2{
    margin:0;
    display:grid;
    align-items:center;
}

.sayfa-yol-haritasi{
    border:.1vh solid #000;
    border-radius:3px;
    padding:1%;
}
.sayfa-icerik{
    border-radius:3px;
    background:#fff;
    padding:1%;
    margin:1vh auto;
}

.menu-kutu{
    border:.1vh solid #000;
    border-radius:3px;
    padding:1%;
    display: grid;
}

.sayfa-kutu{
    border:.1vh solid #000;
    border-radius:3px;
    padding:1%;
    overflow:auto;
}

/*# Sayfa */

#musteri-tablo{
    border:1px solid #00223323;
    border-radius:3px;
}

.aktif{
    color:#023;
}
.uyari{
    background:#d04;
    color:#fff;
}
.ters-liste{
    display:flex;
    flex-direction: column-reverse;
    overflow:hidden;
}

/*! Orta */
    
/* Alt */

#alt{
    height:5vh;
    text-align:center;
    display: grid;
    align-content: center;
    }
    
#alt p{
    margin:0;
}
     
/*! Alt */