.container { display: flex; justify-content: space-between; padding: 12px 17px 0; font-family: 'Helvetica Neue'; color: #808080; & h2 { font-weight: 300; font-size: 24px; } } .column { width: 50%; & ul { padding: 0; margin: 0; margin-top: 42px; list-style: none; } & li { padding-right: 42px; margin-bottom: 24px; font-size: 13px; font-family: 'Roboto'; } & label { display: flex; justify-content: space-between; align-items: center; } & button { padding: 8px 12px; text-transform: uppercase; border: 0; border-radius: 1px; background: none; color: rgb(117, 117, 117); cursor: pointer; outline: 0; transition: .2s; } & button:hover { background: rgba(0, 0, 0, .1); } } .user, .downloads { display: flex; justify-content: space-between; align-items: center; } .user img { height: 32px; width: 32px; } .downloads { & p { margin: 0; height: 20px; line-height: 20px; } & p:last-child { color: rgb(117, 117, 117); cursor: pointer; } & input { display: none; } & > div { display: flex; flex-direction: column; } } .plugin { display: flex; justify-content: space-between; & img { display: block; height: 40px; width: 40px; margin-top: 12px; margin-right: 14px; } /* stylelint-disable */ & :global(.Switch) { margin-top: 12px; } /* stylelint-enable */ & :any-link { color: #4990e2; } } .version { display: inline-block; margin-left: 24px; font-size: 12px; color: #9e9e9e; } .description { font: 12px; color: #9b9b9b; line-height: 20px; } @media (width <= 800px) { .container { padding: 8px 17px 0; & h2 { font-size: 20px; } } .column { & ul { margin-top: 32px; } & li { padding-right: 32px; margin-bottom: 18px; font-size: 12px; } } }