github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/website/components/features-list/style.css (about) 1 .g-features-list { 2 padding-top: 64px; 3 padding-bottom: 24px; 4 & h2 { 5 text-align: center; 6 margin-top: 0; 7 margin-bottom: 32px; 8 } 9 10 & .intro-container { 11 text-align: center; 12 max-width: 600px; 13 margin: 0 auto; 14 margin-bottom: 64px; 15 16 & a { 17 color: var(--nomad); 18 } 19 } 20 21 & .items-container { 22 display: flex; 23 flex-wrap: wrap; 24 25 & .item { 26 border: 1px solid var(--gray-6); 27 flex-basis: calc(50% - 16px); 28 margin-bottom: 32px; 29 padding: 40px; 30 display: flex; 31 32 @media (max-width: 468px) { 33 flex-direction: column; 34 } 35 36 & h4 { 37 margin: 0; 38 margin-bottom: 8px; 39 } 40 41 & p { 42 margin: 0; 43 } 44 45 & a { 46 color: var(--nomad); 47 } 48 49 & .item-icon img { 50 width: 72px; 51 height: 72px; 52 margin-right: 32px; 53 54 @media (max-width: 468px) { 55 margin-bottom: 18px; 56 } 57 } 58 59 &:nth-child(odd) { 60 margin-right: 16px; 61 } 62 63 &:nth-child(even) { 64 margin-left: 16px; 65 } 66 67 @media (max-width: 1200px) { 68 padding: 32px; 69 & .item-icon img { 70 display: flex; 71 width: 50px; 72 height: 50px; 73 margin-right: 24px; 74 } 75 } 76 77 @media (max-width: 991px) { 78 flex-basis: 100%; 79 padding: 32px; 80 margin-bottom: 36px; 81 82 & .item-icon img { 83 display: flex; 84 width: 72px; 85 height: 72px; 86 margin-right: 24px; 87 } 88 89 &:nth-child(odd) { 90 margin-right: 0; 91 } 92 93 &:nth-child(even) { 94 margin-left: 0; 95 } 96 } 97 } 98 } 99 }