diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..6f3a291 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5501 +} \ No newline at end of file diff --git a/img/Nelson_Mandela_house.jpg b/img/Nelson_Mandela_house.jpg new file mode 100644 index 0000000..32b7760 Binary files /dev/null and b/img/Nelson_Mandela_house.jpg differ diff --git a/img/Nelson_Mandela_monument.jpg b/img/Nelson_Mandela_monument.jpg new file mode 100644 index 0000000..cfb62d6 Binary files /dev/null and b/img/Nelson_Mandela_monument.jpg differ diff --git a/img/Nelson_Mandela_trophies_n_awards.jpg b/img/Nelson_Mandela_trophies_n_awards.jpg new file mode 100644 index 0000000..0a09d62 Binary files /dev/null and b/img/Nelson_Mandela_trophies_n_awards.jpg differ diff --git a/index.html b/index.html index 504dc31..a795804 100644 --- a/index.html +++ b/index.html @@ -1,13 +1,58 @@ - - - - - - - - - - + + + + + + NELSON R. MANDELA + + + +
+ +

NELSON R. MANDELA

+
+ Nelson Mandela Monument +
+

+ Nelson Rolihlahla Mandela Xhosa (born Rolihlahla Mandela; 18 July 1918 - 5 December 2013) was a South African anti-apartheid activist and politician who served as the first president of South Africa from 1994 to 1999. He was the country's first black head of state and the first elected in a fully representative democratic election. His government focused on dismantling the legacy of apartheid by fostering racial reconciliation. Ideologically an African nationalist and socialist, he served as the president of the African National Congress (ANC) party from 1991 to 1997. See achievements here +

+
+

+ Mandela died on 5 December 2013, a celebrated elder statesman who continued to voice his opinion on topical issues. In South Africa he is often known as Madiba, an aristocratic title adopted by the elderly members of the royal clan that he belongs to. This title has come to be synonymous with Nelson Mandela. +

+ +
+

+

+
+ +
+
+
+ +
+ Nelson Mandela Trophies and Awards +
+

List of Awards and Honours

+

This is a comprehensive list of awards, honours and other recognitions bestowed on Nelson Mandela.
+ Mandela received more than 260 awards over 40 years, most notably the Nobel Peace Prize in 1993. +

+ + +
    +
  • Received Philadelphia Liberty Medal. Presented by President of the United States Bill Clinton, Philadelphia, US, 4 July 1993
    • +
  • Awarded Nobel Peace Prize Oslo, Norway, 10 December 1993
    • +
  • Named Person of the Year, 1993 by Time magazine, together with F. W. de Klerk, Yasser Arafat and Yitzhak Rabin.
    • +
  • Appointed an honorary member of the Order of Merit by Queen Elizabeth II, 1995
    • +
  • Listed as one of the 100 most influential people of 2005 by Time magazine, 2005
    • +
+ + +
+
+ +
+ \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..3b92e8a --- /dev/null +++ b/style.css @@ -0,0 +1,104 @@ +html +{ + padding: 0 1em; + scroll-behavior: smooth; +} + +body{ + max-width: 1440px !important; + padding-left: 10%; + padding-right: 10%; + background: rgb(100, 100, 98); +} + +.content{ + box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; + padding: 40px; +} + +a { + color:rgb(165, 165, 105); +} + +button { + height: 40px; + border: 0; + background: rgb(46, 46, 45); + font-weight: bold; + text-transform: uppercase; + border-radius: 0; + color: white; + font-size: 12px; + padding: 20px; + box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; +} + +button:hover { + background: rgb(231, 171, 171); +} + +img +{ + max-width: 360px; + height: auto; +} + +h1 { + color: rgb(0, 0, 0); + font-size:52px; + text-underline-offset: 0; +} +h2 { + color: rgb(0,0,0); +} +p { + font-size: 20px; + line-height: 25px; +} + +.image-left, .image-right +{ + margin: 1em 0; +} + +@media (min-width: 20em) +{ + .image-left, .image-right + { + display: flex; + align-items: center; + } + + .image-left img + { + + margin-right: 1em; + float: left; + fallback + } + + .image-right img + { + order: 1; + margin-left:0 0 1em; + float: right; fallback + } + + .image-left::after, + .image-right::after + { + content: ""; + display: block; + clear: both; + } +} + +@media (min-width: 30em) +{ + .image-left img, .image-right img + { + flex-shrink: 0; + } +} + +