/************* RESPONSIVE CSS ********************/

/*** GENERAL TABLE ***/
.signupSectionProductTbl * {
    box-sizing: border-box;
}
.signupSectionProductTbl th.price_column{width: auto !important;}
.signupSectionProductTbl td.productName{width: auto !important;}

/*** TABLE VIEW-1 - 6 COLUMNS - MOST OF THE TABLES *************************************************************************/
.signupSectionProductTblView1 tr td:nth-of-type(1),.signupSectionProductTblView1 tr th:nth-of-type(1){grid-area: checkbox;}
.signupSectionProductTblView1 tr td:nth-of-type(2),.signupSectionProductTblView1 tr th:nth-of-type(2){grid-area: name;}
.signupSectionProductTblView1 tr td:nth-of-type(3),.signupSectionProductTblView1 tr th:nth-of-type(3){grid-area: description;}
.signupSectionProductTblView1 tr td:nth-of-type(4),.signupSectionProductTblView1 tr th:nth-of-type(4){grid-area: period;}
.signupSectionProductTblView1 tr td:nth-of-type(5),.signupSectionProductTblView1 tr th:nth-of-type(5){grid-area: price;}
.signupSectionProductTblView1 tr td:nth-of-type(6),.signupSectionProductTblView1 tr th:nth-of-type(6){grid-area: remove;}
.signupSectionProductTblView1 tr{
  display: grid;
  width: 100%;
  grid-template-columns: 2.5em 15em auto 10em 10em 5em;
  grid-template-areas:'checkbox name description period price remove';
}
.signupSectionProductTblView1 tr td[colspan] { grid-area: unset; grid-column: 1 / span 6; }

@media (max-width:768px) {
  /*** TABLE VIEW-1 ***/
  .signupSectionProductTblView1 tr  {
    grid-template-columns: 2.5em auto 10em 10em 5em;
    grid-template-areas:
    'checkbox name period price remove'
    'checkbox description description description description';
  }
  .signupSectionProductTblView1 tr:nth-of-type(1){grid-template-areas:'checkbox name period price remove';}
  .signupSectionProductTblView1 tr th:nth-of-type(3){visibility: hidden; display:none;}
}
@media (max-width: 600px) {
  /*** TABLE VIEW-1 ***/
  .signupSectionProductTblView1 tr{
    grid-template-columns: 2.5em 10em auto 5em;
    grid-template-areas:
    'checkbox name name name'
    'checkbox description description description'
    'checkbox price period remove';
  }
  .signupSectionProductTblView1 tr:nth-of-type(1){grid-template-areas:'checkbox description description description';}
  .signupSectionProductTblView1 tr th{visibility: hidden; display:none;}
  .signupSectionProductTblView1 tr th:nth-of-type(1){visibility: visible; display: block;}
  .signupSectionProductTblView1 tr th:nth-of-type(3){visibility: visible; display: block;}
  .signupSectionProductTblView1 tr td:nth-of-type(5){text-align: left;}
  .signupSectionProductTblView1 tr td:nth-of-type(6){text-align: right;}

  .signupSectionProductTblvpsUpgrades tr:nth-of-type(1){grid-template-areas:'checkbox name name name';}
  .signupSectionProductTblvpsUpgrades tr th:nth-of-type(2){visibility: visible; display: block;}
  .signupSectionProductTblvpsUpgrades tr th:nth-of-type(3){visibility: hidden; display: none;}
}
/*****************************************************************************************************************************/

/*** TABLE VIEW-2 - 5 COLUMNS - NO REMOVE COLUMN *****************************************************************************/
.signupSectionProductTblView2 tr td:nth-of-type(1),.signupSectionProductTblView2 tr th:nth-of-type(1){grid-area: checkbox;}
.signupSectionProductTblView2 tr td:nth-of-type(2),.signupSectionProductTblView2 tr th:nth-of-type(2){grid-area: name;}
.signupSectionProductTblView2 tr td:nth-of-type(3),.signupSectionProductTblView2 tr th:nth-of-type(3){grid-area: description;}
.signupSectionProductTblView2 tr td:nth-of-type(4),.signupSectionProductTblView2 tr th:nth-of-type(4){grid-area: period;}
.signupSectionProductTblView2 tr td:nth-of-type(5),.signupSectionProductTblView2 tr th:nth-of-type(5){grid-area: price;}
.signupSectionProductTblView2 tr{
  display: grid;
  width: 100%;
  grid-template-columns: 2.5em 15em auto 10em 10em;
  grid-template-areas:'checkbox name description period price';
}
.signupSectionProductTblView2 tr td[colspan]{grid-area: unset; grid-column: 1 / span 5;}
@media (max-width:768px) {
  /*** TABLE VIEW-2 - 5 COLUMNS - NO REMOVE COLUMN ***/
  .signupSectionProductTblView2 tr{
    grid-template-columns: 2.5em auto 10em 10em;
    grid-template-areas:
    'checkbox name period price'
    'checkbox description description description'
  }
  .signupSectionProductTblView2 tr:nth-of-type(1){grid-template-areas:'checkbox name period price';}
  .signupSectionProductTblView2 tr th:nth-of-type(3){visibility: hidden; display:none;}
}
@media (max-width: 600px) {
  /*** TABLE VIEW-2 - 5 COLUMNS - NO REMOVE COLUMN ***/
  .signupSectionProductTblView2 tr{
    grid-template-columns: 2.5em 10em auto;
    grid-template-areas:
    'checkbox name name'
    'checkbox description description'
    'checkbox price period'
  }
  .signupSectionProductTblView2 tr:nth-of-type(1){grid-template-areas:'checkbox description description';}
  .signupSectionProductTblView2 tr th{visibility: hidden; display:none;}
  .signupSectionProductTblView2 tr th:nth-of-type(1){visibility: visible; display: block;}
  .signupSectionProductTblView2 tr th:nth-of-type(3){visibility: visible; display: block;}
  .signupSectionProductTblView2 tr td:nth-of-type(5){text-align: left;}
  .signupSectionProductTblView2 tr td:nth-of-type(6){text-align: right;}
}
/*****************************************************************************************************************************/

/*** TABLE Hosting Plans DropDown  *****************************************************************************/
.signupSectionProductTblDD tr td:nth-of-type(1){grid-area: label;}
.signupSectionProductTblDD tr td:nth-of-type(2){grid-area: option;}
.signupSectionProductTblDD tr td:nth-of-type(3){grid-area: description;}
.signupSectionProductTblDD tr{
  display: grid;
  width: 100%;
  grid-template-columns: 15em auto 10em;
  grid-template-areas:'label option description';
}
.signupSectionProductTblDD tr td[colspan]{grid-area: unset; grid-column: 1 / span 3;}
@media (max-width:768px) {
  /***  TABLE Hosting Plans DropDown***/
  .signupSectionProductTblDD tr{
    grid-template-columns: auto 7em;
    grid-template-areas:
    'label label'
    'option description'
  }
  .signupSectionProductTblDD tr td:nth-of-type(1){border-bottom: unset;}
}
@media (max-width: 600px) {
}
/*****************************************************************************************************************************/

/*** TABLE FOR DOMAINS IN CART ***********************************************************************************************/
.signupSectionProductTblDomains tr td:nth-of-type(1),.signupSectionProductTblDomains tr th:nth-of-type(1){grid-area: checkbox;}
.signupSectionProductTblDomains tr td:nth-of-type(2),.signupSectionProductTblDomains tr th:nth-of-type(2){grid-area: name;}
.signupSectionProductTblDomains tr td:nth-of-type(3),.signupSectionProductTblDomains tr th:nth-of-type(3){grid-area: description;}
.signupSectionProductTblDomains tr td:nth-of-type(4),.signupSectionProductTblDomains tr th:nth-of-type(4){grid-area: type;}
.signupSectionProductTblDomains tr td:nth-of-type(5),.signupSectionProductTblDomains tr th:nth-of-type(5){grid-area: period;}
.signupSectionProductTblDomains tr td:nth-of-type(6),.signupSectionProductTblDomains tr th:nth-of-type(6){grid-area: price;}
.signupSectionProductTblDomains tr td:nth-of-type(7),.signupSectionProductTblDomains tr th:nth-of-type(7){grid-area: remove;}
.signupSectionProductTblDomains tr{
  display: grid;
  width: 100%;
  grid-template-columns: 2.5em 15em auto 10em 10em 10em 5em;
  grid-template-areas:'checkbox name description type period price remove';
}
.signupSectionProductTblDomains tr td[colspan]{grid-area: unset; grid-column: 1 / span 7;}
@media (max-width:768px) {

  /*** TABLE FOR DOMAINS IN CART ***/
  .signupSectionProductTblDomains tr{
    grid-template-columns: 2.5em auto 10em 10em 10em 5em;
    grid-template-areas:
    'checkbox name type period price remove'
    'checkbox description description description description description'
  }
  .signupSectionProductTblDomains tr:nth-of-type(1){grid-template-areas:'checkbox name type period price remove';}
  .signupSectionProductTblDomains tr th:nth-of-type(3){visibility: hidden; display:none;}
}
@media (max-width: 600px) {
  /*** TABLE FOR DOMAINS IN CART ***/
  .signupSectionProductTblDomains tr{
    grid-template-columns: 2.5em 10em auto 10em;
    grid-template-areas:
    'checkbox name name type'
    'checkbox description description description'
    'checkbox price period remove';
  }
  .signupSectionProductTblDomains tr:nth-of-type(1){grid-template-areas:'checkbox description description description';}
  .signupSectionProductTblDomains tr th{visibility: hidden; display:none;}
  .signupSectionProductTblDomains tr th:nth-of-type(1){visibility: visible; display: block;}
  .signupSectionProductTblDomains tr th:nth-of-type(3){visibility: visible; display: block;}
  .signupSectionProductTblDomains tr td:nth-of-type(4){text-align: right;}
  .signupSectionProductTblDomains tr td:nth-of-type(6){text-align: left;}
  .signupSectionProductTblDomains tr td:nth-of-type(7){text-align: right;}
}
/*****************************************************************************************************************************/

/*** SHOPPING CART EDIT*******************************************************************************************************/

.signupSectionProductTblCart tr td:nth-of-type(1),.signupSectionProductTblCart tr th:nth-of-type(1){grid-area: name;}
.signupSectionProductTblCart tr td:nth-of-type(2),.signupSectionProductTblCart tr th:nth-of-type(2){grid-area: description;}
.signupSectionProductTblCart tr td:nth-of-type(3),.signupSectionProductTblCart tr th:nth-of-type(3){grid-area: type;}
.signupSectionProductTblCart tr td:nth-of-type(4),.signupSectionProductTblCart tr th:nth-of-type(4){grid-area: period;}
.signupSectionProductTblCart tr td:nth-of-type(5),.signupSectionProductTblCart tr th:nth-of-type(5){grid-area: price;}
.signupSectionProductTblCart tr td:nth-of-type(6),.signupSectionProductTblCart tr th:nth-of-type(6){grid-area: remove;}
.signupSectionProductTblCart tr{
  display: grid;
  width: 100%;
  grid-template-columns: 15em auto 10em 10em 10em 5em;
  grid-template-areas:'name description type period price remove';
}
.signupSectionProductTblCart tr td[colspan]{grid-area: unset; grid-column: 1 / span 6;}

@media (max-width:768px) {
  /*** SHOPPING CART ***/
  .signupSectionProductTblCart tr  {
    grid-template-columns: auto 10em 10em 10em 5em;
    grid-template-areas:
    'name type period price remove'
    'description description description description description';
  }
  .signupSectionProductTblCart tr:nth-of-type(1){grid-template-areas:'name type period price remove';}
  .signupSectionProductTblCart tr th:nth-of-type(2){visibility: hidden; display:none;}
  .signupSectionProductTblCart tr.TotalRow td:nth-of-type(2){visibility: hidden; display:none;}
  
}

@media (max-width: 600px) {
  /*** SHOPPING CART ***/
  .signupSectionProductTblCart tr{
    grid-template-columns: 10em auto 5em;
    grid-template-areas:
    'name name type'
    'description description description'
    'price period remove';
  }
  .signupSectionProductTblCart tr:nth-of-type(1){grid-template-areas:'description description description';}
  .signupSectionProductTblCart tr th{visibility: hidden; display:none;}
  .signupSectionProductTblCart tr th:nth-of-type(2){visibility: visible; display: block;}
  .signupSectionProductTblCart tr td:nth-of-type(3){text-align: right;}
  .signupSectionProductTblCart tr td:nth-of-type(5){text-align: left;}
  .signupSectionProductTblCart tr td:nth-of-type(6){text-align: right;}

  .signupSectionProductTblCart tr.TotalRow{
   grid-template-columns: auto 10em;
   grid-template-areas: 'period price'; }
  .signupSectionProductTblCart tr.TotalRow td{visibility: hidden; display:none;}
  .signupSectionProductTblCart tr td:nth-of-type(4),
  .signupSectionProductTblCart tr td:nth-of-type(5){visibility: visible; display: block;}
  .signupSectionProductTblCart tr.TotalRow td:nth-of-type(4){text-align: right;}
  .signupSectionProductTblCart tr.TotalRow td:nth-of-type(5){text-align: right;}
}
/*****************************************************************************************************************************/

/*** SHOPPING CART VIEW ******************************************************************************************************/
.signupSectionProductTblCartView tr td:nth-of-type(1),.signupSectionProductTblCartView tr th:nth-of-type(1){grid-area: name;}
.signupSectionProductTblCartView tr td:nth-of-type(2),.signupSectionProductTblCartView tr th:nth-of-type(2){grid-area: description;}
.signupSectionProductTblCartView tr td:nth-of-type(3),.signupSectionProductTblCartView tr th:nth-of-type(3){grid-area: type;}
.signupSectionProductTblCartView tr td:nth-of-type(4),.signupSectionProductTblCartView tr th:nth-of-type(4){grid-area: period;}
.signupSectionProductTblCartView tr td:nth-of-type(5),.signupSectionProductTblCartView tr th:nth-of-type(5){grid-area: price;}
.signupSectionProductTblCartView tr{
  display: grid;
  width: 100%;
  grid-template-columns: 15em auto 10em 10em 10em;
  grid-template-areas:'name description type period price';
}
.signupSectionProductTblCartView tr td[colspan]{grid-area: unset; grid-column: 1 / span 5;}

@media (max-width:768px) {
  /*** SHOPPING CART ***/
  .signupSectionProductTblCartView tr  {
    grid-template-columns: auto 10em 10em 10em;
    grid-template-areas:
    'name type period price'
    'description description description description';
  }
  .signupSectionProductTblCartView tr:nth-of-type(1){grid-template-areas:'name type period price';}
  .signupSectionProductTblCartView tr th:nth-of-type(2){visibility: hidden; display:none;
}

@media (max-width: 600px) {
  /*** SHOPPING CART ***/
  .signupSectionProductTblCartView tr{
    grid-template-columns: 10em auto 5em;
    grid-template-areas:
    'name name type'
    'description description description'
    'price period period';
  }
  .signupSectionProductTblCartView tr:nth-of-type(1){grid-template-areas:'description description description';}
  .signupSectionProductTblCartView tr th{visibility: hidden; display:none;}
  .signupSectionProductTblCartView tr th:nth-of-type(2){visibility: visible; display: block;}
  .signupSectionProductTblCartView tr td:nth-of-type(3){text-align: right;}
  .signupSectionProductTblCartView tr td:nth-of-type(5){text-align: left;}
  .signupSectionProductTblCartView tr td:nth-of-type(6){text-align: right;}
  }

  .signupSectionProductTblCartView tr.TotalRow{
   grid-template-columns: auto 10em;
   grid-template-areas: 'period price'; }
  .signupSectionProductTblCartView tr.TotalRow td{visibility: hidden; display:none;}
  .signupSectionProductTblCartView tr td:nth-of-type(4),
  .signupSectionProductTblCartView tr td:nth-of-type(5){visibility: visible; display: block;}
  .signupSectionProductTblCartView tr.TotalRow td:nth-of-type(4){text-align: right;}
  .signupSectionProductTblCartView tr.TotalRow td:nth-of-type(5){text-align: right;}

}
/*****************************************************************************************************************************/

/*** Domain Search Form Table ************************************************************************************************/
.signupSectionTblDomainSearch tr{
  display: grid;
  width: 100%;
  grid-template-columns: 15em auto ;
}
.signupSectionTblDomainSearch tr td.SectionTblTdTitle{ word-wrap: normal; }
@media (max-width:768px) {
  /*** Domain Search Form Table ***/
  .signupSectionTblDomainSearch tr  {
    grid-template-columns: auto;
  }
}
@media (max-width: 600px) {
  /*** Domain Search Form Table ***/
  .signupDomainSearchButtons{ display: block; } 
}
/*****************************************************************************************************************************/

/*** Domain Results Table ****************************************************************************************************/
.signupFormDomainResultsTbl tr td:nth-of-type(1){grid-area: checkbox;}
.signupFormDomainResultsTbl tr td:nth-of-type(2){grid-area: domain;}
.signupFormDomainResultsTbl tr td:nth-of-type(3){grid-area: desciption;}
.signupFormDomainResultsTbl tr td:nth-of-type(4){grid-area: period;}
.signupFormDomainResultsTbl tr td:nth-of-type(5){grid-area: price;}
.signupFormDomainResultsTbl tr{
    display: grid;
    width: 100%;  
    grid-template-columns: 2.5em auto 15em 10em 10em;
    grid-template-areas:'checkbox domain desciption period price';
}
.signupFormDomainResultsTbl tr td[colspan]{grid-area: unset; grid-column: 1 / span 5;}
@media (max-width:768px) {
  /*** Domain Results Table ***/
  .signupFormDomainResultsTbl tr  {
    grid-template-columns: 2.5em auto 10em 10em;
    grid-template-areas:'checkbox domain period price';
  }
  .signupFormDomainResultsTbl tr td:nth-of-type(3){visibility: hidden; display:none;}
}
@media (max-width:600px) {
  /*** Domain Results Table ***/
  .signupFormDomainResultsTbl tr  {
    grid-template-columns: 2.5em auto 10em;
    grid-template-areas:'checkbox domain price';
  }
  .signupFormDomainResultsTbl tr td:nth-of-type(4){visibility: hidden; display:none;}
  .signupFormDomainResultsTbl tr td:nth-of-type(5){text-align: right;}
}
/*****************************************************************************************************************************/

/*** Contacts Table **********************************************************************************************************/
.signupSectionTblContactsTR{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
}
.signupSectionTblContactsTR table{ width: 100%; }
@media (max-width:600px) {
  .signupSectionTblContactsTR{
    grid-template-columns: auto;
  }
}
/*****************************************************************************************************************************/

/*** Promo Code Table ********************************************************************************************************/
.signupSectionTblPromoCode tr td:nth-of-type(1){grid-area: title;}
.signupSectionTblPromoCode tr td:nth-of-type(2){grid-area: input;}
.signupSectionTblPromoCode tr td:nth-of-type(3){grid-area: submit;}
.signupSectionTblPromoCode tr{
  display: grid;
  width: 100%;
  grid-template-columns: auto auto auto;
  grid-template-areas:'title input submit';
}
.signupSectionTblPromoCode tr td[colspan]{grid-area: unset; grid-column: 1 / span 3;}
@media (max-width:768px) {
  .signupSectionTblPromoCode tr{
    grid-template-columns: auto auto-fill;
    grid-template-areas:
      'title title'
      'input submit';
  }
}
@media (max-width:600px) {
  .signupSectionTblPromoCode tr{
    grid-template-columns: auto;
    grid-template-areas: 'title' 'input' 'submit';
  }
}
/*****************************************************************************************************************************/

/*** NEW/EXISTING Client Table ***********************************************************************************************/
.signupSectionTblClientTR td{ width: 100%; }
.signupSectionTblClientTR{
  display: grid;
  width: 100%;
  grid-gap:10px;
  grid-template-columns: 1fr 1fr;
}
.signupAccInfoTbl{
  display: table;
  width: 100%;
}
.signupAccInfoTbl td{ width: unset; }
@media (max-width:600px) {
  .signupSectionTblClientTR{
    grid-template-columns: auto;
  }
}
/*****************************************************************************************************************************/

/*** Account Details Table ***************************************************************************************************/
.signupSectionTblAccDetailsTR{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
}
@media (max-width:600px) {
  .signupSectionTblAccDetailsTR{
    grid-template-columns: auto;
  }
}
/*****************************************************************************************************************************/

/*** Payment Methods Table ***************************************************************************************************/
.signupSectionTblPaymentMethods tr{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr auto 1fr;
}

@media (max-width:768px) {
  .signupSectionTblPaymentMethods tr{
    grid-template-columns: auto;
  }
  .signupSectionTblPaymentMethods tr td:nth-of-type(1){border-bottom: unset;}
  .signupSectionTblPaymentMethods tr td:nth-of-type(2){border-bottom: unset;}  
}
/*****************************************************************************************************************************/



/*** Collect Additional Products Details (Domains/SSL) **********************************************************************/
.signupSectionTblAdditionalProductDetails tr{
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
}
.signupSectionTblAdditionalProductDetails tr td[colspan]{grid-area: unset; grid-column: 1 / span 2;}

@media (max-width:600px) {
  .signupSectionTblAdditionalProductDetails tr{
    grid-template-columns: auto;
  }
  .signupSectionTblAdditionalProductDetails tr td:nth-of-type(1){border-bottom: unset;}
}
/*****************************************************************************************************************************/