body {
    font-family: "Roboto", serif!important;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    background-color: #5daefa;
}

.eapp {
    max-width: 640px;
    margin: auto;
    padding: 15px;
    height: 100vh;
    color: #fff;
    overflow-x: hidden;
}

.mtitle {
    font-size: 18px;
    font-weight: 500;
    text-align: center;
}
.mdiscr {
    font-size: 18px;
    font-weight: 500;
    text-align: center;
    padding: 15px 15px 15px 15px;
}

.mdiscr span{
    font-size: 22px;
    font-weight: 600;
}

.mdiscr2 {
    text-align: center;
    font-size: 12px;
    color: #fff;
}

.btn_exc {
    text-align: center;
    background: #fff;
    margin-top: 15px;
    padding: 7px 7px 7px 7px;
    border-radius: 8px;
    cursor: pointer;
    color:#fff;
}

.btn_exc:hover {
    background: #fff;
}

.btn_exc .text {
    color:#007cff;
}
.btn_exc img svg:path{
    fill: #fff;
}

.list_op {
    background-color: #81b9fc;
    width: 100%;
    min-height: 100px;
    border-radius: 8px;
    padding: 0.1px 15px 15px 15px;
}

.title_op {
    margin-top: 15px;
    margin-bottom: 5px;
    font-size: 14px;
    color: #fff;
}

.wrapper_one_op {
    padding: 10px;
    background: #76b5fe;
    border-radius: 8px;
    margin-top: 15px;
    color: #ffffff;
}

.title_opl {
    font-size: 18px;
    font-weight: 600;
}

.date_op{
    font-size: 12px;
    color: #ffffff;
}


.count_op {
    text-align: end;
    font-size: 18px;
    font-weight: 600;
    margin-top: 7px;
}

.footer {
    width: 100%;
    height: 100px;
    text-align: center;
    padding: 15px;
    font-size: 14px;
}

.wrapper_cr input{
    background-color: #5daefa;
    border: 0px solid;
    color: #fff;
    font-size: 40px;
    font-weight: 600;
    padding: 0px 0px 0px 0px;
}

input::placeholder{
    color: #fff;
}

.wrapper_cr input:active, 
.wrapper_cr input:hover, 
.wrapper_cr input:focus {
    outline: 0;
    outline-offset: 0;
}
textarea {
    width: 100%;
    height: 70px;
    background: #5daefa;
    border: 0px solid;
    outline: 0;
    color: #fff;
}

.calc_ex_ov {
    font-size: 40px;
    font-weight: 600;
}

.cours_real_ex {
    text-align: center;
    font-size: 12px;
    color: #fff;
}

.footer_ex {
    margin-top: 15px;
}

.check_order {
    width: 100%;
    text-align: center;
    background: #ffffff;
    padding: 22px 10px 22px 10px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    color: #007cff;
}

.check_order:hover {
    background: #ffffff;
}

.back_order {
    margin-top: 10px;
    background: #81b9fc;
    margin-bottom: 15px;
    color: #fff;
}

.back_order:hover {
    background: #81b9fc;
}

.exchange2 .title_ex_v1 {
    padding-bottom: 15px;
}

.form_radio {
    padding-bottom: 10px;
}

.emp_op {
    padding-top: 35px;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
}
.wallet_input {
    width: 100%;
    font-size: 20px!important;
}

/* load wrapper */

/* HTML: <div class="loader"></div> */
.loader {
    --s: 25px;
    --g :5px;  
    
    width: calc(3*(1.353*var(--s) + var(--g)));
    display: grid;
    justify-items: end;
    aspect-ratio: 3;
    overflow: hidden;
    --_m: linear-gradient(90deg,#0000,#000 15px calc(100% - 15px),#0000);
    -webkit-mask: var(--_m);
            mask: var(--_m);

    margin: auto;
    margin-top: 60px;
  }
  .loader:before { 
    content: "";
    width: calc(4*100%/3);
    background:
    conic-gradient(from -90deg at var(--s) calc(0.353*var(--s)),
        #fff 135deg,#666 0 270deg,#aaa 0); 
    --_m:
      linear-gradient(to bottom right,
         #0000 calc(0.25*var(--s)),#000 0 calc(100% - calc(0.25*var(--s)) - 1.414*var(--g)),#0000 0),
      conic-gradient(from -90deg at right var(--g) bottom var(--g),#000 90deg,#0000 0);
     -webkit-mask: var(--_m);
             mask: var(--_m);
    background-size:   calc(100%/4) 100%;
    -webkit-mask-size: calc(100%/4) 100%;
            mask-size: calc(100%/4) 100%;
    -webkit-mask-composite: source-in;
            mask-composite: intersect;
    animation: l8 1s infinite linear;
  }
  @keyframes l8 {
    to {transform:translate(calc(100%/4))}
  }


.loader_wrapper {
    width: 100%;
    height: 100vh;
    background: #5daefa;
}