Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- html, body{
- height: 100%;
- }
- body{
- background-color: #f0040f;
- -webkit-animation: color 5s ease-in 0s infinite alternate;
- -moz-animation: color 5s linear 0s infinite alternate;
- animation: color 5s linear 0s infinite alternate;
- background-size: cover;
- }
- /* Animasi + Prefix untuk browser */
- @-webkit-keyframes color {
- 0% { background-color: #f1c40f; }
- 32% { background-color: #e74c3c; }
- 55% { background-color: #9b59b6; }
- 76% { background-color: #16a085; }
- 100% { background-color: #2ecc71; }
- }
- @-moz-keyframes color {
- 0% { background-color: #f1c40f; }
- 32% { background-color: #e74c3c; }
- 55% { background-color: #9b59b6; }
- 76% { background-color: #16a085; }
- 100% { background-color: #2ecc71; }
- }
- @keyframes color {
- 0% { background-color: #f1c40f; }
- 32% { background-color: #e74c3c; }
- 55% { background-color: #9b59b6; }
- 76% { background-color: #16a085; }
- 100% { background-color: #2ecc71; }
- }
- header{
- width: 98%;
- height: 60px;
- font-family: arial;
- position:fixed;
- font-size: 20px;
- color: white;
- margin: auto;
- background-color: black;
- opacity: 0.7;
- }
- header .nav{
- padding-left: 40%;
- padding-top: 20px;
- }
- a{
- text-decoration: none;
- color: white;
- }
- header .nav a{
- text-decoration: none;
- color:white;
- }
- header .nav a:hover{
- color: blue;
- }
- header img{
- float: left;
- padding-left: 5%;
- height:100%;
- }
- footer{
- width: 100%;
- height: 5%;
- font-family: arial;
- font-size: 120%;
- color: white;
- text-align: center;
- }
- #gambar
- {
- width: 70%;
- }
- .isi1{
- margin-top: 5%;
- margin-left: 30%;
- width: 35%;
- color: blue;
- background:rgba(0,0,0,0.6);
- text-align: left;
- padding: 1%;
- font-family: arial;
- }
- .isi{
- min-height: 92%;
- }
- .welcome{
- margin-top: 5%;
- margin-left: 30%;
- width: 35%;
- color: blue;
- background:rgba(0,0,0,0.6);
- text-align: center;
- padding: 1%;
- font-family: arial;
- }
- .welcome img{
- width: 70%;
- }
- .go {
- margin-top: 1%;
- margin-left: 43%;
- background-color: blue;
- color: #fff;
- background-repeat: no-repeat;
- border: 1px solid #e1e8ed;
- border-radius:8px;
- cursor: pointer;
- display: inline-block;
- font-size: 20px;
- line-height: normal;
- padding: 8px 16px;
- position: relative;
- }
- .go:hover{
- background-color: red;
- }
- /* responnsiv */
- @media (max-width: 720px){
- header a{
- display: none;
- }
- .nav{
- display: none;
- }
- .welcome{
- width: 100%;
- font-size: 20px;
- text-align: center;
- }
- .welcome h1,img{
- text-align: center;
- margin: auto;
- width: 80%;
- }
- .go{
- width: 80%;
- }
- header{
- display: none;
- }
- }
- @media (min-width: 720px) and (max-width: 992px)
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement