@media (max-width: 500px) and (orientation: portrait), (max-height: 500px) and (orientation: landscape){
  h2 {
    margin-left: 10px;
    margin-right: 10px;    
    font-size: 1.3em  ;
  }
  #osnova {
    display:flex;
    flex-direction: column;
    justify-content: left;
    align-items: left;
  }
  #sur, #sur2 {
    flex-direction: column;
    justify-content: left;
    align-items: left;
  }
  #nam, #nam2 {
    align-items: left;
    flex-direction: column;
  }
  #ln, #ln2, #change-year, #change-reas,
  #series2, #issue-date2, #issued-by2,
  #lic-series, #lic-number, #lic-date{
    align-items: left;
    flex-direction: column;
  }
  #sex {
    justify-content: left;
    align-items: center;
  }
  main {
    --app-main-width: 100%;
  }
  nav > .inner {
    --app-main-width: auto  ;
    margin-left: 10px  ;
    margin-right: 10px  ;
  }
  #bd {
    display: flex;
    flex-direction: column;
  }
  #fio{
    align-items: center;
  }
  #bp {
    text-align: left;
    justify-content: left;
    display: flex;
    flex-direction: column;
  }
  li > label:not(.sign):first-child,
  li > p,
  li > div.center > label:not(.sign) {
    text-align: left  ;
    padding-right: 10px  ;
  }
  #birthplace {
    display: flex;
    flex-direction: row;
    margin-right: 100px;
  }
  #docs{
    display: grid;
    align-items: bottom;
  }
  li {
    display: flex; 
    margin: 10px 0;
    color: #5e5e5e;
  }
  input.width-2,
  textarea.width-2,
  div.textarea.width-2,
  select {
    --app-input-text-width: 100%  ;
  }
  input:not([type="radio"]):not([type="checkbox"]):not(.dx-texteditor-input, .code, .number):not([type="date"]) {
    --app-input-text-width: 100%;
  }
  input[type="date"] {
    --app-input-text-width:50%  ;
  }
  #series, #number, #issue-date, #issued-by, #city, #street, #home, #flat, #home-phone, #home-phone2,
  #city2, #street2, #home2,  #flat-private-yn, #ed, #uni, #year-release, #form-study, #faculty, #specialisation, 
  #mom-sur, #mom-name, #mom-ln, #mom-birthday, #mom-maiden, #work-mother{
    display: flex;
    flex-direction: column;
  }
  input[type="tel"].number {
    --app-input-text-width: 70px;
  }
  input[type="tel"].code {
    --app-input-text-width: 45px;
    margin-right: 5px;
  }
  #factual-address {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: left  ;
  }
  #p-address {
    text-align: center;
  }
  #contact-num:not(span), #email, #email1, #email2, #contact-num1, #rel-nums, #rel-num1:not(span), #rel-num2:not(span),
   #car-m:not(span), #car-number:not(span), #car-c:not(span), #car-y:not(span){
    display:grid;
  }
  input.width-1 {
    --app-input-text-width: 70px  !important;
  }
  #fact-address-private-home {
    margin-top: 3px;
  }
  fieldset:not(#other-fields-mother, #post-mother-block, #change-fullname-mother, 
  #change-fullname-father, #post-stepmother-block, #other-fields-stepfather, #post-stepfather-block, 
  #post-block_0, #change-fullname_0, #other-fields_1, #post-block_1, #change-fullname_1, 
  #other-fields-stepmother, #inc-fieldset, #about-criminal, #about-criminal-family, 
  #about-public-service, #post-spouse-block, #post-fspouse-block_0, #post-kid-block_0, .inc-fieldset, 
  #post-father-block, .inset) {
    margin: 10px  ;
  }
  .inc-fieldset {
    padding: 20px  ;
  }
  label {
    margin-bottom: 3px;
  }
  p.point {
    margin-bottom: 3px;
  }
  #inc-fieldset {
    padding: 20px  ;
  }
  input:not(.dx-texteditor-input), textarea {
    color: #000;
  }
  .center {
    display: flex;
    flex-direction: column;
    align-items: flex-start  ;
    margin-left: 30px;
  }
  #add-education {
    width: 95%;
    margin-left: 10px;
    margin-right: 10px;
  }
  .education-content {
    display: flex;
    flex-direction: column;
  }
  #form-study div {
    display: flex;
    justify-content: left;
    align-items: center;
  }
  
  #form-study label {
    margin-right: 10px;
  }
  #ed div, #mom-death, #mom-maiden div{
    display: flex;
    justify-content: left;
    align-items: center;
  }
  #ed label {
    margin-right: 10px;
  }
  .remove-item {
    /* position: sticky  ;   */
    margin-right: 10px;
  }
  button:not(#button-change-fullname-mother, #add-button-brother, #add-button-sister,
  #send, #add-stepmother, #add-stepfather, #add-button-former-spouses, #add-button-spouse, #add-button-kids, 
  #add-ed, .remove-item, #login button) {
    display:flex;
    margin-top: 10px;
    margin-left: auto  ;
  } 
  #work-mother {
    --app-input-text-width:100%  ;
  }
  .base-flex {
    flex-direction: column;
  }
  .sign {
    margin-bottom: 3px;
  }
  textarea {
    margin-bottom: 3px;
    --app-input-text-width: 100%  ;
  }
  input {
    margin-bottom: 3px;
  }
  .base-flex1 {
    display: flex;
    flex-direction: row;
  }

  #br-sis, #kids-status, #previously-worked, #pr-work {
    align-items: center;
  }

  #br-sis, #kids-status {
    margin-bottom: 10px;
  }

  #kids-status, #pr-work {
    display: flex;
    flex-direction: column;
  }

  #mom-death {
    justify-content: center;
  }
  .death-button {
    display: flex;
    text-align: center;
    justify-content: center;
    margin-top: 30px;
  }
  .mob-margin-horizontal-10 {
    margin-left: 10px;
    margin-right: 10px;    
  }
  .___add-buttons {
    margin-left: 10px;
    margin-right: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }
  .max-label {
    --app-input-text-width: 100%  ;
  }
  #post-mother-block, #post-father-block, #post-stepmother-block, #post-block_,
  #post-spouse-block {
    display: flex  ;
    justify-content: left;
    align-items:flex-start !important;
  }
  .control-panel {
    justify-content: center  ;
  }
  .page-switch {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  #fam {
    padding-left: 33.5px;
    padding-right: 33.5px;
  }
  .base-flex-t {
    display: flex;
    flex-direction: column;
    flex-shrink: 1  ;
  }
  #prev-work-q, #kids-q {
    margin-left: 20px;
  }
  #agreement-title {
    margin-left: 30px;
  }
  .center-3 {
    display: flex;
    flex-direction: column;
    align-items: flex-start  ;
  }
  #kids-yes-no {
    margin-left: 30px;
  }
  #address-par {
    text-align: center  ;
    justify-content: center;
    align-items: center;
  }
  label:not(.sign) {
    width: auto  ;
  }
  #education-type {
    margin-left: 10px;
  }  
  main:not(.readonly) .del-field {
    padding-bottom: 60px;
  }
  .base-toggle {
    margin-left: 10px;
    margin-right: 10px;
  }
  #family-status-m {
    --app-input-text-width: 100%;
  }
  .signin button {
    align-items: center  ;
  }
  .point {
    width:auto;
    text-align: left;
  }
}