├── css └── style.css ├── index.html ├── main.js ├── ofice.jpg └── times-solid.svg /css/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | box-sizing: border-box; 3 | margin: 0; 4 | padding: 0; 5 | } 6 | 7 | body { 8 | display: flex; 9 | align-items: center; 10 | justify-content: center; 11 | height: 100vh; 12 | background-image: url(../ofice.jpg); 13 | background-repeat: no-repeat; 14 | background-size: 100% 100%; 15 | font-family: serif; 16 | } 17 | 18 | .big { 19 | display: none; 20 | height: 100%; 21 | width: 100%; 22 | background-color: rgba(7, 7, 255, 0.5); 23 | } 24 | 25 | .content{ 26 | background-color: white; 27 | width: 35rem; 28 | height: 17rem; 29 | margin-left: 34%; 30 | margin-top: 18%; 31 | } 32 | 33 | .btn{ 34 | border: none; 35 | background:none; 36 | margin-left: 88%; 37 | cursor: pointer; 38 | } 39 | 40 | .btn ion-icon{ 41 | font-size: 60px; 42 | color:red; 43 | } 44 | 45 | .text{ 46 | font-size: 50px; 47 | margin-left: 22%; 48 | margin-top: 7%; 49 | } 50 | 51 | .project { 52 | background-color: white; 53 | width: 35rem; 54 | height: 17rem; 55 | } 56 | 57 | .text2 { 58 | margin-left: 5rem; 59 | margin-top: 3rem; 60 | font-size: 65px; 61 | } 62 | 63 | .btn2 { 64 | background-color: deepskyblue; 65 | padding: 15px; 66 | border: none; 67 | border-radius: 10px; 68 | margin-left: 13rem; 69 | margin-top: 3rem; 70 | color: white; 71 | cursor: pointer; 72 | } 73 | 74 | .btn2:hover{ 75 | border:2px solid deepskyblue; 76 | background: none; 77 | color: deepskyblue; 78 | } 79 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 | 6 | 7 |