authsystem.css

   1 /* This Source Code Form is subject to the terms of the Mozilla Public
   2  * License, v. 2.0. If a copy of the MPL was not distributed with this file,
   3  * You can obtain one at http://mozilla.org/MPL/2.0/. */
   4
   5 body {
   6   font-family: sans-serif;
   7 /*  margin: 0; */
   8   background-color: #FFFFEE;
   9   padding-top: 5em; /* leave space for total height of h1: 4+1(r)em */
  10 }
  11
  12 h1 {
  13   position: absolute;
  14   top: 0;
  15   left: 0;
  16   right: 0;
  17   margin: 0;
  18   padding: 10px 0 0 130px; /* IE8 and older do not support rem */
  19   padding: 1rem 0 0 130px;
  20   height: 60px; /* IE8 and older do not support rem */
  21   height: 4rem;
  22   min-height: calc(70px - 1rem);
  23   font-size: 2em;
  24   background-color: #003366;
  25   color: #FFFFEE;
  26   background-image: url("KaiRoLogo-100x62.png");
  27   background-repeat: no-repeat;
  28   background-position: 10px 50%;
  29   overflow: hidden;
  30 }
  31 @media screen and (max-width: 550px) {
  32   h1 {
  33     font-size: 1.5em;
  34   }
  35 }
  36 @media screen and (max-width: 375px) {
  37   h1 {
  38     font-size: 1.2em;
  39     padding-left: 120px;
  40   }
  41 }
  42 @media screen and (max-width: 325px) {
  43   h1 {
  44     padding-top: 0.5rem;
  45     height: 4.5rem;
  46     min-height: calc(70px - 0.5rem);
  47   }
  48 }
  49
  50 a:link { color: #669999; }
  51 a:visited { color: #003366; }
  52 a:hover, a:active { color: #88BBBB; }
  53
  54 ul.flat {
  55  list-style-type: none;
  56  margin: 0em;
  57  padding: 0px;
  58 }
  59 ul.flat li {
  60  margin: 0 0 0.2em 0;
  61  padding: 0px;
  62 }
  63 p.flat {
  64   border: 0px;
  65   margin: 0px;
  66   padding: 0px;
  67 }
  68 form.flat {
  69   border: 0px;
  70   margin: 0px;
  71   padding: 0px;
  72 }
  73
  74 table.border {
  75  border-spacing: 0px;
  76  border-collapse: collapse;
  77  empty-cells: show;
  78  border-left: 1px solid #336699;
  79  border-top: 1px solid #336699;
  80 }
  81 table.border th, table.border td {
  82  border-bottom: 1px solid #336699;
  83  border-right: 1px solid #336699;
  84 }
  85 table.border td {
  86  padding-left: 3px;
  87  padding-right: 3px;
  88 }
  89
  90 .loginheader {
  91   font-size: 1.2em;
  92   font-weight: bold;
  93   margin: 5px 10px 0; /* IE8 and older do not support rem */
  94   margin: 0.5rem 1rem 0;
  95 }
  96
  97 .loginheader > .groupmails {
  98   font-weight: normal;
  99   margin: 5px 0; /* IE8 and older do not support rem */
 100   margin: 0.5rem 0;
 101 }
 102
 103 .loginlinks {
 104   margin: 5px 10px 0; /* IE8 and older do not support rem */
 105   margin: 0.5rem 1rem 0;
 106 }
 107
 108 .loginarea {
 109   margin: 5px 10px 0; /* IE8 and older do not support rem */
 110   margin: 0.5rem 1rem 0;
 111 }
 112
 113 .resetinfo,
 114 .verifyinfo,
 115 .addemailinfo,
 116 .newpwdinfo,
 117 .signinwelcome {
 118   margin: 5px 10px 0; /* IE8 and older do not support rem */
 119   margin: 0.5rem 1rem 0;
 120 }
 121
 122 .resetinfo.done,
 123 .verifyinfo.done {
 124   padding-left: 20px;
 125   background-image: url("check.png");
 126   background-repeat: no-repeat;
 127   background-position: 0 50%;
 128 }
 129
 130 .signinwelcome {
 131   font-size: 1.2em;
 132 }
 133
 134 .otheremaillinks > a {
 135   background-color: #EEEEDD;
 136   text-decoration: none;
 137   padding: .2em;
 138   border-radius: 3px;
 139 }
 140 .otheremaillinks > a:link, .otheremaillinks > a:visited { color: #BBBBBB; }
 141 .otheremaillinks > a:hover, .otheremaillinks > a:active { color: #808080; }
 142
 143 .small {
 144   font-size: 0.75em;
 145 }
 146 .hidden {
 147   display: none;
 148 }
 149 .warn {
 150   color: red;
 151 }
 152 .donotshow {
 153   position: absolute;
 154   right: -1000px;
 155   opacity: 0;
 156 }
 157
 158 input,
 159 select {
 160   font-size: .9em;
 161 }
 162
 163 @media screen and (max-width: 375px) {
 164   /* On smaller devices, make the form elements into larger touch targets. */
 165   input,
 166   select {
 167     font-size: 1em;
 168     padding-top: 0.5em;
 169     padding-bottom: 0.5em;
 170   }
 171 }
 172
 173 input:invalid {
 174   box-shadow: 0 0 2px 1px red;
 175 }