.my-order-log, .my-order-contacts, .my-order-products { margin: 10px 0 20px 0;}
.log-cnt{
  display: flex;
  width: 100%;
}
.my-intro, .my-reg {
    display: inline-block;
    vertical-align: top;
    flex: 0 0 calc((100% - 30px) / 2);
    min-height: 275px;
    padding: 20px;
    margin: 0 20px 20px 0;
    border: 3px solid #f17900;
}

@media (max-width: 767px){
  .my-intro, .my-reg{
    flex: 0 0 auto;
    width: 100%;
  }
  .log-cnt{
    flex-direction: column;
  }
}
.form-name {
    padding: 5px 0;
    text-align: center;
    font-size: 20px;
    color: #f17900;
    text-transform: uppercase;

}

.form-case{width:310px;margin:0 auto;background:#e4ecf3;}
.form-name{padding:10px 0;text-align:center;font-family:'Roboto Condensed',sans-serif;font-size:20px;text-transform:uppercase;}
.form-i{padding:0 10px 15px 10px;}

.form-phone .input::-webkit-inner-spin-button{display:none;}
.form-i .form-phone-3{width:54px;margin:0 5px;text-align:center;}
.form-i .form-phone-2{width:44px;margin:0 5px;text-align:center;}
.form-i .textarea{width:100%;height:70px;padding:5px;line-height:20px;font-family:'Roboto',sans-serif;font-size:1rem;background:#fff;border:1px solid #ccc;}
.form-c{padding:0 0 0 3px;}
.form-s{padding:15px 0;text-align:center;}
.form-s .submit{padding:0 30px;line-height:36px;font-family:'Roboto Condensed',sans-serif;font-size:1rem;color:#fff;text-transform:uppercase;background:#cb4335;}

.form-message{padding:0 0 15px 0;text-align:center;}
.form-message-h{padding:15px 0;font-family:'Roboto Condensed',sans-serif;font-weight:700;text-transform:uppercase;}


.form-i .input{
  border: 1px solid #cbcbcb;
  background-color: #ececec;
  color: #000000;
  font-size: 13px;
  font-weight: 400;
  text-align: left;
  text-transform: uppercase;
  height: 45px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  padding: 0px 20px;
  -webkit-box-flex: 0;
      -ms-flex: 0 1 270px;
          flex: 0 1 270px;
}
.form-item button{
  border-radius: 0 25px 25px 26px;
  background-color: #f17900;
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  text-align: left;
  text-transform: uppercase;
  padding: 20px 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.form-item button:after {
  content: url(/files/design/icon/small-arrow-right-white.png);
  margin-left: 19px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.form-switch { padding-top:10px; color: #f17900; cursor: pointer;}

.myprofile table {border: 1px solid #cbcbcb;
background-color: #ececec;
color: #000000;
font-size: 13px;
font-weight: 400;
text-align: left;
text-transform: uppercase;
height: 45px;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;}
.myprofile table tr {background-color: #f8f8f8;border: 1px solid #ddd;padding: .35em;}
.myprofile table td {padding: .625em; text-align: left;}
.myprofile table td:first-child {vertical-align: middle ; width: 30%;}
.myprofile table caption {caption-side: top; text-align: left; padding: 10px 0; text-transform: uppercase;}
.myprofile table tr:hover td {background: #f4f4f4;}

@media screen and (max-width: 500px) {
  .myprofile  table {border: 0;}
  .myprofile table tr {display: block;border-bottom: 0px}
  .myprofile table td {display: block;text-align: left;}
  .myprofile table td:first-child {width: 100%;} 
  .myprofile table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    float: left;
    text-transform: uppercase;
  }
 .myprofile   table td:last-child {border-bottom: 0;}
}

table {
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: auto;
  
}
table caption {caption-side: top; text-align: left; padding: 10px 0; text-transform: uppercase;}

table tr {
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  padding: .35em;
}

table th,
table td {
  padding: .625em;
  text-align: center;
}

table th {
  font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;
}
@media screen and (max-width: 500px) {
  .my-order table {
    border: 0;
  }
  table caption {caption-side: top; text-align: left; padding: 10px 0; text-transform: uppercase;}
  .my-order table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  .my-order table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  
  .my-order table td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  
  .my-order table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  .my-order table td:last-child {
    border-bottom: 0;
  }
}
@media screen and (max-width: 6000px) {
  .my-order-contacts table {
    border: 0;
  }

  
  .my-order-contacts  table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  
  .my-order-contacts  table td {
    border-bottom: 1px solid #ddd;
    display: block;
    text-align: right;
  }
  
  .my-order-contacts  table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    text-transform: uppercase;
  }
  
  .my-order-contacts  table td:last-child {
    border-bottom: 0;
  }
}
