LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code

forgot your password? click here

CSS
* {
  box-sizing: border-box;
  /* Box sizing. Thanks Chris Coyier! */
  position: relative;
}

body {
  background: #333;
  font-family: "Open Sans";
  font-size: 10px;
}

input:not([type="button"]) {
  /* Sets these values on the text and password fields. */
  background: transparent;
  border: 0;
  color: #444;
  font-family: "Open Sans";
  font-size: 1.5em;
  font-weight: bold;
  height: 5em;
  width: 100%;
}

input::-webkit-input-placeholder {
  /* Sets color of placeholder text in webkit browsers. // TODO: check this in non-webkit browsers. */
  color: #444;
}

input:not([type="button"]):nth-child(1) {
  border-bottom: .1em solid #333;
}

input:not([type="button"]):nth-child(2) {
  border-top: .1em solid #333;
}

input[type="button"] {
  background: #111;
  border: .4rem solid #333;
  border-radius: 100%;
  color: #444;
  font-size: 2vmax;
  font-size: 1.2rem;
  height: 3em;
  position: absolute;
  right: -1.5em;
  top: 2.8rem;
  /* top:2.5em; */
  width: 3em;
}

input:focus {
  outline: 0;
}

form {
  background: #111;
  border-radius: 1em;
  margin: 5vmax auto 0;
  padding: 0 2em;
  width: 50vmax;
}

p {
  color: #555;
  font-size: 1.5em;
  font-weight: bold;
  margin: 1em auto;
  padding-left: 1.3em;
  width: 50%;
}

a {
  color: #666;
  text-decoration: none;
}
Host Instantly Drag and Drop Website Builder

 

Description

Little login box I saw on Dribbble. Happy Codevember!
Term
Wed, 11/29/2017 - 11:23

Related Codes

Pen ID
Pen ID
Pen ID