[Summary view] [Print] [Text view]

   1  .outer {
   2    position: relative;
   3    display: flex;
   4    flex-direction: column;
   5    align-items: center;
   6    justify-content: center;
   7    width: 100%;
   8    min-height: 100vh;
   9    padding: 20px;
  10    overflow: hidden;
  11  }
  12  
  13  .offline-card {
  14    width: 100%;
  15    max-width: 30em;
  16    margin: 60px auto;
  17    background-color: white;
  18    border: 1px solid rgba(0, 0, 0, 0.1);
  19    border-radius: 5px;
  20    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  21  }
  22  
  23  .header {
  24    position: relative;
  25    padding: 1em 2em;
  26    margin: 0;
  27    color: white;
  28    text-align: center;
  29    background-color: var(--cassiopeia-color-primary);
  30    background-image: linear-gradient(135deg, var(--cassiopeia-color-primary) 0%, var(--cassiopeia-color-hover) 100%);
  31    border-radius: 5px 5px 0 0;
  32  }
  33  [dir=rtl] .header {
  34    background-image: linear-gradient(135deg, var(--cassiopeia-color-hover) 0%, var(--cassiopeia-color-primary) 100%);
  35  }
  36  
  37  .login {
  38    padding: 40px 20px 20px;
  39  }
  40  
  41  .form-control {
  42    max-width: none;
  43  }
  44  
  45  img {
  46    max-width: 100%;
  47    height: auto;
  48    margin: 15px 0;
  49    border: 0;
  50  }
  51  
  52  form,
  53  fieldset {
  54    padding: 0;
  55    margin: 0;
  56  }
  57  
  58  label {
  59    display: block;
  60    margin: 0;
  61  }
  62  
  63  input[type=text],
  64  input[type=password] {
  65    box-sizing: border-box;
  66    width: 100%;
  67    height: auto;
  68  }
  69  
  70  input {
  71    margin: 0.5em 0 1em;
  72  }
  73  
  74  .logo-icon {
  75    position: absolute;
  76    top: 100%;
  77    left: 50%;
  78    z-index: 1;
  79    padding: 12px;
  80    margin-top: 2px;
  81    background-color: white;
  82    border: 1px solid rgba(0, 0, 0, 0.05);
  83    border-radius: 50%;
  84    box-shadow: 0 0 5px rgba(0, 0, 0, 0.075);
  85    -webkit-transform: translate(-50%, -50%);
  86            transform: translate(-50%, -50%);
  87  }
  88  
  89  .logo-icon svg {
  90    display: block;
  91    width: 38px;
  92  }