diff --git a/_sass/_default.scss b/_sass/_default.scss index 1a071860fa8da392c63cdb6a84b1a97a800f42b5..03eda3fa2fbd6a65555599920dede5dcf3162353 100644 --- a/_sass/_default.scss +++ b/_sass/_default.scss @@ -100,22 +100,24 @@ img { display: block; max-width: 100%; } -.flex-cards { +.flex-wrapper { display: flex; justify-content: center; background-color: #333333; - } -.flex-container > div { +.flex-cards { width: 100%; - margin: 10px; + display: flex; + flex-wrap: wrap; + background-color: #333; + justify-content: center; } .card { box-shadow: 0 4px 8px 0 rgba(0,0,0,0.3); margin: 5px; transition: 0.3s; border-radius: 5px; - width: 30%; + width: 28.3%; background: #4f4f4fff; padding: 15px; font-size: 15px; @@ -435,4 +437,17 @@ strong { .post-title__subtitle { font-size: 18px; } + .card { + width: 40%; + } +} +@media (max-width: 620px) { + .card { + width: 80%; + } +} +@media (max-width: 400px) { + .card { + width: 100%; + } } diff --git a/index.html b/index.html index a2c8d38fd4c58fdd5a7dc05b1f2db7eeb2de2aef..ef457bb5b7d94d7524264ebb59d3ee86d79dff49 100644 --- a/index.html +++ b/index.html @@ -9,47 +9,34 @@ priority: 0.9
I host a variety of services that are available for anyone to use free of charge. Below is a list with descriptions of each.