body {
    font-family: One, sans-serif;
    position: relative;
}

.form-element {
    opacity: 0;
    transform: translateY(-20px);
    animation: slideDown 0.7s ease-out forwards;
}

@keyframes slideDown {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

input[type="checkbox"] {
    margin: 5px 5px 0 10px;
    transform: scale(1.5);
    height: 12px;
    width: 12px;
}
input[type="checkbox"]:checked {
    outline: 2px solid #b392d6;
    fill: #b392d6;
}

input[type="checkbox"]:checked + label:before {
    background-color: #b392d6;
    border: 2px solid #b392d6;
}
/* select option {
   height: 100px !important;
} */

#tariff select option {
    color: #662e8f;
}
#phonee select {
    background-color: #662e8f;
    color: white;
    border-color: #662e8f;
}

#phonee select option {
    background-color: #662e8f;
    color: white;
}
#phonee_second select {
    background-color: #662e8f;
    color: white;
    border-color: #662e8f;
}
#phone_second select {
    background-color: #662e8f;
    color: white;
    border-color: #662e8f;
}

#phonee_second select option {
    background-color: #662e8f;
    color: white;
}
#phone_second select option {
    background-color: #662e8f;
    color: white;
}
#phone select {
    background-color: #662e8f;
    color: white;
    border-color: #662e8f;
}

#phone select option {
    background-color: #662e8f;
    color: white;
}
#locationn select {
    background-color: #662e8f;
    color: white;
    border-color: #662e8f;
}

#locationn select option {
    background-color: #662e8f;
    color: white;
}
select option:checked {
    background-color: #662e8f;
    color: #f4c669;
    border-color: 1px solid #f5b01a !important;
}
input[type="submit"]:disabled {
    background-color: #ccc;
    cursor: not-allowed;
  }

  #Platite {
    background-color: rgb(31, 32, 31);
    padding: 10px;
    font-size: 16px;
    margin-bottom: 50px;
  }
  #Platite_esim {
    background-color: rgb(31, 32, 31);
    padding: 10px;
    font-size: 16px;
    margin-bottom: 50px;
  }

  #myButton[disabled] {
    background-color: lightgray;
    color: gray;
    cursor: not-allowed;
  }

 #phone {
    display: none;
 }
 #tp-diff-box {
    display: none;
 }
 #tp-diff-box-sim {
    display: none;
 }
 #email {
    display: none;
 }
 #locationn {
    display: none;
 }
 #checkbox {
    display: none;
 }
 #phonee {
    display: none;
 }
 #emaill {
    display: none;
 }
 #checkboxx {
    display: none;
 }
 #terms-esim {
    display: none;
 }
 #terms-sim {
    display: none;
 }

 .header {
    display: flex;
    position: relative;
 }

 #Montenegro, #Montenegro_tp {
    position: absolute;
    right: 20px;
    height: 50px;
    width: 50px;
    border:5px solid #F5B01A;
    border-radius:3rem;
 }
 #English, #English_tp {
    position: absolute;
    right: 20px;
    height: 50px;
    width: 50px;
    border:5px solid #F5B01A;
    border-radius:3rem;
 }
 #sim {
    height: 60px;
    width: 49%;
    display: flex;
 }
 #esim {
    height: 60px;
    width: 49%;
    display: flex;
 }

 .dim {
   background:#000;
    opacity:0.5;
    position:fixed; /* important to use fixed, not absolute */
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:none;
    z-index:9999;
 }
 .active {
   border: 2px solid rgb(245, 176, 26) !important;
   background-color: rgb(102, 46, 143) !important;
 }
 .inactive {
   border: 2px solid white !important;
   background-color: rgb(142, 95, 183) !important;
   cursor: not-allowed;
 }
 .card-box {
    height: 50px;
    width: 100%;
    margin: 20px 0;
 }
 .tp-about {
    background-color: #f0eaf4;
    color: #8E5FB7;
    border-radius: 0 0 10px 10px;
 }
 .tp-user {
    display: flex; 
    justify-content: space-between; 
    /* padding: 20px;  */
    background-color: #f0eaf4;
    color: #8E5FB7;
    border-radius: 0 0 10px 10px;
    padding: 1.2rem 1.7rem;
 }
 .tp-user  p {
   color: #662e8f;
   font-size: 14px;
   margin: 5px 0;
 }
 .tp-user  span {
   color: #662e8f;
   font-weight: 700;
 }
 .tp-about p {
    padding: 0;
 }
 .tp-about span {
    color: #662e8f;
 }

 #tariff select option {
    background-color: #f0eaf4;
    color: #662e8f;
    line-height: 1rem;
  }

  #lang-pos {
    position: absolute;
    right: 7%;
    /* top: 10px; */
  }
  #logoFooter {
    /* margin-top: 10px; */
    position: absolute;
    right: 5%;
  }
  #logoFooterTp {
   position: absolute;
   right: 14%;
   bottom: 0;
  }

  .tp-about-diff {
      background-color: #ffffff;
      color: #8E5FB7;
      
      /* border-radius: 0 0 10px 10px; */
      padding: 1.2rem 1.7rem;
  }
  .tp-about-diff span {
   color: #662e8f;
  }
  .tp-about-diff1 span {
   color: #662e8f;
  }
  .tp-about-diff1 {
      background-color: #ffffff;
      color: #8E5FB7;
      border-radius: 0 0 10px 10px;
      padding: 1.2rem 1.7rem;
  }
  @media screen and (max-width: 1024px) {
    #logoFooter {
        display: none;
    }
    #Montenegro {
        position: absolute;
        right: -5px;
     }
     #English {
        position: absolute;
        right: -5px;
     }
     #logoFooterTp {
      display: none;
     }
  }

  #Uslovi_koriscenja_esim, #Uslovi_operator_esim, 
  #Uslovi_marketing_esim, #Obavjestenje_operator_esim, 
  #Obavjestenje_operator, #Uslovi_operator, #Uslovi_marketing {
    color: white;
    font-size: 10px;
    margin-top: 6px;
  }

  .tp-content > p {
   font-size: 12px;
   color: #662e8f;
   margin: 3px 0;
   width: 80%;
   margin-bottom: 10px;
  }
  .tp-content span{
   font-weight: 700;
  }