.smartf-row {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    text-align:center;
}
.smartf-half {
    flex: 1 1 50%;
    max-width:50%;
}
.azumibox {
    flex: 1 1 50%;
    max-width:50%;
}
.smartf-third {
    flex: 1 1 33.33%;
  max-width: 33.33%;
}
.smartf-two {
    flex: 1 1 66.66%;
  max-width: 66.66%;
}
.smartf-full {
    flex: 1 1 100%;
    max-width:100%;
}
.accdetlistheader{
    width:100%;
    text-align:center;
    color:#666;
    float:right;
    display:block;
}
.order-account-list-search{
     width:100%;
    text-align:center;
    color:#666;
    float:left;
    margin-bottom:10px;
}
.order-account-list-title{
     width:100%;
    text-align:center;
    color:#666;
    float:right;
}
.seckey{
 font-weight: bold;
  font-size: 16px;
  background: #0b5e5e;
  color: #fff;
  padding: 5px;
  border: 1px solid #fff;
} 

.secdlv{
    font-weight: bold;
    font-size: 16px;
    background: #029d9d;
    color: #fff;
    padding: 5px;
    border: 1px solid #fff;
 }
.sename {
  font-weight: bold;
  font-size: 16px;
  background: #43bdbd;
  color: #0b5e5e;
  padding: 5px;
    text-align: center; 
    width: 100%;
    border: 1px solid #fff;
}
.secstatus {
  font-weight: bold;
  font-size: 16px;
  background: #178888;
  color: #fff;
  padding: 5px;
  border: 1px solid #fff;
  
}
.smartf-azumi {
  padding: 5px;
  background: #f7f7f7;
  font-size: 16px;
  color: #000;
  width: 96%;
  margin-bottom: 10px;
  border-radius: 5px;
}
a .azumidlfile {font-size:18px;color:#000;}
a .azumipeername {font-size:10px;color:#000;}
.secorderdet {
  font-weight: bold;
  font-size: 16px;
  background: #029d9d;
  color: #fff;
  padding: 5px;
  border: 1px solid #fff;
}
.secrenew {
  font-weight: bold;
  font-size: 16px;
  background: #0b5e5e;
  color: #fff;
  padding: 5px;
  border: 1px solid #fff;
}
.seclinks {
  font-weight: bold;
  font-size: 16px;
  background: #029d9d;
  color: #fff;
  padding: 5px;
  border: 1px solid #fff;
}

.smartf-account-details {
  width: 100%;
  background-color: #f2f2f2;
  float: right;
  display: block;
  margin-bottom: 10px;
  border: 15px solid #145454;
  padding:3px;
}
.smartf-section {
padding: 5px;
float: left;
display: block;
text-align:center;
width:100%;
}

.smartf-section a,.smartf-section a:hover{color:#fff;}
.accordion-section{width: 100%;
  float: left;
  margin-top: -20px;
  border:5px solid #145454;
  background: #145454;
  margin-bottom:15px;
 }
 .headconfigs,
  .headsub{
 margin-top: 5px;
  font-size: 16px;
  font-weight: 900;
  width: 100%;
  background: #143c3c;
  color: #c2cccc;
  border: 3px solid #113131;
  border-radius: 5px;
  min-height:140px;
      
  }
  .sucsub{padding:5px;}
  .secconfigs{padding:5px;}
  .accudesbox{width:100%;font-size:10px;}
  .accdethead{width:100%;text-align: center;
  color: #14297b;}
  .spanaccname,.spanaccused{font-weight:900;}
  .Renew-button a,.Renew-button a:hover{color:#fff;}
.subboxsecinput input[type="text"],
.subboxsec textarea,
.qrboxsec textarea,
.qrboxsec input[type="text"],
.smartf-section input[type="text"],
.smartf-section  textarea {
    margin: 5px 0px;
  width: 100%;
  height: 50px !important;
  max-height: 50px !important;
  border: 2px solid #0b1b24;
  padding: 0px 3px 3px 3px;
  background-color: #143c3c;
  font-size: 10px;
  resize: none;
  min-height: 10px !important;
  border-radius: 5px;
  color: #219b9b;
  line-height: 10px;
}
.textinputsmartf{line-height:10px !important;}
.qrcodedor,
.qrsubdor{display:block;border: 5px solid #0b1b24;border-radius:5px;}
.smartf-copybtn {
margin-top: 5px;
  font-size: 16px;
  font-weight: 900;
  width: 100%;
  background: #091515;
  color: #40b7b7;
  border: 3px solid #143c3c;
  border-radius: 5px;
}
.smartf-copybtn:hover{background:#41b8b8;border:5px solid #0b1b24;color:#0b1b24;}
.nameslist{line-height: 16px;
  font-size: 12px;
  font-weight: 100;}
  
  .order-account-list-search input[type="text"]{ margin: 5px 0px;
  width: 60%;
  height: 50px !important;
  max-height: 50px !important;
  border: 2px solid #0b1b24;
  padding: 0px 3px 3px 3px;
  background-color: #143c3c;
  font-size: 16px;
  resize: none;
  min-height: 10px !important;
  border-radius: 5px;
  color: #219b9b;
  line-height: 16px;}
.order-account-list-search input[type="submit"]{
    margin: 5px 0px;
    width: 30%;
  height: 50px !important;
  max-height: 50px !important;
  border: 2px solid #0b1b24;
  padding: 0px 3px 3px 3px;
  background-color: #143c3c;
  font-size: 16px;
  resize: none;
  min-height: 10px !important;
  border-radius: 5px;
  color: #219b9b;
  line-height: 16px;}
  
  .headtitl{ margin-top: 5px;
  font-size: 24px;
  font-weight: 900;
  color: #145454;
  }
.page-button{margin: 5px 0px;
  border: 2px solid #0b1b24;
  padding: 0px 3px 3px 3px;
  background-color: #143c3c;
  font-size: 16px;
  min-height: 10px !important;
  border-radius: 5px;
  color: #219b9b;
  line-height: 16px;
}
account-list{
    width: 100%;
    float:left;
    display:block;
}
.account-names-list {
    display: block; 
    opacity: 0; 
    max-height: 0; 
    overflow: hidden; 
    transition: opacity 0.5s ease, max-height 0.5s ease; 
}

.orderacchead {
  width: 100%;
  padding: 10px;
  background: #8aeef2;
  display: flex;
  margin: 10px 0px;
  border: 5px solid #145454;
  border-radius: 5px;
}

.orderaccountsec{
    flex: 1 1 66.66%;
    max-width:66.66%;
}
.orderbtnsec {
    flex: 1 1 33.33%;
    max-width:33.33%;
}
.orderkey,.orderdatetime, .orderitemname, .ordertotalgb, .expiretime, .recommendappx{
font-size: 13px;
  color: #0d2b2b;
  font-weight: 300;   
  margin-bottom:5px;
}
.orderkey span,.orderdatetime span,.orderitemname span, .ordertotalgb span, .expiretime span,.recommendappx span{
font-size: 13px;
  color: #0d2b2b;
  font-weight: 800; 
}
.details-button:hover,.subs-button:hover,.configs-button:hover,.Renew-button:hover{
    background:#355859;
}
.details-button,.subs-button,.configs-button,.Renew-button{
background: #145454;
  width: 100%;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  border-radius: 5px;
  border: 5px solid #0d2b2b;
  color: #fff;
  margin-bottom:5px;
}
.smartfliner{
    width: 90%;
  min-height: 5px;
  background: #171616;
  border-radius: 10px;
  text-align: center;
  margin: 20px 5%;
    
}
.subboxsec,.qrboxsec{
    flex: 1 1 49.66%;
    max-width: 49.66%;
     padding:20px;
}


.accordion-content{
width: 100%;
  background: #8aeef2;
  margin-top: -15px;
  padding: 10px;
  border: 5px solid #145454;
 
}

.orderaccountsec i{padding-right:5px;padding-left:5px;}
.boxsec{width:100%;display:flex;}
@media (max-width: 480px) {
    .smartf-half, 
    .smartf-third, 
    .smartf-two,
    .orderaccountsec,
    .orderbtnsec,
    .orderacchead,
    .subboxsec, .qrboxsec, .boxsec{
        flex: 1 1 100%;
        width:100%;
        min-width:100%;
        display:block;
        max-width:100% !important;
        font-size:14px;
    }
    .headconfigs, .headsub{font-size:14px;padding:5px;}
}