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 .loginlinks {
  98   margin: 5px 10px 0; /* IE8 and older do not support rem */
  99   margin: 0.5rem 1rem 0;
 100 }
 101
 102 .loginarea {
 103   margin: 5px 10px 0; /* IE8 and older do not support rem */
 104   margin: 0.5rem 1rem 0;
 105 }
 106
 107 .resetinfo,
 108 .verifyinfo,
 109 .newpwdinfo,
 110 .signinwelcome {
 111   margin: 5px 10px 0; /* IE8 and older do not support rem */
 112   margin: 0.5rem 1rem 0;
 113 }
 114
 115 .resetinfo.done,
 116 .verifyinfo.done {
 117   padding-left: 20px;
 118   background-image: url("check.png");
 119   background-repeat: no-repeat;
 120   background-position: 0 50%;
 121 }
 122
 123 .signinwelcome {
 124   font-size: 1.2em;
 125 }
 126
 127 .otheremaillinks > a {
 128   background-color: #EEEEDD;
 129   text-decoration: none;
 130   padding: .2em;
 131   border-radius: 3px;
 132 }
 133 .otheremaillinks > a:link, .otheremaillinks > a:visited { color: #BBBBBB; }
 134 .otheremaillinks > a:hover, .otheremaillinks > a:active { color: #808080; }
 135
 136 #addanotheremail { /* HACK - not implemented yet */
 137   background-color: transparent !important;
 138   color: transparent !important;
 139 }
 140
 141 .small {
 142   font-size: 0.75em;
 143 }
 144 .hidden {
 145   display: none;
 146 }
 147 .warn {
 148   color: red;
 149 }
 150 .donotshow {
 151   position: absolute;
 152   right: -1000px;
 153   opacity: 0;
 154 }
 155
 156 input,
 157 select {
 158   font-size: .9em;
 159 }
 160
 161 @media screen and (max-width: 375px) {
 162   /* On smaller devices, make the form elements into larger touch targets. */
 163   input,
 164   select {
 165     font-size: 1em;
 166     padding-top: 0.5em;
 167     padding-bottom: 0.5em;
 168   }
 169 }
 170
 171 input:invalid {
 172   box-shadow: 0 0 2px 1px red;
 173 }