/* NEW FOOTER */ * { box-sizing: border-box; font-family: sans-serif; font-weight: 600; } a { text-decoration: none; } .subfooter p { color: white; margin: 0; } .subfooter p.text { font-weight: 400; } .footerMainWrapper { max-width: 1440px; margin: 0 auto; } .footerContainer { width: 100%; background-color: #052E2E; margin: 0 auto; } .links a { width: 100%; display: block; color: white; padding: 10px 0; } .cta { height: fit-content; color: #052E2E; border-radius: 40px; padding: 20px 32px; font-weight: 600; text-align: center; } @media (max-width: 992px) { .wrapper { display: flex; flex-direction: column-reverse; flex-wrap: wrap; background-color: #052E2E; } .footer { padding: 20px 40px; } .subfooter { padding: 32px 40px; } .linksBlock { flex: 0 1 100%; display: flex; flex-direction: row; flex-wrap: wrap; } .ctaBlock { flex: 0 1 100%; display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 60px; } .links { flex: 0 1 100%; max-width: 100%; flex-direction: row; flex-wrap: wrap; justify-content: space-around; } p { font-size: 14px; line-height: 18.2px; } .subfooter p:last-of-type { margin-bottom: 60px; } .subfooter p:last-of-type svg { margin-right: 29.5px; } } @media (min-width: 992px) { .wrapper { display: flex; flex-direction: row; flex-wrap: wrap; background-color: #052E2E; } .footer { padding: 60px 72px;} .subfooter { padding: 40px 72px;} .linksBlock { flex: 0 1 75%; display: flex; flex-direction: row; flex-wrap: wrap; } .ctaBlock { flex: 0 1 25%; display: flex; flex-direction: row; flex-wrap: wrap; } .links { flex: 0 1 calc(33% - 40px); max-width: calc(33% - 40px); flex-direction: row; flex-wrap: wrap; justify-content: space-around; } .subfooter p { flex: 0 1 50%; } .subfooter p:last-of-type { text-align: right; padding-right: 6.25em; } .subfooter p:last-of-type a { color: white; margin-left: 29.5px; } p { font-size: 18px; line-height: 23.4px; } } @media (min-width: 992px) and (max-width: 1400px) { .subfooter p:last-of-type { padding-right: 5%; } } a:not(.cta) { opacity: 1; } a:not(.cta):hover { opacity: 0.6; transition: opacity 250ms cubic-bezier(.65,0,.35,1); } a.cta { background-color: #fcfacc; transition: all .5s cubic-bezier(.65,0,.35,1); } a.cta:hover { background-color: #fdfcdb;} /* END NEW FOOTER */

Co-creation

Archives for February 2023

3

Up Down

Ideen

Fubu 18 views 1 comment 3 points Most recent by Fubu February 26Co-creation

/* NEW FOOTER */ * { box-sizing: border-box; font-family: sans-serif; font-weight: 600; } a { text-decoration: none; } .subfooter p { color: white; margin: 0; } .subfooter p.text { font-weight: 400; } .footerMainWrapper { max-width: 1440px; margin: 0 auto; } .footerContainer { width: 100%; background-color: #052E2E; margin: 0 auto; } .links a { width: 100%; display: block; color: white; padding: 10px 0; } .cta { height: fit-content; color: #052E2E; border-radius: 40px; padding: 20px 32px; font-weight: 600; text-align: center; } @media (max-width: 992px) { .wrapper { display: flex; flex-direction: column-reverse; flex-wrap: wrap; background-color: #052E2E; } .footer { padding: 20px 40px; } .subfooter { padding: 32px 40px; } .linksBlock { flex: 0 1 100%; display: flex; flex-direction: row; flex-wrap: wrap; } .ctaBlock { flex: 0 1 100%; display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 60px; } .links { flex: 0 1 100%; max-width: 100%; flex-direction: row; flex-wrap: wrap; justify-content: space-around; } p { font-size: 14px; line-height: 18.2px; } .subfooter p:last-of-type { margin-bottom: 60px; } .subfooter p:last-of-type svg { margin-right: 29.5px; } } @media (min-width: 992px) { .wrapper { display: flex; flex-direction: row; flex-wrap: wrap; background-color: #052E2E; } .footer { padding: 60px 72px;} .subfooter { padding: 40px 72px;} .linksBlock { flex: 0 1 75%; display: flex; flex-direction: row; flex-wrap: wrap; } .ctaBlock { flex: 0 1 25%; display: flex; flex-direction: row; flex-wrap: wrap; } .links { flex: 0 1 calc(33% - 40px); max-width: calc(33% - 40px); flex-direction: row; flex-wrap: wrap; justify-content: space-around; } .subfooter p { flex: 0 1 50%; } .subfooter p:last-of-type { text-align: right; padding-right: 6.25em; } .subfooter p:last-of-type a { color: white; margin-left: 29.5px; } p { font-size: 18px; line-height: 23.4px; } } @media (min-width: 992px) and (max-width: 1400px) { .subfooter p:last-of-type { padding-right: 5%; } } a:not(.cta) { opacity: 1; } a:not(.cta):hover { opacity: 0.6; transition: opacity 250ms cubic-bezier(.65,0,.35,1); } a.cta { background-color: #fcfacc; transition: all .5s cubic-bezier(.65,0,.35,1); } a.cta:hover { background-color: #fdfcdb;} /* END NEW FOOTER */

Co-creation

Discussion List