.page-careers-styles{padding:0 0 40px;margin:0;font-family:proxima-nova,sans-serif;font-size:15px;line-height:1.4;color:#333;i,em {font-style: italic;} h1,h2,h3,h4,h5,h6 {font-family: sofia-pro,sans-serif; font-style: normal; font-weight: 600;} h1 {font-size: 32px; margin: 30px 0 10px 0; text-align: center;} h2 {font-size: 30px; margin-bottom: 32px; text-align: center; @media screen and (max-width: 649px) {font-size: 28px;}} h3 {font-size: 26px; margin-bottom: 15px; @media screen and (max-width: 649px) {font-size: 24px; text-align: center;}} h4 {font-size: 20px; font-weight: 400; margin-bottom: 5px; a {color: inherit; text-decoration: none; font-size: 15px; &:hover {text-decoration: underline;}}} h5 {font-size: 18px; margin-bottom: 12px;} p {margin-top: 0;} button,.button {font-size: 14px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; &.default {background-color: #eee; color: #999; &:hover,&.selected {background-color: #ccc; color: #333;}}} header {width: 100%; padding: 15px; background: black; color: white; z-index: 3; h1.header-logo {float: left; margin: 0; width: 60%; text-align: left; color: inherit; font-size: inherit; font-family: inherit; font-weight: inherit; line-height: inherit; text-transform: lowercase; -webkit-text-stroke: inherit; -webkit-font-feature-settings: inherit; font-feature-settings: inherit; > a {color: white; text-decoration: none; > img {height: 50px; vertical-align: middle;} > span {line-height: 50px; vertical-align: middle; font-size: 36px;}}} .header-apply {float: right; text-align: right; width: 40%; .button {margin: 5px 0;}} @media screen and (max-width: 649px) {text-align: center; .header-logo,.header-apply {float: none; text-align: center; width: 100%;} .header-logo {margin-bottom: 20px;}}} .splash {background-color: #3c6d78; background-position: center center; background-repeat: no-repeat; background-size: cover; position: relative; width: 100%; &:before {content: ""; display: block;} > div {background-repeat: no-repeat; background-color: transparent; background-size: cover; background-position: center center; position: absolute; top: 0; left: 0; bottom: 0; right: 0;} @media screen and (max-width: 649px) {&:before {padding-top: 37%;} &.jobs {> div {background-image: url(https://nuts.com/images/email/2024/careers_people_md.673a1d85.jpg);}}} @media screen and (min-width: 650px) {&:before {padding-top: 25%;} &.jobs {background-image: url(https://nuts.com/images/email/2024/careers_people_md.673a1d85.jpg); > div {background-image: url(https://nuts.com/images/email/2024/careers_people.2f0f957d.jpg);}}}} .container {max-width: 800px; margin: 0 auto; padding: 25px 15px;} .apply {margin-top: 40px; text-align: center;} .nutty-intro {p {font-weight: 700; font-size: 26px; font-family: sofia-pro,sans-serif;} ul {margin-left: 10px;}} .sort-title {float: left; width: 150px; @media screen and (max-width: 649px) {font-size: 15px; width: 132px;}} .sort-groups {float: left; > button {color: #cf5702; display: inline-block; margin: 0 0 15px 15px; @media screen and (max-width: 649px) {display: block; font-size: 12px; margin: 5px 0 15px 0; padding: 5px 15px;}}} .positions {.job {margin-bottom: 40px; h4 {float: left; margin-top: 0;} .learn-more {float: right; margin-bottom: 5px; text-align: right; width: 130px; > a {margin-bottom: 0;} @media screen and (max-width: 649px) {margin-bottom: -27px; margin-left: 10px;}} .description {font-size: 16px;}} ul {margin: 16px 0; padding-left: 40px;} li {list-style: disc; margin-bottom: 4px;}} .tags {> span {display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: 1px; margin-right: 30px; text-align: center; text-transform: uppercase; &:last-child {margin-right: 0;} @media screen and (max-width: 649px) {display: block; margin-right: 0;}} &.list {@media screen and (max-width: 649px) {> span {margin-right: 130px; text-align: left;}}}} p.tags {margin-bottom: 20px; text-align: center;} .logos {margin: 0 auto; padding: 0 15px; max-width: 1280px; text-align: center; > img {margin: 10px; vertical-align: middle;}} .return {.button {margin-left: 0;} @media screen and (max-width: 649px) {text-align: center;}}}