diff --git a/blogs.css b/blogs.css index 884f96b8..2c268e64 100644 --- a/blogs.css +++ b/blogs.css @@ -20,94 +20,82 @@ box-sizing: border-box; } */ -*{ +/* Add your custom styles below */ + +* { margin: 0; padding: 0; box-sizing: border-box; - } + .grid-container { display: grid; padding: 2.5rem; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap: 1rem; - /* place-content: center; */ - /* align-items: center; - justify-content: center; */ } -.card-img-top{ + +.card { + height: auto; + padding: 2%; + margin: 3%; + border: none; + background-color: #9D5C0D; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.card-img-top { width: 100%; height: 100%; object-fit: fill; } -.card-body > h5{ - font-weight: bold; - color: rgb(8, 8, 8); - -} -.card{ - height: 510px; - padding:2%; - margin:3%; - border:none; - background-color: #9D5C0D ; -} -@media screen and (max-width: 476px){ - .card{ - max-width: 75vw; - } -} -@media screen and (max-width: 380px){ - .card{ - max-width: 70vw; - } -} -.card-body{ - align-items: center; - -} -.card:hover{ - box-shadow: 0 12px 20px rgba(0, 0, 0, 0.24),0 17px 50px 0 rgba(0, 0, 0, 0.19); + +.card-body > h5 { + font-weight: bold; + color: rgb(8, 8, 8); } -.card-img-top:hover { - box-shadow: 0 0.25em 0.25em -0.1em #604717; - box-shadow: 0 0.30em 0.30em -0.1em #f7c603; - border-color: #e0ef08 ; - transition: 0.4s; - color: #d8eb08 ; + +.card-body { + align-items: center; } + .card:hover { - scale: 1.09; - border-color: #FFB84C; - transition: 0.4s; - color: #fff ; - text-decoration:wavy; - + box-shadow: 0 12px 20px rgba(0, 0, 0, 0.24), 0 17px 50px 0 rgba(0, 0, 0, 0.19); + transform: scale(1.09); + border-color: #FFB84C; + transition: 0.4s; + color: #fff; + text-decoration: wavy; } + .card h5:hover { - color: black ; -} -.card a{ - background-color: #B70404 ; - color:white; - padding:2%; - border:1px black; - cursor: pointer; - text-decoration: none; - -} -.card a:hover{ - background-color:inherit ; + color: black; +} + +.card a { + background-color: #B70404; + color: white; + padding: 2%; + border: 1px solid black; + cursor: pointer; + text-decoration: none; +} + +.card a:hover { + background-color: inherit; color: #FFA931; - border:3px solid; + border: 3px solid; } .footer-wrapper { text-align: center; padding: 1rem; - /* background-color: #995734 ; */ + background-color: #995734; color: white; } + #topBtn { position: fixed; bottom: 20px; diff --git a/index.html b/index.html index 220f1ac4..ffc9d587 100644 --- a/index.html +++ b/index.html @@ -640,132 +640,129 @@

help others



-

Latest Blogs

-

Regular records of your thoughts, opinions or experiences that you put on the
internet - for other people to - read

+

Latest Blogs

+

Regular records of your thoughts, opinions, or experiences that you put on the internet + for other people to read

- - -
-
-
-
-

Machine-Learning

-

Posted by Rudramadhaba Mishra

-

October 23, 2021

-
-
-

Machine Learning is the field of study that gives computers the capability to learn without being explicitly - programmed. ML is one of the most exciting technologies that one would ever come across.

-
- Read more -
-
-
-
-

Web development

-

Posted by Palak Bhogra

-

October 30, 2021

-
-
-

Web development refers to building, creating, and maintaining websites. The web development process includes - web design, web content development, client-side/server-side scripting and network security configuration, - among other tasks. -

-
- Read more +
+ +
+
+
+
+

Machine Learning

+

Posted by Rudramadhaba Mishra

+

October 23, 2021

+
+
+

Machine Learning is the field of study that gives computers the capability to learn without being + explicitly programmed. ML is one of the most exciting technologies that one would ever come across.

+
+ Read more
-
-
-
-

HTML

-

Posted by Himansu Hansda

-

November 1, 2021

-
-
-

Hyper Text Markup Language is used for creating web pages and web applications. -

-
- Read more + +
+
+
+

Web Development

+

Posted by Palak Bhogra

+

October 30, 2021

+
+
+

Web development refers to building, creating, and maintaining websites. The web development process + includes web design, web content development, client-side/server-side scripting, and network security + configuration, among other tasks.

+
+ Read more
-
-
-
-

Python

-

Posted by Mantosh

-

October 29, 2021

-
-
-

Python is an easy to learn, powerful programming language. It has efficient high-level data structures and a - simple but effective approach to object-oriented programming. -

-
- Read more + +
+
+
+

HTML

+

Posted by Himansu Hansda

+

November 1, 2021

+
+
+

Hyper Text Markup Language is used for creating web pages and web applications.

+
+ Read more
-
+
+
+
+

Python

+

Posted by Mantosh

+

October 29, 2021

+
+
+

Python is an easy-to-learn, powerful programming language. It has efficient high-level data structures and + a simple but effective approach to object-oriented programming.

+
+ Read more +
+