/* CSS declarations go here */

#at-facebook {
  background: #3B5998;
  color: #fff;
}

#at-facebook.disabled {
  color: #ddd;
  background: #666666;
}

#at-facebook:hover {
  background: #2C4780;
}

#at-linkedin {
  background: #338AB0;
  color: #fff;
}

#at-linkedin.disabled {
  color: #ddd;
  background: #666666;
}

#at-linkedin:hover {
  background: #0571A6;
}

#at-twitter {
  background: #4099FF;
  color: #fff;
}

#at-twitter.disabled {
  color: #ddd;
  background: #666666;
}

#at-twitter:hover {
  background: #3288EB;
}

#at-google {
  background: #db5a3c;
  color: #fff;
}

#at-google.disabled {
  color: #ddd;
  background: #666666;
}

#at-google:hover {
  background: #CA4C2E;
}

#at-github {
  background: #666;
  color: #fff;
}

#at-github.disabled {
  color: #ddd;
  background: #666666;
}

#at-github:hover {
  background: #555;
}

.at-input.validating * {
  cursor: progress;
}

.log-element {
  text-align: center;
}

.tablecontainer {
  border: 1px;
}

.tablehead {
  background-color: lavender;
}

.tablerow {
  background-color: cornsilk;
  flex-direction: row;
  flex-wrap: wrap;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: center;
  justify-content: center;
  width: 100%;
}

.tablecol {
  margin: 3px;
}

.tablecolheader {
  font-weight: bold;
  text-align: left;
  text-transform: capitalize;
  _background-color: pink;
  margin-top: 2px;
  margin-bottom: 2px;
}

.tablecolcontainer {
  text-align: left;
  overflow-y: scroll;
}

.tablecolfooter {
  text-align: left;
  background-color: seashell;
  height: 25px;
}

.tablecol {
  background-color: whitesmoke;
}

@font-face {
  font-family: "NotSanFrancisco";
  src: url('font/NotSanFrancisco.eot');
  src: url('font/NotSanFrancisco.eot?#iefix') format('embedded-opentype'),
    url('font/NotSanFrancisco.ttf') format('truetype');
}

@font-face {
  font-family: "NotSanFrancisco-Light";
  src: url('font/NotSanFranciscoLight.eot');
  src: url('font/NotSanFranciscoLight.eot?#iefix') format('embedded-opentype'),
    url('font/NotSanFranciscoLight.ttf') format('truetype');
}

a,
a:hover,
a:active,
a:visited {
  color: inherit;
  text-decoration: none;
  background: transparent;
}

a:hover {
  color: grey;
}

body {
  width: 100%;
  margin: 5px;
  color: #666;
  background: white;
  font-family: 'NotSanFrancisco-Light';
  font-size: 16px;
  text-align: center;
}

table {
  margin-left: auto;
  margin-right: auto;
}

form {
  display: table;
}

p {
  display: table-row;
}

label {
  display: table-cell;
}

input {
  display: table-cell;
}

#at-pwd-form {
  width: 100%;
}

#at-pwd-form > div {
  display: block;
}

#at-pwd-form > div > label {
  display: block;
}

#at-pwd-form > div > p {
  display: block;
}

div.at-form {
  text-align: center;
  line-height: 1.5;
}

div.at-form > div > p {
  display: block;
}

#at-field-email {
  width: 300px;
}

#at-field-password {
  width: 300px;
}

/* unvisited link */

a:link {
  color: green;
  text-underline: ;
}

/* visited link */

a:visited {
  color: green;
}

/* mouse over link */

a:hover {
  color: red;
}

/* selected link */

a:active {
  color: yellow;
}

a:link {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:active {
  text-decoration: underline;
}