* { box-sizing: border-box; }

html { font-size: 14px; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol"; }

body { margin: 0; background: #663399; padding: 30px 20px; }

#container { max-width: 400px; margin: 0 auto; padding: 20px 10px; text-align: center; border-radius: 10px; background: #fff; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 5px 0; }

h1, h2 { font-weight: 500; font-size: 18px; }

h1.firebaseui-title { color:rgb(63,81,181); font-weight: bold; font-size: 16px; text-transform: uppercase; }

.clearfix { clear: both; }

.hidden { display: none; }

#logo { width: 50px; }

#name { font-weight: 600; margin: 0 5px; }

.firebaseui-container.mdl-card { box-shadow: none; }

p, .firebaseui-tos { margin: 0 0 5px 0; font-size: 12px; }

#footer { font-size: 11px; color: #333; font-family: Roboto,arial,sans-serif; }

.firebaseui-tos { font-size: 11px; }

button { padding: 10px 15px; border-radius: 5px; border: 1px solid #bbb; font-weight: 600; cursor: pointer; margin: 0 5px; }

.firebaseui-idp-list>.firebaseui-list-item, .firebaseui-tenant-list>.firebaseui-list-item { margin-bottom: 10px; }

.firebaseui-card-content { padding: 0 40px; }

#user-info { border: 1px solid #CCC; clear: both; margin: 20px 40px; padding: 10px; text-align: left; font-size: 12px; }

#photo-container { background-color: #EEE; border: 1px solid #CCC; float: left; height: 82px; margin-right: 10px; width: 82px; border-radius: 5px; }

#photo { height: 80px; margin: 0; width: 80px; border-radius: 5px; }

#is-new-user { padding: 10px 0; }

.firebaseui-idp-button { max-width: 250px; }

.firebaseui-title, .firebaseui-subtitle { font-size: 15px; font-weight: normal; line-height: normal; text-align: center; }

.firebaseui-title { padding-bottom: 5px; }

.firebaseui-text { font-size: 14px; }

.e-summary { display: none; }

.v-auth-phone button.firebaseui-idp-button { display: none; }

.v-auth-phone button.firebaseui-idp-phone { display: inline-block !important; }

.a-notice { color:red; font-weight: bold; }

@media (max-width: 400px) {
  html { font-size: 12px; }
  body { padding: 10px 5px; }
  p { font-size: 10px; }
  #footer, .firebaseui-tos { font-size: 9px;}
  #container { padding: 10px 1px; }
  #photo-container, #photo { height: 30px; width: 30px; }
  .firebaseui-idp-text {font-size: 12px;}
}
