/* 2020-11-02 */

/*
   Email Preferences pages
   Tables of email preferences
   Create custom radio button "checked"/"selected" indicators
*/

/**** styling for the table ****/

table {
  table-layout: auto;
  border-collapse: separate;
  border-spacing: 4px 2px;    
}

td {
  border: 1px solid #CCCCCC;
  border-spacing: inherit;
}

td:hover {
  background-color: #DDDDDD;
}

.none {
  border: none;
}

.none:hover {
  cursor: default;
}

/* Container of a table row of Yes and No radio buttons and the Description */
tr {
  position: relative;
  cursor: pointer;
  display: table-row;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default radio button */
tr input.emev-y,.emev-n,.emaddr-y,.emaddr-n,.emunall-y,.emunall-n,.delmem-y,.delmem-n,.mvus-y,.mvus-n,.alum-y,.alum-n {
  position: relative;
  opacity: 0;
  cursor: pointer;
}

/**** Create custom checked NO radio button ****/

/* Create the indicator (hidden when not checked) */
.emp_rb_n:after {
  color: #FF0000;
  content: '\2716';
  position: relative;
  text-align: center;
  top: -1.5em;
  height: 0px;
  display: none;
}

/* Show the indicator when checked */
tr input:checked ~ .emp_rb_n:after {
  display: block;
}

/**** Create a custom checked YES radio button ****/

/* Create the indicator (hidden when not checked) */
.emp_rb_y:after {
  color: SeaGreen;
  content: '\2714';
  position: relative;
  text-align: center;
  top: -1.5em;
  height: 0px;
  display: none;
}

/* Show the indicator when checked */
tr input:checked ~ .emp_rb_y:after {
  display: block;
}

/**** styling for confirmation page buttons ****/

.emb {
  border: none;
  color: white;
  cursor: pointer;
  display: inline-block;
  font-size: 16px;
  font-style: normal;
  margin: 4px 2px;
  padding: 10px;
  text-align: center;
  text-decoration: none;
  !important
}
  
.emy {
  background-color: #4CAF50; /* green */
}

.emn {
  background-color: #BB5050; /* red */
}

/**** overide an NB default styling ****/

input[type="radio"] {
  margin-left: 33% !important;
}

/**** buttons ****/

.bSetSave:after {
  content: 'SAVE MY DATA';
}

.bSetTerm:after {
  content: 'TERMINATE MY DA MEMBERSHIP';
}

.bOKData:after {
  content: 'MY DATA IS OK';
}