/*Small devices (landscape phones, 576px and up) */
@media (min-width: 340px) and (max-width: 480px) {
  .login-col-img .image-text,
  .forgot-password-col-img .image-text,
  .signup-col-img .image-text,
  .account-found-col-img .image-text {
    bottom: 30px;
  }
  .badgebox + .badge {
    width: 24%;
    left: 10%;
  }
  #otp-wrapper #dialog #form {
    width: 60vw;
  }

  .services-electric-pole-img img {
    margin-top: 0%;
  }
  .card-tab-container ul li {
    width: 100%;
  }
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .page-content .signup-col-inputs,
  .page-content .account-found-col-inputs,
  .page-content .login-col-inputs,
  .page-content .forgot-password-col-inputs {
    height: 100vh;
    overflow-y: unset;
  }

  .page-content .login-col-inputs,
  .page-content .forgot-password-col-inputs,
  .page-content .signup-col-inputs,
  .page-content .account-found-col-inputs {
    padding: 1rem;
  }
  .page-content {
    overflow-y: scroll;
  }
  .image-text h1 {
    font-size: 2rem;
  }
  .def-text {
    font-size: 0.9rem;
  }

  .page-content .login-col-img,
  .page-content .forgot-password-col-img,
  .page-content .signup-col-img,
  .page-content .account-found-col-img {
    height: 55vh;
  }

  .login-logo {
    max-width: 45%;
  }
  .modal-header .close {
    width: 16% !important;
  }

  .login-form .form-group input,
  .forgot-password-form .form-group input,
  .signup-form .form-group input {
    font-size: 0.8rem;
  }

  .login-info-title,
  .forgot-password-info-title,
  .signup-info-title {
    font-size: 1.8rem;
  }
  .gender-img {
    max-width: 55%;
  }

  .gender-options {
    width: 48.9%;
  }

  .badgebox + .badge {
    width: 22%;
    left: 10%;
  }

  .track-timeline-wrapper {
    min-width: 275px;
  }

  .activities-item img {
    max-width: 10vw;
  }

  .activities-select {
    margin-top: 2%;
  }

  .c-datepicker-date-editor {
    margin-bottom: 20%;
    white-space: wrap !important;
  }

  .account-found-form > ul > li ul > li:nth-child(1) {
    font-size: 16px;
    vertical-align: middle;
  }

  .account-found-form > ul > li ul > li {
    font-size: 12px;
  }

  .account-found-form .account-col-cont {
    width: 90%;
  }

  .account-found-form .account-col-radio {
    width: 0%;
    padding-left: 0px;
  }

  .main-container input {
    margin: 2%;
  }

  .custom-control-label::before,
  .custom-control-label::after {
    width: 1rem !important;
    height: 1rem !important;
  }

  #otp-wrapper #dialog #form {
    width: 50vw;
  }

  .services-electric-pole-img img {
    margin-top: 0%;
  }

  .card-tab-container ul li {
    width: 100%;
  }

  .service-table img {
    max-width: 100% !important;
    margin-top: auto;
    margin-bottom: auto;
  }

  .service-table .service-head-title {
    font-size: 1rem;
  }

  .service-table .service-head-desc {
    font-size: 0.8rem;
  }

  .start-service-table tr td input {
    font-size: 10px;
    padding: 0.5rem 2rem 0.5rem 1rem;
  }

  .start-service-table select {
    font-size: 10px;
  }

  .card-tab-indi img {
    max-width: 5%;
  }

  .card-tab-indi {
    position: relative;
    left: 58.5%;
  }

  .card-tab .nav-item .card-item .card-badge-container {
    width: 112%;
  }

  .track-main-info img {
    max-width: 20%;
  }

  .map-viewr-info {
    position: relative;
    top: -6%;
  }

  .map-viewr-info img {
    max-width: 100%;
  }

  .accont-table {
    width: max-content;
  }

  .main-container .white-bg {
    padding: 1%;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
}

/* Large devices (laptops/desktops, 992px and up) */
@media (min-width: 1300px) and (max-width: 1500px) {
  .gender-options {
    width: 49%;
  }
  .gender-img {
    max-width: 50% !important;
  }
  .badgebox + .badge {
    width: 21%;
    left: 5%;
  }

  .subscribe-btn {
    width: 65%;
  }

  .gender-options-radio input[type="radio"] + label span {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin: 0 auto;
    vertical-align: middle;
    cursor: pointer;
    border-radius: 50%;
    border: 1px solid #e5ddd5;
    background-repeat: no-repeat;
    background-position: center;
    text-align: center;
    line-height: 23px;
  }

  /*.radio label {
    width: 10em;
}
*/
  .bill-trans-table .trans-title {
    font-size: 12px;
    font-weight: 500;
  }

  .account-found-form > ul > li ul > li:nth-child(1) {
    font-size: 17px;
    vertical-align: middle;
  }

  .account-found-form > ul > li ul > li {
    font-size: 13px;
  }

  .login-form .form-group input,
  .forgot-password-form .form-group input,
  .signup-form .form-group input {
    font-size: 0.9rem;
  }
  .page-content .login-col-inputs,
  .page-content .forgot-password-col-inputs {
    height: 100vh;
    overflow-y: scroll;
  }

  #otp-wrapper #dialog #form {
    width: 60vw;
  }
  .card-tab-container ul li {
    width: 40%;
  }

  .settings-tab li a {
    font-size: 14px;
  }
  .side-menu {
    font-size: 14px;
  }
  .acc-select-table tr td {
    font-size: 14px;
  }

  .activities-table {
    font-size: 0.84rem;
  }

  .subcribe-desc {
    font-size: 0.9rem;
  }

  .page-content .login-col-inputs,
  .page-content .forgot-password-col-inputs,
  .page-content .signup-col-inputs,
  .page-content .account-found-col-inputs {
    padding: 1.5rem 10rem 1.5rem 5rem;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  #otp-wrapper #dialog #form {
    width: 18vw;
  }
}

@media (min-width: 1537px) and (max-width: 1920px) {
  .card-badge-container .card .account-info-postpaid-table,
  .card-badge-container .card .account-info-prepaid-table {
    font-size: 0.6rem;
  }

  body {
    font-size: 75%;
  }

  .side-menu {
    font-size: 13px;
  }

  .gender-img {
    max-width: 30%;
  }
  .account-col-cont {
    padding: 1.5rem 10rem 1.5rem 5rem;
  }
}
@media (min-width: 576px) {
  /*.rounded-nav {
    border-radius: 50rem !important;
  }*/
}

@media (min-width: 576px) {
  .rounded-nav .nav-link {
    border-radius: 50rem !important;
  }
}
