FormEase.github.io/forgot.css at main · Akansha77/FormEase.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "segoe ui", verdana, helvetica, arial, sans-serif;
    font-size: 16px;
    transition: all 500ms ease; }

  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    -moz-font-feature-settings: "liga" on; }

  .row {
    background-color: linear-gradient(rgba(92, 15, 128, 0.5),rgba(92, 15, 128, 0.5));;
    color: #fff;
    text-align: center;
    padding: 2em 2em 0.5em;
    width: 90%;
    margin: 2em	auto;
    border-radius: 5px; }
    .row h1 {
      font-size: 2.5em; }
    .row .form-group {
      margin: 0.5em 0; }
      .row .form-group label {
        display: block;
        color: #fff;
        text-align: left;
        font-weight: 600; }
      .row .form-group input, .row .form-group button {
        display: block;
        padding: 0.5em 0;
        width: 100%;
        margin-top: 1em;
        margin-bottom: 0.5em;
        background-color: inherit;
        border: none;
        border-bottom: 1px solid #555;
        color: #eee; }
        .row .form-group input:focus, .row .form-group button:focus {
          background-color: #fff;
          color: #000;
          border: none;
          padding: 1em 0.5em; animation: pulse 1s infinite ease;}
      .row .form-group button {
        border: 1px solid #fff;
        border-radius: 5px;
        outline: none;
        -moz-user-select: none;
        user-select: none;
        color: #333;
        font-weight: 800;
        cursor: pointer;
        margin-top: 2em;
        padding: 1em; }
        .row .form-group button:hover, .row .form-group button:focus {
          background-color: #fff; }
        .row .form-group button.is-loading::after {
          animation: spinner 500ms infinite linear;
          content: "";
          position: absolute;
          margin-left: 2em;
          border: 2px solid #000;
          border-radius: 100%;
          border-right-color: transparent;
          border-left-color: transparent;
          height: 1em;
          width: 4%; }
    .row .footer h5 {
      margin-top: 1em; }
    .row .footer p {
      margin-top: 2em; }
      .row .footer p .symbols {
        color: #444; }
    .row .footer a {
      color: inherit;
      text-decoration: none; }

  .information-text {
    color: #ddd; }

  @media screen and (max-width: 320px) {
    .row {
      padding-left: 1em;
      padding-right: 1em; }
      .row h1 {
        font-size: 1.5em !important; } }
  @media screen and (min-width: 900px) {
    .row {
      width: 50%; } }