@font-face {

 font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/style/fonts/Inter-VariableFont_slnt,wght.ttf') format('truetype');
}


/* @import url('https://fonts.googleapis.com/css2?family=Inter:wght@500&display=swap'); */

   * {padding:0;margin:0;box-sizing:border-box;}
    body {font-family: 'Inter', sans-serif;font-size:15px;background:#f1f2f3;}



a {
    color: #000000;
    text-decoration: none;
    position: relative;
    transition: color .3s ease-in-out, padding-bottom .3s ease-in-out;
}


a:hover {
    color: #0077CC;
}

a:hover::after {
    transform: scaleX(1);
}

 

    
    /* visited link */
    a:visited {
      color: #000000;
    }
    

#vs-img{vertical-align:middle;display:inline-block;width:100px;}

    
    /* TEMPLATE rgba(247,247,248 -- 229 229 230)*/ 
    .middle {width:100%;background-color:#f1f2f3}
    .middle2 {margin:0 auto;width:1100px;}
    
    /* HEADER */
    .head {width:1100px;margin:0 auto;height:80px;display:block;}
        .before-head {background:#ebebeb;}
        
    /* CENTER */
    .leftarea {float:left;display:inline-block;margin:0px;padding:0px;margin-right:4px;width:650px;background:#fafafa;border-radius: 12px;}
    .rightarea {float:left;display:inline-block;margin:2px;padding:0px;width:350px;background:#fafafa;border-radius:3px;}
    .centerarea {float:left;display:inline-block;margin:0px;padding:0px;margin-right:4px;width:1100px;background:#fafafa;border-radius: 12px;}
        /* SIDEBAR */
        div.title {background:#ddd;display:block;padding:5px 6px;border-left:3px solid red;margin:3px 0; border-radius:3px;}
        
    /* FOOTER */
        .before-foot {background:rgba(247,247,248)}
    .foot {width:1100px;margin:0 auto;height:100px;display:block;padding:15px;color:#fff;background:#282A35;border-radius:5px;}
    
        
    /* H_TITLES_333 */
   h1 {color:#333;text-shadow:1px 0 0 #fff;font-size:22px;padding:8px;margin:4px 0px;border-radius: 1px;}
    
    
    
    h2 {margin-top:10px;background:#282A35;color:#fff;font-weight:500;padding:5px;font-size:21px;}

h3 {color:#333;font-size:18px;padding:10px;margin:4px 0px;}
    
    .compare h2 {color: #333;font-size:20px;padding:0px;margin:4px 0px;border-radius:1px;}
    
    /* MARKALAR */
   ul.marka li {width:18.3%;text-align:center;float:left;border-radius:0.625rem;margin:4px;display:inline-block;box-sizing:border-box;padding:12px;border:1px solid #ddd;}
    ul.marka li a {text-decoration:none;color:#333;font-weight:bold;}
    ul.marka li:hover {background:#ddd;}

.headerbrand {display: flex; flex-wrap: wrap; justify-content: space-between;}
ul.headerbrand li {width: calc(15% - 10px); box-sizing: border-box;padding:5px;vertical-align: middle;}  
.brandlist {display:block; height:150px;}

    /* MODELLER */
    ul.model {padding:0;margin:0;}
    ul.model li {margin:4px;display:block;border:1px solid #ddd;border-radius:4px;}
    ul.model li:hover {background:#ddd;}
    ul.model li a {padding:12px;display:block;line-height:20px;}


 /* MARKALAR */
    ul.brandmark {padding:0;margin:0;}
    ul.brandmark li {margin:4px;display:block;border:1px solid #ddd;border-radius:4px;}
    ul.brandmark li:hover {background:#ddd;}
    ul.brandmark li a {display:block;line-height:20px;}
    
    
    
    
    ul {list-style-type:none;}
    ul.top {display:inline-block;}
    ul.top li{float:left;margin:5px;padding:10px;color:#fff;display:inline-block;}
    ul.top li a{color:#fff;}
    ul.top li:hover {background:red;border-bottom:2px solid black;}
    ul.top li:first-child:hover {border:0;}

ul.indexul {display:inline;color:#337ab7;}
li.indexli {padding:10px;border-bottom:1px solid #ddd;} 


    table {display:table;width:100%;table-layout: fixed;border-collapse:collapse;border:0;}
    table tr:nth-child(2n) td {border:2px solid #ebebeb;color:#000;}
    table tr:nth-child(2n+1) td {color:#000;border:2px solid #ebebeb}
    table tr td {padding:10px 5px;}
    table tr th {background:#282A35;color:#fff;text-shadow:1px 0 0 #000;padding:5px 10px;text-align:left;}
    
    /* special col */
    table tr.top td {text-align:center;background:#006699;color:#fff;font-weight:bold;}
    
    table.versus {display:table;width:100%;}
    table.versus tr td, table.versus tr th {width:50%;text-align:left;}
    table.versus input, select {width:100%;}
    
    table.versus2 {display:table;width:100%;}
    table.versus2 tr td:firsth-child {width:20%;text-align:right;}
    table.versus2 tr td:nth-child(2) {width:30%;text-align:left;}
    table.versus2 tr td:nth-child(3) {width:30%;text-align:left;}
    table.versus2 tr td:nth-child(4) {width:20%;text-align:left;}
    table.versus2 tr td {padding:0;}
    table.versus2 input, select {width:100%;}
    
    #arabayakit form input, select {display:block;}
    
    
    
    /* versus */
    ul.v {display:inline-block;width:100%;}
    ul.v li {display:block;padding:5px 15px;width:100%;margin:0 1px;border:1px solid #eee;box-sizing:border-box;}
    ul.v li:nth-child(2n) {background:#fff;color:#333;}
    ul.v li:nth-child(2n+1) {background:#ddd;color:#333;}
    
    ul.v li.green {background:lightgreen;}
    
    ul.W li {color:green;}

    
   #arabayakit form{background:#e6e6e6;border-radius:8px;box-shadow:0 0 3px -1px #000;padding:5px;box-sizing:border-box;}
   #arabayakit input{width:100%;padding:10px;box-sizing:border-box;border:0;border-bottom:2px solid #bebed2}
    #arabayakit input:focus{border-bottom:2px solid #78788c}
    button{padding:8px 12px;margin:8px 0 0;border:2px solid #78788c;background:0;color:#5a5a6e;cursor:pointer;}
    button:hover{background:#78788c;color:#fff}

.seotext h2 {color:#696969;}
.seotext {padding:10px;color:#888;}
.popular_models{display:inline-flex;padding:10px;}