diff --git a/index.html b/index.html index 3bd3cf41..2ad604ef 100644 --- a/index.html +++ b/index.html @@ -18,6 +18,7 @@

Welcome

Collaboration and Contribution + @@ -82,8 +83,43 @@

Learning design

- + + + + + +
+

News

+
+ +

Conversational learning ipsum dolar

+

Eos qui ratione voluptatem sequi nesciunt.

+

Read more

+ +
+
+
+ +

Conversational learning ipsum dolar

+

Eos qui ratione voluptatem sequi nesciunt.

+

Read more

+ + +
+
+
+ +

Conversational learning ipsum dolar

+

Eos qui ratione voluptatem sequi nesciunt.

+

Read more

+ + +
+
+
+ + diff --git a/src/assets/gettyimages-98473330-2048x2048.png b/src/assets/gettyimages-98473330-2048x2048.png new file mode 100644 index 00000000..5a872fcb Binary files /dev/null and b/src/assets/gettyimages-98473330-2048x2048.png differ diff --git a/src/assets/logo.png b/src/assets/logo.png new file mode 100644 index 00000000..3f2422cb Binary files /dev/null and b/src/assets/logo.png differ diff --git a/src/css/style.css b/src/css/style.css index 32c41f60..fd8e9ffd 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -1,7 +1,7 @@ /*{footer styling}*/ - @import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz@9..40&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz@9..40&display=swap'); *{margin: 0;} * @@ -376,7 +376,6 @@ body{ } /* education solution design */ .education-solutions{ - position: absolute; /* background-color: white; */ width: 90%; margin: 1% 0 0 5%; @@ -824,4 +823,77 @@ body{ } /* end section 2 */ -} \ No newline at end of file +} + +/* Importing the DM Sans font */ +@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz@9..40&display=swap'); + +.news-body{ + background-color: #F9F8F4; + margin: 0; + font-family: 'DM Sans', 'sans-serif'; + +} + +/*Styling the header container*/ +.news-header{ + display: flex; + margin-left: 165px; + margin-top: 30px; + margin-bottom: 30px; +} + +/*Styling the header*/ +.news-header h3{ + font-size: 30px; + letter-spacing: 3px; +} + +/*Styling the news container*/ +.news{ + display: flex; + flex-direction:row; + justify-content: space-evenly; +} + +/*Styling the link*/ +.news a{ + text-decoration: none; + +} +/*Styling the paragraphs*/ +.news p{ + color: #404040; + font-weight: bold; +} +/*Styling the second child of the paragraph*/ +.news p:nth-child(2){ + font-weight: normal; +} + +hr{ + margin: 10px 165px 10px 165px; +} + +@media screen and (max-width: 768px) { + hr{ + margin: 10px 20px 10px 30px; + } + .news-header{ + margin-left: 30px; + } + +} + +@media screen and (max-width: 360px) { + .news{ + margin: 0 20px 0 20px; + } + hr{ + margin: 0 20px 0 20px; + } + .news-header{ + margin-left: 20px; + } +} +