body{
    font-family: 'Roboto', sans-serif;
    } 

.order-table .table td {
border: none;
vertical-align: middle;
padding: 1rem;
}
.order-status-hifi .order-table  .ph-table {
border: none;
background-color:#fff;
}
.order-status-hifi .order-table  .ph-table .according-row{

border: solid 1px #E2E1DD;
margin-bottom: 10px;
position: relative;
padding-left: 15px;
cursor:pointer;
}
.order-status-hifi .row-expanded td .contain-table .pd-left{
padding-left:25px;
}
.order-status-hifi  .according-row td:first-child {
   margin-right: 30px;
   width: 100px;
}
.ph-table__cell a {
color: #0167CD;
text-decoration: underline;
font-weight: bold;
}
.order-table .table tr {
display: block;
border: solid 1px #E2E1DD;
margin-bottom: 10px;
}

.Shipped .btn-opn,
.Shipped .btn-opn:hover,
.Shipped .btn-opn:focus {
background-color: #2DC000;
color: #fff;
text-decoration: none;
padding: 3px 0px;
font-size: 12px;
line-height: 18px;
text-transform: uppercase;
   min-width: 69px;
display: inline-block;
}

.order-table p {
color: #424242;
font-size: 12px;
margin: 12px 0px 0px;
}

.Shipped {
text-align: center;
}

.flxt {
display: flex;
justify-content: space-between;
}

.order-no strong {
display: block;
font-size: 14px
}
.order-no p {
font-size: 13px;
line-height: 18px;
color:#4D4D4D;
text-transform: capitalize;
}

.order-status-hifi  .order-no h4 {
font-size: 18px;
line-height:24px;
font-weight:normal;
color:#4D4D4D;

}
.order-table h3{
font-size: 24px;
font-weight: 500;
color: #424242;
margin:0px;
margin-bottom:19px;
}

.Shipped .close-btn,
.Shipped .close-btn:hover,
.Shipped .close-btn:focus {
background-color: #D33C40;
}


.according-row{
display:flex;
align-items: center;

}
.according-row td{
padding: 13px 9px 17px;
}
.according-row .last-cal{
margin-left:auto;
margin-right:50px;
text-align: center;
float: right;
}

.expand-table{
width:100%;
background-color:#F5F3F3;
border:none;
border-collapse: collapse;
margin-bottom:0px;
}
.row-expanded .contain-table{
margin-bottom:10px;
}
table.dataTable tbody tr{
background-color:inherit;
}
.order-status-hifi table.dataTable tbody .active{
border:none;
}
.expand-table .ph-header{
   border: 1px solid #E2E1DD;
   font-size: 12px;
color:#4D4D4D;
}
.order-status-hifi table.dataTable tbody .lineItems1 {
border-bottom: none;
}
.order-status-hifi table.dataTable tbody .row-expanded .contain-table {
margin-top:-11px;
}

.order-status-hifi .row-expanded td {
padding: 0px;
}
.order-status-hifi .row-expanded td .contain-table table tr td {
padding: 9px;
}
.order-status-hifi .ph-table__body{
font-size: 12px;
color:#4D4D4D;
}
.order-status-hifi .acknowledged{color:#CC4C00; text-transform:uppercase;}
.order-status-hifi .accepted{color:#E6930B; text-transform:uppercase;}
.order-status-hifi .held{color:#E30707; text-transform:uppercase;}
.order-status-hifi .shipped{color:#647F2C; text-transform:uppercase;}
.order-status-hifi .ph-table__exports-options a{
font-size: 13px;
line-height: 16px;
margin-right: 19px;
}
#sortby{
height: 27px;

font-size: 14px;
padding: 0px;
width: 170px;
border: 1px solid #E2E1DD;
box-sizing: border-box;
padding-left:9px;
border-radius: 0;
box-shadow: none;
outline: 0;
background-size:6%;
background-position-x:95%;
color:#272324;
   margin-bottom: 0px;
}
.order-status-hifi .ph-table__exports{
   margin: 0em 0 1em;
   padding-bottom:9px;
}
.order-status-hifi h4{
   line-height: inherit;
   margin: 0px 0px;
   text-transform: uppercase;
}
.accordion-toggle .fa.fa-times{
position:absolute;
top:5px;
right:9px;
color: #C3C2BC;
font-size: 20px;
cursor:pointer;
display:none;
}
.according-row.active .fa.fa-times{
display:block;
}
.according-row.active .fa-chevron-down{
   transform: rotate(180deg);
}

.accordion-toggle .fa{
color: #4D4D4D;
font-size: 13px;
line-height: 13px;
}

.order-status-hifi h1{
font-weight: bold;
font-size: 27px;
line-height: 35px;
text-transform:uppercase;
margin:50px 0px 50px;
}
.order-status-hifi .ph-nav-group__list li a{
   text-transform: uppercase;
}
.order-status-hifi .ph-nav-group__list li:hover {
background-color: transparent;
}
.order-status-hifi .ph-form input, .order-status-hifi .ph-form select{
   font-size: 14px;
   line-height: 19px;
   height: 25px;
padding: 0px;
padding-left: 9px;
}

.order-status-hifi .ph-form .form-control {
height: 25px;
color: #080808;
font-size: 14px;
font-family: Roboto;
line-height: 19px;
}
.order-status-hifi .ph-form label{
   margin-top: 16px
}
.order-status-hifi .ph-form{
   padding-top: 5px;
}
.order-status-hifi .submit-button{
border-radius: 12.5px;
border: 0px solid #424242;
padding:5px 27px;
line-height: 16px;
font-size: 12px;
}
select{
   background-size: 4%;
}

.pagination .dataTables_length{
display:flex;
}
.pagination .dataTables_length select{
width:50px;
}
.order-status-hifi .dataTables_wrapper .dataTables_paginate .paginate_button {
font-weight: bold;
color: #9E9D9D !important;
   font-size: 14px;
       line-height: 19px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {

border: none;
font-size: 14px;
line-height: 19px;

}
.dataTables_wrapper .dataTables_paginate .paginate_button{
padding:0px;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
border: 0px solid #ddd;
background-color: #D8D8D8;
color:#D8D8D8;
border-radius:0px;
}
.bottom{
margin: 0px 0px 50px;
padding-bottom: 15px;
}
.dataTables_length label{
width:145px;
margin: 0px;
}

.row-expanded .contain-table{
   overflow-x: hidden;
}

.search-select{
background-color:#F5E759;
padding:3px 5px;
}
table.dataTable tbody .showall{
background-color:#fff;
}
.showall{
display: flex;
justify-content: space-between;
border: 1px solid #E2E1DD;
font-size:12px;
color: #272324;
line-height: 16px;
padding:7px 25px 3px 25px;
}
.showall .show-btn{
font-weight:500;
cursor:pointer;
}
.showall .closeDiv{
cursor:pointer;
}
.showall .fa{
color: #424242;
font-size: 12px;
line-height: 13px;
}


/* ===login Screen=== */
input {
outline: none;
border: none;
}
input:focus::-webkit-input-placeholder { color:#424242; font-size: 16px;}
input:focus:-moz-placeholder { color:#424242; font-size: 16px;}
input:focus::-moz-placeholder { color:#424242; font-size: 16px;}
input:focus:-ms-input-placeholder { color:#424242; font-size: 16px;}

textarea:focus::-webkit-input-placeholder { color:#424242; font-size: 16px;}
textarea:focus:-moz-placeholder { color:#424242; font-size: 16px;}
textarea:focus::-moz-placeholder { color:#424242; font-size: 16px;}
textarea:focus:-ms-input-placeholder { color:#424242; font-size: 16px;}

input::-webkit-input-placeholder { color: #424242; font-size: 16px;}
input:-moz-placeholder { color: #424242; font-size: 16px;}
input::-moz-placeholder { color: #424242; font-size: 16px;}
input:-ms-input-placeholder { color: #424242; font-size: 16px;}

.wrap-login100 {
width: 400px;
margin: auto;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.logo-here img{
width:153px;
}
.login100-form{
text-align: center;
padding:71px 69px 69px 56px;
box-shadow: 0 3px 10px 5px rgba(0,0,0,0.17);
background: #fff;
border-radius:0px;
overflow: hidden;
margin-top: 42px;
}
.wrap-input100 {
position: relative;
width: 100%;
z-index: 1;
margin-bottom:20px;
}
.input100,
.input100:focus
{
display: block !important;
width: 100% !important;
background: #fff !important;
border: 1px solid #C3C3C3 !important;
height: 40px !important;
border-radius: 0px !important;
padding: 0 30px 0 31px !important;
font-size: 16px !important;
line-height: 21px !important;
color: #424242 !important;
box-shadow:none !important;
outline:0 !important;
margin-bottom:0px !important;
}

.symbol-input100 {
font-size: 15px;
color: #FFB91D;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
align-items: center;
position: absolute;
border-radius: 0px;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
padding-left: 8px;
padding-bottom: 0px;
pointer-events: none;

-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
-moz-transition: all 0.4s;
transition: all 0.4s;
}


.form-title{
border-bottom: 1px solid #C3C3C3;
margin-bottom:28px;
display: flex;
align-items: center;
padding-bottom:18px;
}
.form-title .form-logo{
margin-right:25px;
}
.form-title span{
font-size: 20px;
color: #424242;
font-weight: 500;
line-height: 26px;
text-transform:uppercase;
}
.login100-form-btn,
.login100-form-btn:focus,
.login100-form-btn:active
{
border-radius: 20px;
background-color: #FFB91D;
font-size: 16px;
color: #424242;
font-weight: 500;
line-height: 21px;
min-width:133px;
padding: 8px 0px 7px 0px;
margin: 0px;
outline:0;

}
@media only screen and (min-width: 320px) and (max-width: 767px) {
.wrap-login100{
   position: relative;
   width: 100%;
   top: 0;
   left: 0;
   -webkit-transform: inherit;
   -ms-transform: inherit;
   transform: inherit;
   padding-top:45px;
}
}

/*------------------------------------------------------------------