Last active
September 4, 2018 05:40
-
-
Save joelethan/f3f414abd22356ed9a15bedfcd2d1ff9 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* body{ | |
| background-color: black; | |
| } */ | |
| /* Add a black background color to the top navigation */ | |
| .horizontal_nav { | |
| background-color:black; | |
| overflow: hidden; | |
| padding: 10px; | |
| border-color: #f442e5; | |
| } | |
| /* Style the links inside the navigation bar */ | |
| .horizontal_nav a { | |
| float: left; | |
| border-radius: 8px; | |
| color: #f442e5; | |
| text-align: center; | |
| padding: 10px; | |
| text-decoration: none; | |
| font-size: 25px; | |
| font-family:calibri; | |
| font-weight:bold; | |
| } | |
| /* Change the color of links on hover */ | |
| .horizontal_nav a:hover { | |
| background-color:#f442e5; | |
| color: black; | |
| } | |
| /* Add a color to the active/current link */ | |
| .horizontal_nav a.active { | |
| background-color:#f442e5; | |
| color: black; | |
| } | |
| .signup_form{ | |
| width: 30%; | |
| font-size: 16px; | |
| font-weight: bold; | |
| font-family:"Lato", calibri; | |
| border-radius: 10px; | |
| background-color: #f442e5; | |
| padding: 20px; | |
| transform:translate(160%,-90%); | |
| } | |
| .signup_form input{ | |
| width: 100%; | |
| margin-bottom: 10px; | |
| border-radius: 5px; | |
| } | |
| .signup_form input[type="text"], input[type="password"],input[type=email] | |
| { | |
| border-color: black; | |
| outline: none; | |
| /* height: 40px; */ | |
| /* font-size: 16px; */ | |
| padding: 8px 0px; | |
| padding-left: 5px; | |
| width: 100%; | |
| font-family:"Lato", calibri; | |
| } | |
| .signup_form input[type="submit"] | |
| { | |
| /* height: 40px; */ | |
| padding: 5px 0px; | |
| font-size: 16px; | |
| background: black; | |
| color: #f442e5; | |
| font-family:"Lato", calibri; | |
| text-decoration: none; | |
| font-weight:bold; | |
| } | |
| .image{ | |
| width: 50%; | |
| transform: translate(0%,10%); | |
| border:3px solid #f442e5; | |
| /* border-radius: 5px; */ | |
| } | |
| /* Extra small devices (phones) | |
| @media only screen and (max-width: 600px) { | |
| body {background-color: rgb(175, 32, 147);} | |
| .signup_form{ | |
| transform:translate(160%,-40%); | |
| } | |
| } */ | |
| /* Extra large devices (large screens) */ | |
| @media only screen and (max-width: 1500px) { | |
| body {background-color:rgb(70, 9, 9);} | |
| .signup_form{ | |
| transform:translate(160%,-85%); | |
| } | |
| } | |
| /* Extra large devices (large screens) */ | |
| @media only screen and (max-width: 1100px) { | |
| body {background-color:rgb(51, 3, 22);} | |
| .signup_form{ | |
| transform:translate(160%,-85%); | |
| } | |
| } | |
| /* Large devices */ | |
| @media only screen and (max-width: 992px) { | |
| body {background-color:rgb(10, 53, 31);} | |
| .signup_form{ | |
| transform:translate(160%,-60%); | |
| } | |
| } | |
| /* Medium devices (landscape tablets) */ | |
| @media only screen and (max-width: 768px) { | |
| /* body {background-color: rgb(31, 31, 31);} */ | |
| body {background-color: rgb(28, 6, 43);} | |
| .signup_form{ | |
| transform:translate(160%,-54%); | |
| } | |
| } | |
| /* Small devices (portrait tablets and large phones) */ | |
| @media only screen and (max-width: 600px) { | |
| body {background-color: rgb(58, 5, 5);} | |
| .image{ | |
| width: 96%; | |
| padding: 2%; | |
| border: none; | |
| } | |
| .signup_form{ | |
| width: 90%; | |
| padding: 5%; | |
| transform:translate(0%,20%); | |
| } | |
| } | |
| /* start */ | |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment