@rangertechnologies/ngnxt/src/lib/style.css

This library was used for creating dymanic UI based on the input JSON/data

@import "~@ng-select/ng-select/themes/default.theme.css";
@import "@danielmoncada/angular-datetime-picker/assets/style/picker.min.css";
@import '~quill/dist/quill.bubble.css';
@import "@danielmoncada/angular-datetime-picker/assets/style/picker.min.css"; /* AP-04FEB25 date-picker */
/* @import '~font-awesome/css/font-awesome.css'; */
/*General Nxt App stylings */
.rusty{
    width: 235px;
    background-color: #cd2810;
    color: #fff;
    text-align: center;
    font-size: 24px;
    height: 60px;
    margin-left: 0%;
    margin-top: 11%;
    cursor: pointer;
  }

  .edit{
    background-color: #dedddd;
    border: none;
    color: #c5281c;
    text-decoration: underline;
    margin-bottom: 1%;
    margin-left: 50%;
    /* padding-left: 4% ; */
    font-size: 16px;
    cursor: pointer;
    font-weight: bold;
  }

  .icon-edit{
    width: 15px;
    height: 18px;
    margin: 0px 6px 1px -2%;
    margin-left: -13%;
  }

  .icon-edit1{
    width: 29px;
    height: 28px;
  }

  .icon-edit-summary{
    width: 29px;
    height: 28px;
  }

  .questiondiv1{
    padding-left: 25px;
    padding-right: 25px;
  }

  .questiondiv2{
    padding-top: 0px;
    padding-bottom: 20px ;
    padding-left: 11px;
  }



  @media screen and (min-width: 689px) {
    #progress{
    padding-left: 12px;
  }
  #progress-summary{
    padding-left: 12px;
  }
  .backicon{
  display: none;
  }
  .dt-time{
    background-position: 98% !important;
  }

  }


  .bgColor{
    text-align: center;
    background-color: #dedddd;
  }

  .questionalign{
      text-align: center ;
      padding-right: 4% ;
      margin-bottom: 4px;
      margin-top: 2rem;
      color: #560d05;
  }

  .largeTitle{
    padding-left: 16px;
    padding-top: 12px;
  }

  .question-f-size{
    font-size: 0.7rem ;
  }

  .non{
    background-color: #dedddd;
  }

  /* #progress2{
    display: block;
    margin-top: -26px;
    margin-bottom: 6px;
    width: 96%;
    margin-left: 18px;
    background-color: #dedddd;
  } */

  .circle{
    margin-left: 25px;
  }

  .titlebar{
    padding-left: 10%;
    padding-top: 1%;
    padding-right: 10%;
  }
  .infodiv{
    padding-left: 2rem ;
    overflow: hidden ;
  }

  .info-alert{
    border: 1px solid #e6e6e6;
    border-radius: 5px ;
    padding: 0.5em ;
    margin-left: 15px ;
    margin-right: 15px ;
    margin-bottom: 1rem ;
    display: flex ;
  }

  .addtional-info{
    margin-left: -33px;
    margin-top: -21px;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    color: #6f7072;
    font-family: Helvetica;
  }

  .ques-alert1{
    margin-bottom: 1rem ;
    display: flex ;
  }

  .iposition{
    margin-left: 3rem ;
  }

  .col-md-1,
  .col-md-10,
  .col-md-11,
  .col-md-12,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9{
    position: relative ;
    padding: 20px ;
    float: center ;
    width: 100%;
  }
  .col-md-12{
    padding: 0px !important ;
  }


  .cond-div2{
    color: red ;
    font-weight: bold ;
    padding-bottom: 3%;
  }

  .radiotext{
    margin-top: -30px;
  }

  .radiocontainer{
    display: flex;
    flex-direction: row-reverse;
    border: 1px solid none ;
    border-radius: .3em;
    padding: 0 ;
    /* margin-left: 31px; */
    align-items: center;
    text-align: center;
    cursor: pointer;
    font-family: Rubik,Helvetica Neue,Helvetica,Roboto,Arial,sans-serif;
    color: #a3a2a2;
  }

  .radioOption{
    display: flex;
    align-content: flex-start;
    margin-top: -16px;
    width: 6%;
  }
 /* HA 20FEB24 Removed checkmark styling from this as it is not used anywhere except input component and the input component is used nowhere */
  .myt-time{
    width: fit-content !important;
    background-image: none;
    background: #dedddd;
    margin: 0px;
    padding: 0px;
    border: none;
    font-size: 15px;
    letter-spacing: 1px;
  }

  .showminute{
    padding-left: 5px;
    margin-top: 0%;
  }

  .myt-time1{
    margin-top: -32px ;
    margin-left: -15px ;
  }

  .myt-dateTimeNew{
    margin-left: -14px ;
  }

  .myt-hour{
    width: fit-content;
  }

  .date-time{
    padding: 0px ;
    margin: 0px ;
    text-align: left ;
  }

  .dateandTime{
    border: 1px solid #d2d4d6;
    position: relative ;
    display: flex ;
    border-radius: 2px ;
    background-image: url("https://dynamic-css1.s3.ap-south-1.amazonaws.com/External+css/time.svg") ;
    background-size: 25px ;
    background-repeat: no-repeat ;
    background-position: 99% center ;
    background-color: #fff ;
    height: 37px;
  }

  .date-line{
    border-bottom: 1px solid #fff;
  }

  .dt-time{
    width:57%;
    margin-left: 2.3%;
    text-align: left;
    background-image: url("https://rnxt.s3.amazonaws.com/MytIcon/icon-clock%402x.png") !important;
    background-size: 25px !important;
    background-repeat: no-repeat !important;
    background: #dedddd;
  }

  .date-picker{
    width: 57% ;
    margin-left: 2.5%;
    height: 44px ;
    border-radius: 5px;
  }

  .datetime:focus{
    border: none ;
    box-shadow: none ;
  }

  #meridiem{
    margin-top: -2px;
    border: hidden;
  }

  .dis-flex{
    display: flex ;
    justify-content: center;
  }

  .textBox{
    width: 100% ;
    height: 36px;
  }

  .textBox1{
    width: 100% ;
    height: 36px;
    margin-left: -17px ;
  }

  .option{
    color: #767676 ;
  }

  .paddingnone{
    /* padding-top: 0% ; */
    padding-bottom: 0% ;
  }

  .paddingZero{
    padding: 0px ;
  }

  .summary-h{
    text-align: left ;
    padding-bottom: 15px ;
  }

  .summary{
    /* display: block ;
    border: 1px solid #e6e6e6 ;
    border-radius: 5px ;
    padding: 0.5em ;
    margin-left: 15px ;
    margin-right: 15px ;
    background-color: #eaeef1 ;
    text-align: left ;
    cursor: pointer ;
    display: list-item ;
    list-style-type: none; */
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .asum{
    color: #6f7072 ;
    margin-top: 5%;
    padding-left: 3%;
  }

  .question{
    padding-left: 5px;
    font-size: 14px;
    color: #007bff;
  }
  .question1{
    margin-left: 14rem;
    background: #dedddd;
    color: #560d05 ;
    font-size: 15px;
    padding-bottom: 20px;
    text-align: left;
  }



  .answer{
    /* max-width: 55%;
    margin-left: auto;
    margin-right: auto;
    color: #a3a2a2;
    margin-top: -3%;
    padding-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    word-wrap: break-word;
    text-align: left;
    background: #dedddd;
    border-bottom: 1px solid #fff; */
    display: flex;
    align-items: baseline;
    padding: 5px;

  }

  .answer1{
    max-width: 55%;
    margin-left: auto;
    margin-right: auto;
    color: #a3a2a2;
    margin-top: 0%;
    padding-bottom: 0;
    font-size: 14px;
    font-weight: 400;
    word-wrap: break-word;
    text-align: left;
    background: #dedddd;
    border-bottom: 1px solid #fff;

  }

  .myt-font{
    font-size: 20px ;
  }

  .myt-font1{
    width: 16rem;
    font-size: 14px ;
    font-weight: normal ;
  }

  .myt-font2{
    font-size: 18px;
  }

  .myt-font3{
    font-size: 14px ;
  }

  .myt-font4{
    font-size: 14px;
  }

  .myt-font5{
    margin-top: -18px;
    font-weight: normal;
    font-size: 14px;
    color: #560d05;
  }
  .myt-font6{
    font-size: 20px ;
    font-weight: bold ;
    color: #c5281c;
    text-align: center;
  }

/* .custom-select{
    color: red;
  } */


  .myt-font10{
    margin-top: -6px;
    font-weight: normal;
    font-size: 14px;
    color: #560d05;
    margin-top: 10px;
  }
  .myt-font7{
    display: flex;
    justify-content: flex-start;
    padding-left: 20.5%;
    font-weight: 100 ;
    color: #560d05 ;
  }

  .myt-font8{
    font-weight: normal;
  }

  .dpDown:focus-visible{
    outline: none;
  }

  .summaryTitle{
    padding-left: 0%;
    padding-top: 4%;
  }

  .summary-groupText{
    width: 55%;
    margin: auto;
    text-align: left;
    font-weight: 700 ;
    padding-top: 0%;
    padding-bottom: 0%;
    margin-bottom: -2%;
    background-color: #dedddd;
    color:#c5281c;
  }
  .sum-ques{
    width: 55%;
    margin: auto;
  }
  .sum-ques1{
    width: 59%;
    margin: auto;
  }

  /*file upload start*/
  .file-upload-btn{
    display: none;
    border-bottom: groove;
  }
  .file-upload-box{
    max-width: 45%;
    margin-left: 29.5%;
    height: auto;
    padding: 16px;
    display: flex;
    border: 2px;
    border-bottom: 1px solid #fff;
    background-color: #dedddd;
    justify-content: space-between;
    color: #d8d8d8;
  }
  .file-label{
    cursor: pointer;
    color: #c5281c;
    text-decoration:underline
  }
  .file-uploading-box{
    /*border-bottom: groove;*/
    font-size: 14px ;
    font-weight: normal ;
    max-width: 45%;
    margin-left: 29.5%;
    height: 56px;
    padding: 16px;
    display: flex;
    border: 2px;
    background-color: #dedddd;
    justify-content: space-between;
    margin-bottom: 0px;
    color: #d8d8d8;
  }
  .uploading-file-name{
    color:#6f7072;
  }
  /*file upload end*/
  .deleteIcon{
    cursor: pointer;
    height: 24px;
  }
  .file-icon{
    max-width: 24px;
    height:26px;
  }
  .picture-upload{
    height: 200px ;
    width: 200px ;
    position: relative ;
    border: 1px solid #ccc ;
    display: flex ;
    padding: 6px 12px ;
    cursor: pointer ;
    background-color: #ffffff ;
    align-items: center ;
  }

  .colon{
    line-height: 42px ;
    padding: 0 ;
    margin-top: 10%;
    color: #6f7072;
  }

  .colon1{
    display: contents;
  }

  .subTitle{
    color: #c5281c;
    font-weight: 600;
    margin-top:-3%;
  }

  .subTitle1{
    color: #560d05;
    font-size: 14px;
    font-weight: 500;
  }

  .check-icon{
    color: #87be1c ;
    margin-left: -2rem ;
    z-index: 1 ;
    padding: 5px ;
    margin-top: 0.4rem ;
  }

  .check-icon2{
    color: #87be1c ;
    margin-left: -4rem ;
    z-index: 1 ;
    margin-top: 0.6rem ;
    line-height: 3;
  }

  .check-icon3{
    color: #87be1c ;
    margin-left: -4rem ;
    z-index: 1 ;
    margin-top: 3rem ;
  }

  .align-l{
    text-align: left ;
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 1%;
    padding-bottom: 2%;
    margin-bottom: -5%;
    margin-top: -1%;
  }

  .attach-ulist{
    list-style-type: none ;
    margin-left: 0 ;
    margin-bottom: 0.7rem ;
  }

  .attach-list{
    float: right ;
    cursor: pointer ;
    padding: 0px ;
  }

  .icolor{
    color: #99b5ce ;
  }

  .picture-upload-child{
    position: absolute ;
    top: 50% ;
    left: 50% ;
    transform: translate(-50%, -50%) ;
  }
  .tspan:nth-child(1){
    font-size: 25px ;
    font-weight: bold ;
  }

  .tspan:nth-child(2){
    display: none ;
  }

  .pic-upload{
    position: absolute ;
    top: 15% ;
    left: 85% ;
    transform: translate(-50%, -50%) ;
  }

  .btn-block + .btn-block{
    margin-top: 0.5rem ;
  }

  input{
    width: 100% ;
  }

  .btn-lg,
  .btn-group-lg > .btn{
    padding: 0.5rem 1rem ;
    font-size: 1.25rem ;
    line-height: 1.5 ;
    border-radius: 0.3rem ;
  }
  .btn-lg + .dropdown-toggle-split,
  .btn-group-lg > .btn + .dropdown-toggle-split{
    padding-right: 0.75rem ;
    padding-left: 0.75rem ;
  }

  .btn-primary:hover{
    color: #fff;
  }
  .btn-primary:focus,
  .btn-primary.focus{
    color: #fff;
    box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5) ;
  }
  .btn-primary.disabled,
  .btn-primary:disabled{
    color: #fff ;
  }
  .btn-primary:not(:disabled):not(.disabled):active,
  .btn-primary:not(:disabled):not(.disabled).active,
  .show > .btn-primary.dropdown-toggle{
    color: #fff;
  }
  .btn-primary:not(:disabled):not(.disabled):active:focus,
  .btn-primary:not(:disabled):not(.disabled).active:focus,
  .show > .btn-primary.dropdown-toggle:focus{
    box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5) ;
  }

  .btn-back-color{
    display: block ;
    width: 100% ;
    padding: 0.5rem 1rem ;
    padding-top: 0.5rem ;
    padding-right: 1rem ;
    padding-bottom: 0.5rem ;
    padding-left: 1rem ;
    font-size: 1.25rem ;
    line-height: 1.5 ;
    text-align: center ;
    border-radius: 0.3rem ;
    margin: 0 ;
  }

  .fa-plus:hover{
    color: #87be1c ;
  }

  .fa-plus{
    color: #99b5ce ;
  }

  .btn-primary{
    border-color: #007bff ;
  }

  .ques-Title{
    text-align: left;
    font-size: 24px;
  }

  .grey{
    width: 38%;
    height: 56px;
    margin: 0px 0px 0px 0rem;
    padding: 14px 0px 17px;
    background-color: #cd2810;
    color: #fff;
    font-size: 24px;
  }

  .btn-text{
      width: 330px ;
      font-size: 24px;
      background-color: #cd2810;
      color: #fff;
      height: 60px;
      margin-left: auto;
      margin-top: 0px;
      cursor: pointer;
      border-radius: 40px;
  }
  .btn-text2{
      width: 21rem;
      font-size: 24px;
      background-color: #cd2810;
      border: none;
      color: #fff;
      height: 60px;
      margin-left: 17rem;
      margin-right: 17rem;
      margin-top: 10px;
      cursor: pointer;
      border-radius: 40px;
  }

  .flexer{
    max-width: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .flexer1{
    max-width: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 32px;
  }
  .btn-r{
    right: 0rem;
  }

  .down{
    margin-left: 0;
    width: 57%;
  }

  .down1{
    width: 16rem;
    margin-left: 0rem;
    background-color: #dedddd ;
  }

  .down2{
    margin-top: 0%;
    padding-left: 11px;
  }

  .dropbox{
    margin-left: 21.5rem;
  }

  .myt-dropbox{
    background-image: url(https://rnxt.s3.amazonaws.com/MytIcon/down-red.png) ;
    background-origin: content-box;
    background-position: right -.9rem center;
    background-repeat: no-repeat;
    background-size: 35px 33px;
    padding-right: 1.35rem;
    background-color: #dedddd;
  }

  .boxoutline{
    outline: transparent;
    background-color: #dedddd;
  }

  .left-bt{
      width: 238px;
      background-color: #cd2810;
      color: #fff;
      padding: 0;
      text-align: center;
      font-size: 24px;
      cursor: pointer;
      height: 60px;
      margin-top: 125px;
      margin-bottom: 4rem;
      margin-left: -234px;
  }

  .townArea{
    text-align: left;
    height: 43px;
    padding-left: 15px;
  }
  .townArea:hover{
    background-color: rgba(158, 158, 158, 0.18);
  }

  .listFlow{
    font-weight: normal ;
    color: #767676 ;
    z-index: 2;
    position: absolute;
    background: #dedddd;
    box-shadow: 0 2px 5px rgb(0 0 0 / 25%);
  }

  /*Client specific stylings*/

  .myt-radio  input[type='radio']:checked:after{
    background-color: #c5281c;
  }

  .full-summary{
    margin-top: 4%;
  }

  /* / Hide the browser's default radio button / */
  .container-radio input{
    display: none;
    position: absolute;
    opacity: 0;
    cursor: pointer;
  }
    /* / radio text / */
  .f-Name{
        color:#6f7072;
        font-size: 14px;
        font-weight: normal;
        word-break: break-word;
  }

  .summary-top{
    margin-top: 4%;
  }

  .myt-border-r{
    border-top: none ;
    border-left: none ;
    border-right: none ;
    border-radius: 0 ;
  }

  .myt-align{
    margin-left: 4%;
    line-height: 2;
  }

  .myt-align1{
    margin-left: -29px;
  }

  .myt-align2{
    margin-left: -15px;
  }

  .myt-align3{
    width: 100% ;
  }

  .myt-book1{
    margin-top: -20px ;
  }

  .colorf{
    color: #555 ;
  }
  /*newly added*/
  .bookText{
    width:57%;
    margin-left:21.5%;
    background-color: #dedddd;
  }

  .book{
  width:32.6%;
  margin-left: 34%;
  background-color: #dedddd;
  }

  .summary-completed{
    padding-left: 2%;
    margin-top: 20px;
  }

  .town{
    /* margin:auto;
    width: 57%; */
    margin: 0;
    background-color: #dedddd;
  }
  .town-drop{
    margin:auto;
    width: 57%;
  }

  /* my changes  */
  /* ng-select */

.ng-select.ng-select-single .ng-select-container{
  height: 36px;
  border: none;
  border-bottom: 1px solid #eee;
  border-radius: 0;
}
.ng-select-focused{
  border:none !important;
}
.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-marked{
  background:#48B7FF !important;
  color:#fff !important;
}
select{
  border-radius:0 ;
  /* AP 03JAN25 - remove !important */
}
.ng-select .ng-select-container{
  border:none!important;
  border-bottom:1px solid #eee!important;
}


.questiondiv2{
  padding-left: 0 !important;
  padding-bottom: 0 !important;
}

.form-group.content-box {
  background: #ffffff;
  padding-bottom: 40px;
  /* border: 1px solid #e8e8e8; */
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.header-style {
  padding: 15px !important;
  background: #F8F8F8;
  color: #898989 !important;
  border: 1px solid #e8e8e8;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  margin-left: 0 !important;
  justify-content: left !important;
  font-size: 15px !important;
}
.shengel-myt-font3{
  padding-bottom: 5px;
  padding-top: 5px;
  padding-right: 15px;
  padding-left: 2px !important;
  color: #9a9a9a !important;
  font-size: 14px !important;
  font-weight: 400 !important;
}
.input-shengel {
  border: none;
  outline: none;
}
/* .input-shengel:focus {
  border-bottom: 1px solid #007bff;
} */
.input-shengel:focus {
  border-bottom: 1px solid #eeeeee;
}

.shengel-custom-select{
  border: none;
  background: #fff;
  /* border-bottom: 1px solid #eeeeee !important; */
  border-radius: 0;
  box-shadow: none;
  height: 38px;
  outline: none;
  color:black;
  font-size: 14px;
  font-weight: 400;
}

.form-control {
  -moz-border-radius: 2px;
  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 2px;
  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
  background-color: #fafafa;
  border-radius: 2px;
  border: 1px solid #eeeeee;
  box-shadow: none;
  height: 38px;
  color: rgba(0, 0, 0, 0.6);
  font-size: 14px;
}
.form-control:focus {
  background: #ffffff;
  box-shadow: none;
}

.she-line-input{
  border: none;
  background: #fff;
  border-bottom: 1px solid #eeeeee;
  border-radius: 0;
}

.table-input{
  height: 32px;
  background: transparent;
  border: none !important;
  outline: none;
}

.error-msg {
  color: #EC2E2E;
  background-color: white;
  border: none !important;
  font-family: Rubik;
  font-size: 12px;
}

.align-submit-row {
  display: flex;
  }
.align-submit-row button{
   background: #48B7FF;
   color: #ffffff;
   border: none;
   border-radius: 5px;
   height: 50px;
   width: 150px;
 }
 google-map .map-container {
  width: auto !important;
}

 /* my changes  */


  /* Media screen starts*/

  @media (max-width: 1090px){
    .icon-edit{
      margin: 0 6px -3px -13% !important;
    }
  }

  @media (max-width: 768px){
    .col-md-1,
    .col-md-10,
    .col-md-11,
    .col-md-12,
    .col-md-2,
    .col-md-3,
    .col-md-4,
    .col-md-5,
    .col-md-6,
    .col-md-7,
    .col-md-8,
    .col-md-9{
      float: center ;
    }
    .col-md-12{
      width: 100% ;
    }
    .col-md-11{
      width: 91.66666667% ;
    }
    .col-md-10{
      width: 83.33333333% ;
    }
    .col-md-9{
      width: 75% ;
    }
    .col-md-8{
      width: 66.66666667% ;
    }
    .col-md-7{
      width: 58.33333333% ;
    }
    .col-md-6{
      width: 50%;
    }
    .col-md-5{
      width: 41.66666667% ;
    }
    .col-md-4{
      width: 33.33333333% ;
    }
    .col-md-3{
      width: 25% ;
    }
    .col-md-2{
      width: 16.66666667% ;
    }
    .col-md-1{
      width: 8.33333333% ;
    }
  }

  @media (max-width: 768px){
  .radioOption{
    width: 8%;
  }
  .grey{
    width: 78%;
    margin-left: 17.5rem;
    height: 68px !important;
    font-size: 20px !important;
    font-weight: bold !important;
  }
  .answer{
    margin-top: -4% !important;
  }

  }

  @media screen and (max-width: 672px) {
    .header1{
      font-size: 23px !important;
    }
    .summarypadd{
      padding-top: 50px !important;
    }

    .answer{
      margin-top: -5% !important;
    }

    .icon-edit{
      margin: 0 6px 0px -13% !important;
    }

    .subTitle1{
      width: 95% !important;
    }
    .additional{

      /*margin-left: -25%;*/
      margin-left: 6% !important;
      padding: 0 !important;

    }

    .container1{
      margin-left: -35%;
    }
    .town-drop{
      margin:auto;
      width: 100% !important;
    }
    .dis-flex{
      display: flex;
      justify-content: left;
    }
    .check{
    display: inherit;
    width: max-content;
    margin-left: 6%;
    }
    .rusty{
      width: 28rem;
      margin-left: 0rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
      margin-bottom: 37px;
    }

    .left-bt{
      width: 28rem;
      margin-left: -28rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }

    .questionalign{
      text-align: center;
    }

    .questionalign{
      margin-top: 1rem !important;
   }

    .largeTitle{
    padding-left: 0px !important;
    }

    .myt-align{
    margin-left: 0% !important;

    }

    .myt-text1{
    margin-top: -22px;
    }

    .myt-text2{
    margin-top: -20px;
    }

    .myt-text3{
    margin-bottom: 21px;
    }

    .date-picker{
      width: 100%;
    }
    .dt-time{
      width: 100%;
    }
    /* .myt-time{
      width: 8%;
    } */
    .showminute{
      margin-top: -0.5%;
    }
    .radioOption{
      width: auto;
      margin-top: 0;
      margin-left: 7%;
      margin-right: -3%;
    }

    /* .myt-font7{
      padding-left: 0rem;
      margin-left: -1.5%;
    } */
    .down{
      width: 100%;
      margin-left: 0rem;

    }
    .bookText{
      width: 100%;
      margin-left: 0rem;
    }
    .book{
      width: 100%;
      margin-left: 0rem;
    }
    .town{
      margin-left: 0rem;
      width: 100%;
    }

    .file-upload-box{
      max-width: 85%;
      margin-left: 20px;
    }
    .file-uploading-box{
      max-width: 85%;
      margin-left: 20px;
    }
   /* .subTitle{
      margin-left: 8rem;
    }
    .subTitle1{
      margin-left: 70px;
    }
    .summary-groupText{
      margin-left: 0rem;
    }*/
    .question{
      margin-left: 0rem;
    }
    /*.answer{
      margin-left: 0rem;
    }*/

    .btn-text2{
      width: 28rem;
      margin-right: 0rem;
      margin-left: 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;

    }
    .grey{
      width: 28rem;
      margin: 0 0 0 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
      margin-top: -21px;
    }
  }
  @media screen and (max-width: 580px) {

    .rusty{
      width: 27rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .left-bt{
      width: 27rem;
      margin-left: -27rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .container1{
      margin-left: -24%;
    }

    .showminute{
      margin-top: 0.5%;
    }
    .bookText{
      width: 100%;
      margin-left: 0rem;
    }
    .book{
      width: 100%;
      margin-left: 0rem;
    }
    /*.subTitle{
      margin-left: 6rem;
    }*/
    .btn-text2{
      width: 27rem;
      margin-right: 0rem;
      margin-left: 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .grey{
      width: 27rem;
      margin: 0 0 0 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
      margin-top: -21px;
    }
    .btn-text{
      width: 27rem;
      height: 68px !important;
       font-size: 20px !important;
       font-weight: bold !important;
     }
  }
  @media screen and (max-width: 672px) {
    /* .questiondiv1{
      padding: 0;
    } */

  }
  @media screen and (max-width: 525px) {
    .rusty{
      width: 26rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .container1{
      margin-left: -9%;
    }
    .left-bt{
      width: 26rem;
      margin-left: -26rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }

   /* .subTitle{
      margin-left: 2rem;
    }*/

    .dateandtime{
      padding-left: 10px !important;
    }

  }

  @media screen and (max-width: 480px) {

    .answer{
      margin-top: -7% !important;
    }

   /* .subTitle{
      margin-left: 2rem;
    }*/
    .icon-edit{
      margin: 0 6px 4px -35% !important;
    }
    .rusty{
      width:25rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .left-bt{
      width: 25rem;
      margin-left: -25rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .file-upload-box{
      max-width: 89%;
    }
    .file-uploading-box{
      max-width: 89%;
    }
   /* .subTitle1{
      margin-left: 23rem;
    }*/
  }

  @media screen and (max-width: 420px)  {

    .answer{
      margin-top: -9% !important;
    }
    .icon-edit{
      margin: -9px 1px 4px 4%!important;
    }
    .rusty{
      width:21rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .btn-text{
     width: 21rem;
     height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .left-bt{
      width: 21rem;
      margin-left: -21rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .container1{
      margin-left: 0%;
    }
    .file-upload-box{
      max-width: 100%;
    }
    .file-uploading-box{
      max-width: 100%;
    }
    /*.subTitle{
      margin-left:0;
    }
    .subTitle1{
      margin-left: 0;
    }*/

    .myt-dateTimeNew{
      margin-left: -10px !important;
    }

    .form-row{
      padding-left: 8px !important;
    }
    .dateandtime{
      padding-left: 0px !important;
    }
    .dt-time{
      padding-left: .8% !important;
    }
    .myt-font7{
      padding-left: 0rem;
      margin-left: -3.5%;
    }
    .grey{
      width: 21rem;
      margin: 0 0 0 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
      margin-top: -21px;
    }
    .btn-text2{
      width: 21rem;
      margin-right: 0rem;
      margin-left: 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }

  }
  @media screen and (max-width: 368px)  {

    .icon-edit{
      margin: 0 6px 3px 35% !important;
    }
    .icon-editios{
      margin-bottom: 4px;
    }
    .rusty{
      width:19rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .left-bt{
      width: 19rem;
      margin-left: -19rem;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .container1{
      margin-left: 15%;
    }
    .radiotext{
      margin-top: -45px;
    }
    /*.myt-font7{
      margin-left: 0%;
    }*/
    .file-upload-box{
      max-width: 100%;
    }
    .file-uploading-box{
      max-width: 100%;
    }
   /* .subTitle{
      margin-left:0;
    }
    .subTitle1{
      margin-left: 0;
    }*/
    .grey{
      width: 19rem;
      margin: 0 0 0 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
      margin-top: -21px;
    }
    .btn-text2{
      width: 19rem;
      margin-right: 0rem;
      margin-left: 0;
      height: 68px !important;
      font-size: 20px !important;
      font-weight: bold !important;
    }
    .btn-text{
      width: 19rem;
      height: 68px !important;
       font-size: 20px !important;
       font-weight: bold !important;
     }
  }
  .mydp .selection {
    padding: 0 !important;
  }

  .text-border{
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 0;
    border-bottom: 1px solid #fff !important;
    background-color: #dedddd;
  }

  .additional {
      display: flex;
      font-size: 20px;
      text-align: left;
      font-weight: 200;
      margin-left: 4%;
      justify-content: center;
      color: rgb(62, 62, 60);
      padding: 0 30%;
  }


  .check{
    display: block;
  }
  .header2{
    font-size: 20px;
    font-weight: 300;
    text-align: center;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    color: #560d05;
    max-width: 1100px;
    margin: auto;
    padding-bottom: 10px;
  }
  .header1{
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    color: #dd2e13;
  }


  /* The container */
  .container1 {
    display: inline-grid;
    position: relative;
    cursor: pointer;
    font-size: 20px;
    user-select: none;
  }

  /* Hide the browser's default checkbox */
  /* .container1 input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
  } */

  .bottomspace1{

    padding-bottom: 14px !important;
  }

  .myt-321{
    font-size: 20px;
    font-weight: 700;
    color: #c5281c;
    margin-top: 11px;
  }

  .myt-345{

    display: none;
  }

  @media (min-width: 300px) and (max-width: 399px){
  .selbtngroup{
    padding-left: 1.3% !important;
  }
  }
  @media (min-width: 400px) and (max-width: 480px){
    .selbtngroup{
      padding-left: 0.9% !important;
    }
    }
    @media (min-width: 481px) and (max-width: 580px){
      .selbtngroup{
        padding-left: 0.2% !important;
      }
      }

      @media screen and (min-width: 871px) {
        .selbtngroup{
          padding-right: 4px !important;
        }

      }

    @media screen and (max-width: 689px) {
      .answer{
        max-width: 95% !important;
        margin-left: 0px !important;
        margin-right: 15px;
      }
      #progress2{
        margin-left: 8.5px !important;
      }
      .edit{
        margin-left: 85% !important;
        margin-bottom: 0% !important;
      }
      .sum-ques{
        width: 100% !important;
        margin: auto;
      }
      .sum-ques1{
        width: 100% !important;
        margin: auto ;
      }
      .summary-completed{
        padding-left: 0px !important;
        padding-bottom: 17px;
        margin-top: 9px;
      }
      .summary-top{
      margin-top: 10%;
    }
    .subTitle1{
      font-size: 18px !important;
      line-height: 1.38 !important;
      text-align: center;
      letter-spacing: normal;
      color: #560d05 !important;
      font-weight: 300;
    }

    /* .backbutton{
      display: none;
    } */
    .rusty{
      margin-bottom: 37px;
    }
  }

  @media screen and (min-width: 1024px) {
    .ES-style{
      position: absolute;
      left: 7px;
      font-size: 0.9rem;
      color: #555;
      top: 9px;
    }

  }

  @media screen and (max-width: 1024px) {

    .ES-style{
      position: absolute;
      left: 0.6rem;
      font-size: .95rem;
      color: #555;
      top: 0.57rem;
    }

  }


  @media screen and (max-width: 689px) {
    .app-back1 {
      line-height: 1.5;
      cursor: pointer;
      width: 100%;
      max-width: 1200px;
      margin-right: auto;
      margin-left: -10px;
      display: flex;
      font-family: Helvetica;
      font-size: 21px;
      font-weight: bold;
      align-items: center;
      font-stretch: normal;
      font-style: normal;
      letter-spacing: normal;
      color: #dd2e13;
      z-index: 1;
      position: fixed;
      background-color: #dedddd;
      border-radius: 0px !important;
      margin-top: -12px;
      padding-top: .8rem;
      /*padding-top: 1.8rem;*/
   }
   .header1{
    padding-top: 75px;

  }

  .dt-time{
    background-position: 100% !important;
  }
  }

  .summary-volver{
    display: none;
  }

  .content-space-between {
    justify-content: space-between;
  }
  .flex {
    display: flex;
  }
  
  /* AP-29JAN25 -form,element,properties */
.cursor-pointer{
  cursor: pointer;
}

@media print {
  .input-box {
    border: none !important;
  }
  .nxtButton {
    display: none !important;
  }
  /* SKS28MAR25 pdf print time hide elements style */
  .actionCol {
    display: none !important;
  }
  .inlineAdd {
   display: none !important;
  }
  textarea {
    resize: none !important;
  }
  .she-line-input{
    border: none !important;
  }
  /* Adjust specific column widths for print */
  .col-lg-1 {
    width: 8.33% !important; /* 1/12 columns */
  }
  .col-lg-2 {
    width: 16.66% !important; /* 2/12 columns */
  }
  .col-lg-3 {
    width: 25% !important; /* 3/12 columns */
  }
  .col-lg-4 {
    width: 33.33% !important; /* 4/12 columns */
  }
  .col-lg-5 {
    width: 41.66% !important; /* 5/12 columns */
  }
  .col-lg-6 {
    width: 50% !important; /* 6/12 columns */
  }
  .col-lg-7 {
    width: 58.33% !important; /* 7/12 columns */
  }
  .col-lg-8 {
    width: 66.66% !important; /* 8/12 columns */
  }
  .col-lg-9 {
    width: 75% !important; /* 9/12 columns */
  }
  .col-lg-10 {
    width: 83.33% !important; /* 10/12 columns */
  }
  .col-lg-11 {
    width: 91.66% !important; /* 11/12 columns */
  }
  .col-lg-12 {
    width: 100% !important; /* 12/12 Full width */
  }
}