﻿
     

 
          body {
            position: relative;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            height: 100%;
            overflow: auto;
            font-family: 'Roboto', sans-serif;
            font-size: 100%;
            background:rgba(4,30,55,0.9);
            color: white;
            margin: 0 auto;
            overflow-x: hidden;}
       

        #page {
            position: relative;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: 0 auto;
            overflow-y: auto;
            overflow-x: hidden;
 
         
        }
        
        .imagerox1
        {
            max-width:170px; 
            margin:30px; 
            height:auto;
            }
            
       .imagerox
        {
           width:170px; max-width:170px; height:auto;
            }
            
    .rateboxx1
        {
        width: auto; height:400px;
    
         }
            

     

        div#mobilead {
            display: inline-block;
            max-width: 454px;
            background: #394250;
            float: right;
            margin-right:15px;
            
            transition: background-color ease-in 150ms;
        }

            div#mobilead > h1 {
                font-size: 160%;
                margin: .75em 0;
            }

    

        table {
            border-spacing: 0;
        }

      

    




        div.responsivewrapper {
            display: inline-block;
        }

        div.ratebox {
            display: inline-block;
            background-color: #161B26;
            border-radius: .5em;
            min-width: 10em;
            overflow-x: auto;
            vertical-align: top;
            
       
        }

            div.ratebox.full {
                display: block;
                width: min-content;
                margin-left: auto;
                margin-right: auto;
            }

             div.subpage div.ratebox {
            padding: 1em;
            margin: 1em;
            max-width: 100%;
            margin-top: 2em;
             }

       
             div.rateboxx {
            display: inline-block;
            background-color: #161B26;
            border-radius: .3em;
            min-width: 10em;
            overflow-x: auto;
         margin-top:13px;
           
 
        }

            div.rateboxx.full {
                display: block;
                width: min-content;
            margin-right:-8px;
             margin-left:60px;
            margin-right:-8px;          
            margin-top:13px;
            transition: background-color ease-in 150ms;
            }

        div.subpage div.ratebox {
            padding: 1em;
            margin: 1em;
            max-width: 100%;
            margin-top: 2em;
        }
       
       
        div.header {
            position: relative;
            top: 0;
            left: 0;
            user-select: none;
        }

        div.options {
            text-align: right;
            margin-bottom: 1.4em;
        }

            div.options > * {
                vertical-align: top;
            }

        div.header > div.options img {
            width: 32px;
            height: 32px;
            margin-right: .6em;
        }

        div.header > h1 {
            position: absolute;
            left: .6em;
            top: 6px;
            font-weight: 200;
            font-size: 160%;
            /*display: inline;
    padding-right: 2em;
    font-weight: 300;*/
        }

        div.tab div.header > h1 {
            top: 6px;
            font-size: 140%;
            padding-left: 34px;
        }

        .imgtitle.doviz {
            background-image: url("images/doviz.png");
            background-image: url("images/doviz-ikon.png");
            background-image: url("images/currency-calc.png");
        }

        .imgtitle.parite {
            background-image: url(images/currency-calc-2.png);
            background-image: url(images/parite.png);
        }

        .imgtitle.altin {
            background-image: url(images/gold.png);
        }

        .imgtitle.emtia {
            background-image: url(images/emtia_100.png);
        }

        .imgtitle.endeks {
            background-image: url(images/endeks.png);
        }

        .imgtitle.faiz {
            background-image: url(images/faiz.html);
        }

        .imgtitle.haber {
            background-image: url(images/newspaper.png);
            font-weight: 200;
            padding-left: 42px;
        }

        .imgtitle.bist {
            background-image: url(images/bist.png);
        }

        div.full table td > span {
            padding: .3em .2em .3em .2em;
            font-size: 80%;
        }

        div.full table td.rate > span {
            font-size: 100%;
        }

        .awesomebutton {
            color: lightblue;
            cursor: pointer;
        }

            .awesomebutton:hover {
                color: deepskyblue;
            }

            .awesomebutton > i {
                color: deepskyblue;
                margin-right: .4em;
            }


        .options .awesomebutton {
            display: inline-block;
            *display: inline;
            zoom: 1;
            padding: .4em .6em;
            padding-left: 32px;
            background-position: left center;
            background-repeat: no-repeat;
            padding-top: .6em;
            padding-bottom: .6em;
            background-position: 8px center;
            padding-right: 1em;
            border-radius: .2em;
        }

        .awesomebutton.selected {
            background-color: #212a38;
            color: #d9f2ff;
        }

        .awesomebutton.deselected {
            color: #4f687d;
        }

        .awesomebutton.settings {
            background-image: url(images/settings.png);
        }

        .awesomebutton.list {
            background-image: url(images/lw.png);
        }

        .awesomebutton.cell {
            background-image: url(images/cellview.png);
        }

        .button {
            color: lightblue;
            cursor: pointer;
        }

            .button:hover {
                color: deepskyblue;
            }

            .button > img {
                display: inline;
                width: 24px;
                height: 24px;
            }

            .button > span {
            }

        .fleximobile {
            text-align: center;
            padding: 0 1em;
            padding: 0;
            background-image:url(1156.jpg);
            margin-top:-8px;
        }

            .fleximobile > * {
                text-align: left;
            }


        table.rows {
            /*border-spacing: 1em;*/
            margin: 1 auto;
            /*transition: display ease-in 500ms;*/
            border: none;
            min-width: 350px;
            min-height:auto;
        }

            table.rows thead th {
                border-bottom: 1px #8397b5 solid;
                font-size: 80%;
                color: #9cdcfe;
                font-weight: 300;
                padding-bottom: .5em;
                text-align: center;
                padding-left: 0;
                padding-right: 0;
            }

                table.rows thead th:last-child {
                    /*text-align: left;
            padding-left: 2.4em;*/
                    text-align: right;
                    padding-right: 1em;
                }

            table.rows > tbody > tr {
                transition: background-color ease-in 150ms;
            }


                table.rows > tbody > tr:hover {
                    background-color: #2f353e;
                }

            table.rows thead tr > th:first-child {
                padding-left: 2em;
                padding-left: 0;
                padding-right: 0;
                text-align: right;
            }

            table.rows tbody tr > * {
                font-weight: 300;
                font-size: 110%;
                padding: .8em 2em .8em 0;
                padding: 0;
                border-bottom: 1px #212a38 solid;
                text-align: right;
            }

        td.rate > span {
            font-weight: 400;
        }

        table.rows tbody tr > th {
            padding-left: 1em;
            padding-top: .10em;
            padding-bottom: .15em;
        }

        table.rows tbody tr > td:last-child {
            padding-right: 1em;
            text-align: right;
        }

        table.rows td > span {
            /*padding: .5em 1em .5em 1em;*/
            padding: .3em .5em .3em .5em;
            border-radius: .2em;
            transition: background-color ease-in 130ms;
            margin: 0 1.4em;
        }

        table.cells {
            margin: 1em auto 0 auto;
            border-collapse: collapse;
        }

            table.cells > tbody {
                display: block;
                /*height: 424px;*/
                max-height: 600px;
                overflow-y: auto;
                overflow-x: hidden;
                padding-right: 16px;
            }

                table.cells > tbody td {
                    position: relative;
                    padding: 1em 2em;
                    border: 1px #212a38 solid;
                    background-repeat: no-repeat;
                    background-size: 64px;
                    background-position: -18px -18px;
                    padding: .4em 2em 1em 2em;
                    padding: .4em 2em 0 2em;
                    padding: 1em 1.2em;
                    transition: background-position linear 200ms;
                    text-align: center;
                    max-width: 108px;
                }


            table.cells td:hover {
                background-position: -14px -14px;
            }

            /*table.cells td > span.env {
            font-size: 1.2em;
            font-weight: 400;*/
            /*padding: 5px 1em 0 18px;*/
            /*margin: 0;*/
            /*background: none;*/
            /*padding: .2em 0 0 0;*/
            /*margin-bottom: .4em;*/
            /*}*/

            table.cells td span.enve {
                /*display: none;*/
                /*margin-bottom: .4em;*/
                font-size: .10em;
                font-weight: 300;
                padding: 0 .6em;
                padding: 0;
                margin: 0 0 .6em 0;
                white-space: normal;
                white-space: nowrap;
                max-width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
            }

            table.cells td > span {
                display: block;

            }

            table.cells span.buy, table.cells span.sell {
                display: none;
            }

             td > span.indicator {
            display: inline;
            padding: 0 1em;
    
            margin: 0;
            border-radius: .2em;
        }

        table.cells .indicator {
            font-size: 1em;
            padding: 0 .6em;
            margin-top: .6em;
        }

        table.cells .env {
            font-size: 1.9em;
            /*padding-left: 28px;*/
            text-align: right;
            text-align: center;
            display: inline;
        }

        table.cells td.up .enve {
            color: #39bb3d;
            color: #9abd9a;
        }

        table.cells td.down .enve {
            color: #ff8686;
        }

        table.rows tr.down span.indicator {
            color: #c18d8d;
            color: #da5858;
        }

        table.cells td.down > span.indicator {
            background-color: #d35c5c;
            background-color: #d35c5c;
            color: brown;
            color: white;
        }

            table.cells td.down > span.indicator::before {
                content: "%";
            }

        table.rows tr.up span.indicator {
            color: #8cf28c;
        }

        table.cells td.up > span.indicator {
            background-color: #5eaa5e;
            color: #006400;
            color: white;
        }

        span.indicator::before {
            content: "%";
        }

        table.rows td.none > span.indicator {
            opacity: .2;
            font-weight: 200;
        }


        table.cells td.up > span.indicator::before {
            content: "%+";
        }

        table.cells td .rates {
            margin: .6em 0 .8em 0;
        }

            table.cells td .rates > span {
                display: block;
                font-size: 1.4em;
                padding: .2em .6em;
                padding: .1em .2em;
                margin-bottom: .1em;
                border-radius: .2em;
            }

        table.cells {
            display: none;
            border-spacing: .5em;
            border-collapse: separate;
            margin: 0 1em 1em 1em;
            overflow: hidden;
            margin-top: -.8em;
            margin: 1em auto;
        }

        div.tab table.cells {
            margin: 1em auto 0 auto;
        }

        table.cells td.down {
            background: brown;
            border: 1px #791c1c solid;
            border-radius: .2em;
            box-shadow: 2px 2px 4px #711717;
            background: rgba(239,83,80,.15);
        }

        table.cells td.up {
            background: darkgreen;
            border: 1px #18996D solid;
            border-radius: .2em;
            box-shadow: 1px 1px 4px #25B785;
            background: #197D5B;
            background: -moz-linear-gradient(top, #197D5B 0%, #094D36 100%);
            background: -webkit-linear-gradient(top, #197D5B 0%,#094D36 100%);
            background: linear-gradient(to bottom, #197D5B 0%,#094D36 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#197D5B', endColorstr='#094D36',GradientType=0 );
            background: rgba(38,166,154,.15);
        }


        table.cells td.none {
            background: darkgreen;
            border: 1px #3e3e3e solid;
            border-radius: .2em;
            box-shadow: 1px 1px 4px #4c4b4b;
            background: #464646;
            background: -moz-linear-gradient(top, #212a38 0%, #090b10 100%);
            background: -webkit-linear-gradient(top, #212a38 0%,#090b10 100%);
            background: linear-gradient(to bottom, #212a38 0%,#090b10 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#212a38', endColorstr='#090b10',GradientType=0 );
        }

     
        span.env {
            background-repeat: no-repeat;
            background-position: right center;
            background-size: auto 100%;
            padding-right: 24px;
            transition: background ease-in 500ms;
        }

        .down span.env {
            background-image: url(images/down.png);
            filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='images/down.png', sizingMethod='scale');
            -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader( src='/images/down.png', sizingMethod='scale')";
        }

        .up span.env {
            background-image: url(images/up.png);
        }

        .none span.env {
            background-image: url(images/none.png);
        }
       
       span.up {
            background-color: #13503B;
            background-color: #197D5B;
        }



        span.down {
            background-color: #5B2036;
            background-color: #7B2645;
            background-color: #460E23;
        }

        .son {
            font-size: 120%;
            font-weight: 300;
        }

        table.rows .son {
            font-size: 100%;
        }

        table.cells span.down {
            background: transparent;
            color: #ff7f7f;
            color: #ffa8a8;
        }

        table.cells span.up {
            background: transparent;
            color: #9cff9c;
        }

        table.s1 td.up > span {
            background-color: lightblue;
        }



        .up {
            /*background-color: #2c572c;*/
        }

        .down {
            /*background-color: #9d3746;*/
        }

        .close {
            position: absolute;
            top: .6em;
            right: .6em;
            font-size: 140%;
            cursor: pointer;
            color: gold;
        }

            .close:hover {
                color: lightblue;
            }

       

        .env {
            background-repeat: no-repeat;
            background-position: left center;
            background-size: auto 100%;
            padding-left: 24px;
            font-weight: 500;
            text-align: left;
        }

        .enve {
            display: block;
            font-size: 100%;
            color: #527080;
            color: #828282;
            white-space: nowrap;
        }

@media (max-width:375px) {
    div#page {
        font-size: 90%;
    }

    img#mmicon {
        width: 27px;
        height: 18px;
    }

    /*#mmlabel {
        font-size: .8em;
        margin-top: 2px;
    }*/

    table.rows tbody tr > th {
        padding-left: .4em;
        max-width: 110px;
    }

    table.cells > tbody td {
        padding-left: .2em;
        padding-right: .2em;
    }

    table.rows {
        margin-top: 2em;
    }
    #banner img.logo {
        min-width:176px;
        height: 60px;
    }
}


@media (max-width:359px) {
    body {
        font-size: 90%;
    }

    .fleximobile {
        padding-left: .1em;
        padding-right: .1em;
    }

    img#mmicon {
        width: 23px;
        height: 15px;
    }
    
    

    #mmlabel {
        font-size: .4em;
        margin-top: 0;
    }

    div.clock2 {
        font-size: 1.2em;
    }

    table.rows tbody tr > th {
        padding-left: .1em;
    }
    
    
}
  
  
  @media (max-width:450px) {

    table.rows td > span {
        /*padding-left:.2em;
        padding-right:.2em;*/
        margin-left: .5em;
        margin-right: .5em;
    }

    table.rows thead th:last-child {
        padding-left: 1 em;
    }

    div.header > div.options {
        top: 2px;
    }

    .enve {
        white-space: unset;
        white-space: pre-line;
        /*max-width: 110px;*/
    }

    td#clock {
        padding-left: 0;
    }

    div.pagewrapper {
        padding: 0;
    }

    div.pane {
        padding-left: 1em;
        padding-right: 1em;
    }

    .tabview {
        padding-left: .3em;
        padding-right: .3em;
    }

    table.cells td {
        min-width: 100px;
        padding: 0 .3em;
    }

    div#converter {
        padding-left: 1em;
        padding-right: 1em;
    }

    div.tab table.cells {
        margin-top: 0;
        margin-bottom: 0;
    }

    table.cells > tbody td {
        padding: .4em .1em 0 .1em;
        padding: .4em .4em 0 .4em;
    }

    div.subpage div.ratebox {
        padding: 1em .1em;
        /*margin: 0;*/
        margin-left: auto;
        margin-right: auto;
        min-width: 96%;
        font-size: 86%;
    }

    table.cells {
        /*margin: 0;*/
    }

    div.subpage {
        padding: .1em;
    }

    div.imagetext > img {
        height: 48px;
        width: 48px;
        padding: .2em;
    }

    div.imagetext > div.text {
        margin-left: 50px;
    }

    #kurumsal > div {
        border-width: 4px !important;
    }

        #kurumsal > div:nth-child(even) > div {
            margin-right: 70px;
        }

    p.title {
        margin: 0;
    }

    table#ik {
        font-size: 80%;
    }

    div.checkboxes > span {
        margin-right: .1em;
    }

    div.header > h1 {
        left: .4em;
    }

    .onoffswitch-label:before {
        width: 12px;
    }

    .onoffswitch-label {
        height: 12px;
    }

        .onoffswitch-label:before {
            right: 16px;
        }

    .onoffswitch {
        width: 25px;
    }
    
        div.rateboxx {
            max-width:90%;
            margin:0px;
            background-color:transparent;
 
        }
        
         .imagerox1
        {
            width:50%;
         
            height:auto;
             margin-left:28%;
            }
            
       .imagerox
        {
           width:50%;
           height:auto;
           display:block;
           
           margin-left:28%;
           margin-top:-25px;
            }
            
    .rateboxx1
        {
        width:100%; height:auto;
    
         }
         
}

@media (max-width:530px) {
    table.rows td > span {
        /*padding-left:.2em;
        padding-right:.2em;*/
        margin-left: .7em;
        margin-right: .7em;
    }

    table.rows tbody tr > td:last-child {
        padding-right: .4em;
    }

    table.rows thead th:last-child {
        padding-left: 1.2em;
    }
    
      div.header > div.options {
        top: 2px;
    }

    .tabview > .header {
        white-space: unset;
    }

    .options .awesomebutton {
        padding: .4em .6em;
        padding-left: 32px;
        background-position: left center;
        background-repeat: no-repeat;
        padding-top: .4em;
        padding-bottom: .4em;
        background-position: 8px center;
        padding-right: .4em;
        border-radius: .2em;
    }
    
          div.rateboxx {
            max-width:90%;
            margin:0px;
            background-color:transparent;
 
        }
        
        
        
    

   

  

    .enve {
        white-space: unset;
        white-space: pre-line;
        /*max-width: 110px;*/
    }

    td#clock {
        padding-left: 0;
    }

    div.pagewrapper {
        padding: 0;
    }

    div.pane {
        padding-left: 1em;
        padding-right: 1em;
    }

    .tabview {
        padding-left: .3em;
        padding-right: .3em;
    }

    table.cells td {
        min-width: 100px;
        padding: 0 .3em;
    }

    div#converter {
        padding-left: 1em;
        padding-right: 1em;
    }

    div.tab table.cells {
        margin-top: 0;
        margin-bottom: 0;
    }

    table.cells > tbody td {
        padding: .4em .1em 0 .1em;
        padding: .4em .4em 0 .4em;
    }

    div.subpage div.ratebox {
        padding: 1em .1em;
        /*margin: 0;*/
        margin-left: auto;
        margin-right: auto;
        min-width: 96%;
        font-size: 86%;
    }

    table.cells {
        /*margin: 0;*/
    }

    div.subpage {
        padding: .1em;
    }

    div.imagetext > img {
        height: 48px;
        width: 48px;
        padding: .2em;
    }

    div.imagetext > div.text {
        margin-left: 50px;
    }

    #kurumsal > div {
        border-width: 4px !important;
    }

        #kurumsal > div:nth-child(even) > div {
            margin-right: 70px;
        }

    p.title {
        margin: 0;
    }

    table#ik {
        font-size: 80%;
    }

    div.checkboxes > span {
        margin-right: .1em;
    }

    div.header > h1 {
        left: .4em;
    }

    .onoffswitch-label:before {
        width: 12px;
    }

    .onoffswitch-label {
        height: 12px;
    }

        .onoffswitch-label:before {
            right: 16px;
        }

    .onoffswitch {
        width: 25px;
    }
    
        div.rateboxx {
            max-width:90%;
            margin:0px;
            background-color:transparent;
 
        }
        
         .imagerox1
        {
            width:50%;
         
            height:auto;
             margin-left:28%;
            }
            
       .imagerox
        {
           width:50%;
           height:auto;
           display:block;
           
           margin-left:28%;
           margin-top:-25px;
            }
            
    .rateboxx1
        {
        width:100%; height:auto;
    
         }
        

}
