@font-face{
    font-family: 'mitra';
    src: url('/fonts/B Mitra_0.ttf');
}

#exchangeModal{
    top: 8%;
    overflow: auto !important;
    height: auto;
}

#exchangeModal::-webkit-scrollbar {
    display: none;
}

.ex-header{
    background-color: rgba(120, 146, 148, 0.49);
    color: black;
    direction: ltr;
}

.ex-body{
    background-color: #e9ecef;
    color: black;
    direction: ltr;
}

.coin-row{
    background-color: rgba(120, 146, 148, 0.49);
    box-shadow: 5px 8px 12px 3px #2a4441;
    height: auto;
    margin: 10px 10px 35px;
    direction: ltr;
}

.coin_name{
    color: #007bff;
    font-size: 15pt;
    font-weight: bold;
    padding: 15px 30px 0px;
    text-align: center;
    font-family: 'Times New Roman', Times, serif;
}

.price-row{
    direction: rtl;
}

.price{
    font-size: 14pt;
    text-align: center;
    font-weight: bold;
    font-family: 'mitra';
}

.exchange_btn{
    background-color: #064c77;
    color: white;
    font-size: 14pt;
    height: 30px;
    line-height: 15px;
    margin: 20px auto;
    width: 100px;
}

.exchange_btn:hover{
    color: white;
    font-weight: bold;
    box-shadow: 2px 0px 20px 2px darkslategrey;
}

.price_digit{
    letter-spacing: 2px;
    font-size: 14pt;
    left: 20px;
    font-weight: bold;
}

#sell_price{
    color: #2a824d;
}

#buy_price{
    color: #ce0a0a;
}

.amount{
    float: right;
    font-size:14pt ;
    font-family: 'mitra';
    font-weight: bold;
    margin-right: 20px;
}

.amount_inp{
    width: 50%;
    float: left;
    margin-left: 50px;
}

.amount-div{
    margin: 10px auto;
}

.symbol{
    width: 30%;
}

.name{
    width: 70%;
}

.B_txt {
    font-size: 13pt;
    width: 100%;
    text-align: right;
    font-weight: bold;
    padding-right:20px;
    margin-top: 10px;
}

.B_digits{
    font-size: 13pt;
    width: 100%;
    text-align: left;
    font-weight: bold;
    padding-left:20px ;
}

#buy_btn{
    background-color: #237a23;
}

#sell_btn{
    background-color: #df2335;
}

/*------------------------------------------media------------------------------------------*/

@media (max-width:450px){
    
    .amount-div {
        margin: 10px auto;
        width: 30%;
    }

}

@media (min-width:450px) and (max-width:576px){
    .sell{
        width: 50%;
        float: left;
    }

    .buy{
        width: 50%;
        float: right;
    }
}