Advertisement
makispaiktis

Codecademy - 12th Exercise (Davie's Burgers Prototype)

Oct 9th, 2019 (edited)
385
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 1.68 KB | None | 0 0
  1. /* Universal Styles */
  2.  
  3. body {
  4.   background-image: url("https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-6/htmlcss1-img_foodlogo.png");
  5.   text-align: center;
  6.   font-family: 'Roboto', sans-serif;
  7.   font-size: 18px;
  8. }
  9.  
  10. a {
  11.   text-decoration: none;
  12. }
  13.  
  14. /* Navigation */
  15.  
  16. nav {
  17.   text-align: center;
  18. }
  19.  
  20. nav img {
  21.   display: block;
  22. }
  23.  
  24. nav span {
  25.   display: block;
  26.   font-size: 16px;
  27.   font-weight: 100;
  28.   letter-spacing: 2px;
  29. }
  30.  
  31. nav a {
  32.   color: #666666;
  33. }
  34.  
  35. /* Content Container */
  36.  
  37. .content {
  38.   width: 100%;
  39. }
  40.  
  41. /* Content Header */
  42.  
  43. .header {
  44.   background-image: url("https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-6/htmlcss1-img_burgerphoto.jpeg");
  45.   background-position: center;
  46.   background-size: cover;
  47. }
  48.  
  49. .header h1 {
  50.   background-color: #05A8AA;
  51.   color: #FFF;
  52.   font-family: 'Oswald', sans-serif;
  53.   font-size: 40px;
  54.   font-weight: 300;
  55.   line-height: 40px;
  56.   width: 68%;
  57. }
  58.  
  59. /* Content Body */
  60.  
  61. .content .body {
  62.   width: 90%;
  63. }
  64.  
  65. .body p {
  66.   color: #333333;
  67.   font-weight: 100;
  68.   line-height: 34px;
  69.   width: 90%;
  70.   margin-top: 18px;
  71. }
  72.  
  73. /* Content Button */
  74.  
  75. .button {
  76.   border-radius: 4px;
  77.   color: #05A8AA;
  78.   display: block;
  79.   font-weight: 700;
  80. }
  81.  
  82. .button:hover {
  83.   background-color: #05A8AA;
  84.   border: 1px solid #05A8AA;
  85.   color: #FFF;
  86. }
  87.  
  88. /* Content Nutrition */
  89.  
  90. ul.nutrition {
  91. }
  92.  
  93. ul.nutrition li {
  94.   display: inline-block;
  95.   background-color: #05A8AA;
  96.   list-style: none;
  97. }
  98.  
  99. .nutrition .category {
  100.   color: white;
  101.   font-weight: 100;
  102.   letter-spacing: 2px;
  103.   display: block;
  104. }
  105.  
  106. .nutrition .value {
  107.   color: white;
  108.   font-size: 26px;
  109.   font-weight: 700;
  110.   letter-spacing: 2px;
  111. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement