/*table {
  background: #FFF;
  border-radius: 2px;
  font-family: 'Roboto', sans-serif;
  font-style: normal;
  font-weight: 300;
  font-size: 14pt;
  letter-spacing: 0.01rem;
  color: #000;
  text-rendering: optimizeLegibility;
  width: 100%;
  max-width: 100%;
  
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24); }

table > thead > tr > th {
  font-weight: 400;
  color: #757575;
  vertical-align: bottom;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

table > thead > tr > th, table > tbody > tr > th, table > tfoot > tr > th, table > thead > tr > td, table > tbody > tr > td, table > tfoot > tr > td {
  text-align: left;
  padding: 16pt;
  vertical-align: top;
  border-top: 0;
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;}
*/

/*
table {
  background: #FFF;
  width: 100%;
  max-width: 100%;
  word-wrap: break-word; }

table > thead > tr > th {
 }

table > tbody > tr {
  width: 100%; }

table > tbody {
  width: 100%; }

table > tbody > tr > td {
  width: calc(100% / 3); }
*/


.userinfo > .table {
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
  width: 100%; }

.userinfo > .table > .tbody > .tr > .td, .userinfo > .table > .thead > .tr > .th {
  display: inline-block;
  width: calc((100% / var(--cnt_cells)) - 30px);
  max-width: calc((100% / var(--cnt_cells)) - 48px);
  margin: 12px 24px;
  overflow: hidden;
  line-height: 18pt;
  font-family: 'Roboto', sans-serif;
  text-rendering: optimizeLegibility;
  vertical-align: top;

  -moz-user-select: none; 
  -webkit-user-select: none; 
  -ms-user-select: none; 
  -o-user-select: none; 
  user-select: none;
  height: 24px;
  word-break: break-all; }

.userinfo > .table > .tbody > .tr > .td {
  font-size: 10pt;
  color: #212121; }

.userinfo > .table > .thead > .tr > .th {
  font-size: 11pt;
  color: #757575;
  font-weight: 400;
  text-align: left; }

.userinfo > .table > .thead > .tr, .table > .tbody > .tr {
  width: calc (100% - 4px);
  margin: 0 2px; }


.userinfo > .table > .tbody > .tr > .td > a {
  color: #4e4e4e;
  font-weight: 600;
  font-style: italic; }

.userinfo > .table > .thead > .tr {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.userinfo > .table > .tbody > .tr {
  /*border-bottom: 1px solid rgba(0, 0, 0, 0.12);*/
  cursor: pointer;
  transition: all 0.1s ease; }

.userinfo > .table > .tbody > .tr:hover {
  background: #EEEEEE }

.color2 {
  background: #F5F5F5; }

.userinfo > .tabletitle {
  text-align: center;
  font-family: 'Roboto', sans-serif;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24);
  padding: 10px 0;
  margin-top: 10px;
  color: #575757;
  font-size: 15pt;
  background: #F1F5FB; }

.userinfo > .title {
  background: #3949AB;
  color: #FFF;
  padding: 10px 0;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.24); }

.userinfo > .title > .emailtitle, .userinfo > .title > .btnmenutitle {
  font-family: 'Roboto', sans-serif;
  overflow: hidden;
  font-size: 22pt;
  display: inline-block;
  vertical-align: top;
  height: 41px;
  text-align: center; }

.userinfo > .title > .emailtitle {
  width: calc(100% - 70px); }

.userinfo > .title > .btnmenutitle {
  width: 70px; }