style.css 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. body {
  2. background-color: #402040;
  3. margin-left: 10%;
  4. margin-right: 10%;
  5. margin-top: 5%;
  6. margin-bottom: 1%;
  7. }
  8. h1, h2, p, a, span {
  9. color: #e5f5f5;
  10. font-family: "Fira Sans", "Roboto", "Noto Sans", "FreeSans", "Liberation Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  11. }
  12. h1, h2, #title {
  13. text-align: center;
  14. hyphens: none;
  15. }
  16. h1 {
  17. font-size: 125px;
  18. margin-bottom: 30px;
  19. }
  20. h2 {
  21. font-size: 100px;
  22. margin-bottom: 0px;
  23. margin-top: 0px;
  24. }
  25. header {
  26. width: 100%;
  27. height: 100%;
  28. max-width: 100%;
  29. min-width: 100%;
  30. margin-bottom: 50px;
  31. }
  32. header img {
  33. display: inline-block;
  34. vertical-align: middle;
  35. width: 100%;
  36. height: 100%;
  37. max-width: 128px;
  38. max-height: 128px;
  39. }
  40. img {
  41. image-rendering: -moz-crisp-edges; /* Firefox */
  42. image-rendering: -o-crisp-edges; /* Opera */
  43. image-rendering: -webkit-optimize-contrast; /* Chrome & Safari */
  44. image-rendering: pixelated; /* Chrome */
  45. image-rendering: optimize-contrast; /* CSS3 Proposed */
  46. -ms-interpolation-mode: nearest-neighbor; /* IE8+ */
  47. image-rendering: crisp-edges;
  48. }
  49. p {
  50. font-size: 32px;
  51. text-align: justify;
  52. hyphens: auto;
  53. line-height: 1.3;
  54. }
  55. a {
  56. font-weight: 700;
  57. text-decoration: underline;
  58. hyphens: none;
  59. }
  60. a:hover {
  61. text-decoration: none;
  62. }
  63. footer p {
  64. text-align: center;
  65. font-size: 19pt;
  66. }
  67. ::-moz-selection {
  68. color: white;
  69. background: black;
  70. }
  71. ::selection {
  72. color: white;
  73. background: black;
  74. }
  75. .center {
  76. clear: both;
  77. margin-left: auto;
  78. margin-right: auto;
  79. text-align: center;
  80. display: block;
  81. }
  82. .spacer {
  83. margin-bottom: 75px;
  84. margin-top: 75px;
  85. }
  86. .banner {
  87. font-size: 11vw;
  88. margin-left: 24pt;
  89. display: inline-block;
  90. vertical-align: middle;
  91. }
  92. #logo {
  93. max-width: auto;
  94. max-height: auto;
  95. margin-left: auto;
  96. margin-right: auto;
  97. }
  98. #logo img {
  99. width: 100%;
  100. height: 100%;
  101. max-height: 512px;
  102. max-width: 512px;
  103. display: block;
  104. margin-left: auto;
  105. margin-right: auto;
  106. margin-bottom: -8vw;
  107. }
  108. #title {
  109. font-size: 12vw;
  110. margin-bottom: -1vw;
  111. }
  112. .projects {
  113. width: 100%;
  114. display: inline-block;
  115. text-align: center;
  116. margin-top: 75px;
  117. margin-bottom: 75px;
  118. }
  119. .projects p {
  120. text-align: center;
  121. font-size: 40px;
  122. }
  123. .projects div {
  124. display: inline-block;
  125. max-width: 256px;
  126. margin-left: 25px;
  127. margin-right: 25px;
  128. }
  129. .projects img {
  130. width: 24vw;
  131. height: 24vw;
  132. max-height: 256px;
  133. max-width: 256px;
  134. min-width: 128px;
  135. min-height: 128px;
  136. }
  137. @font-face {
  138. font-family: "Fira Sans";
  139. font-style: normal;
  140. src: url(fonts/FiraSans-Regular.woff2) format("woff2");
  141. }
  142. @font-face {
  143. font-family: "Fira Sans";
  144. font-weight: bold;
  145. src: url(fonts/FiraSans-Bold.woff2) format("woff2");
  146. }
  147. @font-face {
  148. font-family: "Fira Sans";
  149. font-style: italic;
  150. src: url(fonts/FiraSans-Italic.woff2) format("woff2");
  151. }
  152. @font-face {
  153. font-family: "Fira Sans";
  154. font-style: italic;
  155. font-weight: bold;
  156. src: url(fonts/FiraSans-BoldItalic.woff2) format("woff2");
  157. }