@media (min-width: 1025px) and (max-width: 1280px) {
    //CSS
}

/* 
  ##Device = Tablets, Ipads (portrait)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) {
    .Student-details {
        display: flex;
        flex-direction: column;
    }

    div#ctl00_ContentPlaceHolder1_UploadPhoto {
        margin-left: 14px;
    }

    div#ctl00_ContentPlaceHolder1_MotherPhoto {
        margin-left: 35px;
    }

    div#ctl00_ContentPlaceHolder1_FatherPhoto {
        margin-left: 16px;
    }

    .panel-2 {
        padding: 0px 20px 20px 20px;
    }

    .footer {
        height: 132px;
        background-color: #1c2d3d;
        margin-top: 100px;
    }

    input.btn.fill-blue-button-rect.m0 {
        width: auto;
    }

    .OTP-form {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 87vh;
        margin-top: 50px;
        margin-bottom: 50px;
    }
}

/* 
  ##Device = Tablets, Ipads (landscape)
  ##Screen = B/w 768px to 1024px
*/

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    /*.Student-details {
    display: flex;
    flex-direction: column;
}*/

    /*.Student-details {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 24px;
  }*/


    /* ADD THIS — fixes flex overflow */
    .Student-details > div {
        min-width: 0;
        box-sizing: border-box;
    }

    /* ADD THIS — image container stays relative to its column, not fixed px */
    #image_prev_container,
    #image_prev,
    .jcrop-holder {
        max-width: 100% !important;
        width: auto !important;
        box-sizing: border-box;
    }

    .panel-2 {
        padding: 0px 20px 20px 20px;
    }

    .footer {
        height: auto;
        background-color: #1c2d3d;
        margin-top: 100px;
    }
}

/* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
    .online-reg-data {
        padding: 15px 15px;
    }

    .Student-details {
        display: flex;
        flex-direction: column;
    }

    .panel-2 {
        padding: 0px 20px 20px 20px;
    }

    .footer {
        height: auto;
        background-color: #1c2d3d;
        margin-top: 100px;
    }
}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/

@media (min-width: 320px) and (max-width: 480px) {
    .online-reg-data {
        padding: 15px 15px;
    }

    .Student-details {
        display: flex;
        flex-direction: column;
    }

    .panel-2 {
        padding: 0px 20px 20px 20px;
    }

    div#ctl00_ContentPlaceHolder1_UploadPhoto {
        margin-left: 20px;
    }

    .app-right-container {
        padding: 20px 0px 0px 0px;
    }

    .app-left-container {
        padding: 20px 0px 0px 0px;
    }

    .footer {
        height: 132px;
        background-color: #1c2d3d;
        margin: 0px -15px;
    }

    div#ctl00_ContentPlaceHolder1_MotherPhoto {
        margin-left: 35px;
    }

    div#ctl00_ContentPlaceHolder1_FatherPhoto {
        margin-left: 16px;
    }
    /* Stack buttons vertically on mobile */
    .m35 .pull-left,
    .m35 .pull-right {
        float: none !important;
        width: 100%;
        text-align: center;
        margin-bottom: 15px;
    }

    .m35 .pull-left {
        order: 1;
    }

    .m35 .pull-right {
        order: 2;
    }

    .m35 {
        display: flex;
        flex-direction: column;
    }

        .m35 .btn {
            width: 100%;
            margin: 0 0 10px 0 !important;
        }

    .OTP-form {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 93vh;
        margin-top: 50px;
        margin-bottom: 50px;
    }
}