Advertisement
makispaiktis

Codecademy - 14th Course (CSS Example)

Oct 9th, 2019 (edited)
250
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 1.67 KB | None | 0 0
  1. body {
  2.   background-color: #FFF;
  3.   margin: 0 auto;
  4. }
  5.  
  6. header {
  7.   background-color: #466995;
  8.   border-bottom: 1px solid #466995;
  9.   position: fixed;
  10.   width: 100%;
  11.   z-index: 10;
  12. }
  13.  
  14. ul {
  15.   margin: 30px auto;
  16.   padding: 0 20px;
  17.   text-align: center;
  18. }
  19.  
  20. li {
  21.   color: #FFF;
  22.   font-family: 'Oswald', sans-serif;
  23.   font-size: 16px;
  24.   font-weight: 300;
  25.   text-transform: uppercase;
  26.   display: inline-block;
  27.   width: 80px;
  28. }
  29.  
  30. li:hover {
  31.   color: #DBE9EE;
  32. }
  33.  
  34. h1 {
  35.   color: #466995;
  36.   font-family: 'Oswald', sans-serif;
  37.   font-size: 32px;
  38.   font-weight: 300;
  39.   text-transform: uppercase;
  40. }
  41.  
  42. h2 {
  43.   color: #333;
  44.   font-family: 'Varela Round', sans-serif;
  45.   font-size: 26px;
  46.   font-weight: 100;
  47.   margin: 0 auto 20px auto;
  48. }
  49.  
  50. h3 {
  51.   color: #466995;
  52.   font-family: 'Oswald', sans-serif;
  53.   font-size: 18px;
  54.   text-align: center;
  55.   font-weight: 700;
  56.   text-transform: uppercase;
  57.   padding: 30px;
  58. }
  59.  
  60. h4 {
  61.   color: #466995;
  62.   font-family: 'Oswald', sans-serif;
  63.   font-size: 18px;
  64.   font-weight: 300;
  65.   letter-spacing: 2px;
  66.   text-align: center;
  67.   text-transform: uppercase
  68. }
  69.  
  70. p {
  71.   color: #333;
  72.   font-family: 'Varela Round', sans-serif;
  73.   font-size: 18px;
  74. }
  75.  
  76. footer {
  77.   background-color: #DBE9EE;
  78.   text-align: center;
  79.   height: 100px;
  80.   margin: 30px;
  81. }
  82.  
  83. .welcome {
  84.   background-color: #DBE9EE;
  85.   box-sizing: border-box;
  86.   padding: 40px;
  87.   text-align: center;
  88.   width: 100%;
  89.   position: relative;
  90.   top: 50px;
  91. }
  92.  
  93. .question {
  94.   text-align: center;
  95.   position: relative;
  96.   top: 40px;
  97. }
  98.  
  99. .answer {
  100.   border: 1px solid #466995;
  101.   margin: 20px;
  102.   display: inline-block;
  103. }
  104.  
  105. .answer:hover {
  106.   background: #C0D6DF;
  107.   color: #FFF;
  108. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement