@charset "UTF-8";
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
@font-face {
font-family: "CervinoExtraBoldNeue";
src: url("./assets/fonts/CervinoExtraBoldNeue/font.woff2") format("woff2"), url("./assets/fonts/CervinoExtraBoldNeue/font.woff") format("woff");
}
@font-face {
font-family: "Proxima Sera";
src: url("./assets/fonts/ProximaSera/ProximaSera-Regular.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Proxima Sera";
src: url("./assets/fonts/ProximaSera/ProximaSera-RegularItalic.woff2") format("woff2");
font-weight: 400;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: "Proxima Sera";
src: url("./assets/fonts/ProximaSera/ProximaSera-Bold.woff2") format("woff2");
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Proxima Sera";
src: url("./assets/fonts/ProximaSera/ProximaSera-BoldItalic.woff2") format("woff2");
font-weight: 700;
font-style: italic;
font-display: swap;
}
h1, h2, h3, h4, h5, h6 {
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
text-transform: uppercase;
text-wrap: balance;
}
h1.has-x-large-font-size, h2.has-x-large-font-size, h3.has-x-large-font-size, h4.has-x-large-font-size, h5.has-x-large-font-size, h6.has-x-large-font-size {
font-size: 4.5rem;
font-size: clamp(4.5rem, 2.5rem + 3vw, 6rem) !important;
}
h1.has-large-font-size, h2.has-large-font-size, h3.has-large-font-size, h4.has-large-font-size, h5.has-large-font-size, h6.has-large-font-size {
font-size: 3rem;
font-size: clamp(1.75rem, 1.5rem + 2vw, 3rem) !important;
}
h1.has-medium-font-size, h1.has-regular-font-size, h2.has-medium-font-size, h2.has-regular-font-size, h3.has-medium-font-size, h3.has-regular-font-size, h4.has-medium-font-size, h4.has-regular-font-size, h5.has-medium-font-size, h5.has-regular-font-size, h6.has-medium-font-size, h6.has-regular-font-size {
font-size: 2.125rem;
font-size: clamp(1.5rem, 1.25rem + 1vw, 2.125rem) !important;
}
h1.has-small-font-size, h2.has-small-font-size, h3.has-small-font-size, h4.has-small-font-size, h5.has-small-font-size, h6.has-small-font-size {
font-size: 1.625rem;
font-size: clamp(1rem, 1rem + 1vw, 1.625rem) !important;
}
h1.has-body-font-family, h2.has-body-font-family, h3.has-body-font-family, h4.has-body-font-family, h5.has-body-font-family, h6.has-body-font-family {
text-transform: none;
font-weight: 700;
}
h1.has-body-font-family.has-medium-font-size, h2.has-body-font-family.has-medium-font-size, h3.has-body-font-family.has-medium-font-size, h4.has-body-font-family.has-medium-font-size, h5.has-body-font-family.has-medium-font-size, h6.has-body-font-family.has-medium-font-size {
font-size: clamp(1rem, 1rem + 1vw, 1.5rem) !important;
}
h1.has-body-font-family.has-small-font-size, h2.has-body-font-family.has-small-font-size, h3.has-body-font-family.has-small-font-size, h4.has-body-font-family.has-small-font-size, h5.has-body-font-family.has-small-font-size, h6.has-body-font-family.has-small-font-size {
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem) !important;
}
h1,
.h1 {
font-size: 4.5rem;
font-size: clamp(4.5rem, 2.5rem + 3vw, 6rem);
}
h2,
.h2 {
font-size: 3rem;
font-size: clamp(1.75rem, 1.5rem + 2vw, 3rem);
}
h3,
.h3 {
font-size: 2.125rem;
font-size: clamp(1.5rem, 1.25rem + 1vw, 2.125rem);
}
h4,
.h4 {
font-size: 1.625rem;
font-size: clamp(1rem, 1rem + 1vw, 1.625rem);
}
.has-x-large-font-size {
font-size: 2.25rem;
font-size: clamp(1.375rem, 1.375rem + 1vw, 2.25rem) !important;
}
.has-large-font-size {
font-size: 1.5rem;
font-size: clamp(1rem, 1rem + 1vw, 1.5rem) !important;
}
.has-medium-font-size,
.has-regular-font-size {
font-size: 1.125rem;
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem) !important;
}
.has-small-font-size {
font-size: 0.875rem;
font-size: clamp(0.75rem, 0.75rem + 1vw, 0.875rem) !important;
}
p:not(:last-child) {
margin-bottom: 1.5em;
}
p strong {
font-weight: 700;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
html, body {
background-color: #ffffff;
color: #0f3033;
font-family: "Proxima Sera", "Proxima Nova", Times, serif;
font-size: 16px;
line-height: 1.5;
margin: 0;
padding: 0;
text-wrap: pretty;
}
html > *, body > * {
box-sizing: border-box;
}
:root :where(.is-layout-constrained) > * {
margin-block-start: 0;
}
:root :where(.wp-site-blocks :focus) {
outline-width: 2px;
outline-style: solid;
outline-color: #00a0cc;
outline-offset: 2px;
}
:where(.has-black-background-color, .has-howling-ink-background-color) {
color: #fff3cc;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
.wp-block-buttons {
margin-bottom: 1.5rem;
}
.wp-block-button__link {
border-radius: 0;
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
padding: 16px 24px;
position: relative;
text-box-edge: cap;
text-decoration: none;
text-transform: uppercase;
transition: all 0.3s ease;
}
.wp-block-button__link.has-howling-ink-background-color {
color: #ffffff;
}
.wp-block-button__link:hover {
transform: rotate(-6deg);
}
.wp-block-button.is-style-text .wp-block-button__link, .wp-block-button.is-style-icon .wp-block-button__link {
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
line-height: 1;
padding: 0;
text-box-edge: cap;
text-decoration: none;
text-decoration-color: #ff94da;
text-transform: uppercase;
transition: all 0.3s ease;
}
.wp-block-button.is-style-text .wp-block-button__link.has-punk-pink-color, .wp-block-button.is-style-icon .wp-block-button__link.has-punk-pink-color {
color: #fff3cc;
}
.wp-block-button.is-style-text .wp-block-button__link:hover, .wp-block-button.is-style-icon .wp-block-button__link:hover {
text-decoration-skip-ink: none;
text-decoration-line: underline;
text-decoration-thickness: 0.6rem !important;
text-underline-offset: -0.4rem;
transform: none;
}
.wp-block-button.is-style-icon.has-icon-pdf .wp-block-button__link::after, .wp-block-button.is-style-icon.has-icon-external-link .wp-block-button__link::after {
content: "";
display: inline-block;
width: 1em;
height: 1em;
margin-left: 0.4em;
vertical-align: -0.15em;
background-color: currentColor;
mask-repeat: no-repeat;
mask-position: center;
mask-size: contain;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
-webkit-mask-size: contain;
}
.wp-block-button.is-style-icon.has-icon-pdf .wp-block-button__link::after {
mask-image: url('data:image/svg+xml,');
-webkit-mask-image: url('data:image/svg+xml,');
}
.wp-block-button.is-style-icon.has-icon-external-link .wp-block-button__link::after {
mask-image: url('data:image/svg+xml,');
-webkit-mask-image: url('data:image/svg+xml,');
}
main button[type=submit],
main input[type=submit] {
background-color: #0f3033;
border: none;
color: #fff3cc;
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
font-size: initial;
padding: 16px 24px !important;
text-transform: uppercase;
transition: all 0.3s ease;
}
main button[type=submit]:hover,
main input[type=submit]:hover {
transform: rotate(-6deg);
}
.wp-block-columns .wp-block-image + p {
margin: 0;
padding: 25px;
}
.wp-block-columns:not(:last-child) {
margin-bottom: 2rem;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
details.wp-block-details {
interpolate-size: allow-keywords;
background-image: url("images/cream-white-star.png");
background-position: center;
background-repeat: no-repeat;
background-size: cover;
padding: 26px;
margin-bottom: 2rem;
}
@media (min-width: 768px) {
details.wp-block-details {
padding: 48px;
}
}
details.wp-block-details summary {
display: flex;
justify-content: space-between;
align-items: center;
font-size: clamp(1rem, 1rem + 1vw, 1.5rem);
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
text-transform: uppercase;
}
details.wp-block-details summary span {
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem);
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
text-transform: uppercase;
}
details.wp-block-details[open] {
padding-bottom: 2rem;
}
details.wp-block-details[open] summary {
margin-bottom: 2rem;
}
details.wp-block-details::details-content {
overflow: hidden;
block-size: 0;
opacity: 0;
}
details.wp-block-details[open]::details-content {
block-size: auto;
opacity: 1;
}
@media (prefers-reduced-motion: no-preference) {
details.wp-block-details {
transition: padding-bottom 0.3s ease-out;
}
details.wp-block-details summary {
transition: margin-bottom 0.3s ease-out;
}
details.wp-block-details::details-content {
transition: content-visibility 0.3s allow-discrete, block-size 0.3s ease-out, opacity 0.3s ease-out;
}
}
details.wp-block-details h2, details.wp-block-details h3, details.wp-block-details h4 {
font-family: "Proxima Sera", "Proxima Nova", Times, serif;
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem) !important;
text-transform: capitalize;
font-weight: bold;
}
details.wp-block-details p {
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem) !important;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
footer.wp-block-template-part {
margin-block-start: 0;
margin-block-end: 0;
}
footer.wp-block-template-part #pre-footer p {
max-width: 550px;
margin: 1rem auto;
}
footer.wp-block-template-part #pre-footer .wp-block-columns {
background: linear-gradient(180deg, #0f3033 0, #0f3033 50%, #ffffff 50%, #ffffff 100%);
gap: 0;
justify-content: center;
}
@media (max-width: 1160px) {
footer.wp-block-template-part #pre-footer .wp-block-columns {
background: linear-gradient(180deg, #0f3033 0, #0f3033 85%, #ffffff 85%, #ffffff 100%);
flex-direction: column;
align-items: center !important;
}
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column {
max-width: 500px;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column .wp-block-group {
aspect-ratio: 1/1;
background-repeat: no-repeat;
background-size: 125% !important;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column .wp-block-group > * {
position: relative;
transition: all 0.3s ease;
transition-delay: 0.1s;
}
@media (min-width: 1160px) {
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column .wp-block-group h3 {
padding-top: 100px;
}
}
@media (max-width: 1160px) {
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column .wp-block-group {
flex-basis: 100% !important;
}
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:nth-child(odd):hover > * {
transform: rotate(-7deg);
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:nth-child(even):hover > * {
transform: rotate(7deg);
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:first-child .wp-block-group {
background-position: 175% 110% !important;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:first-child .wp-block-group:hover {
background-position: 155% 130% !important;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:nth-child(2) .wp-block-group {
background-position: 50% 160% !important;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:nth-child(2) .wp-block-group:hover {
background-position: 70% 180% !important;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:nth-child(3) .wp-block-group {
background-position: 35% -8% !important;
background-size: 180% !important;
}
footer.wp-block-template-part #pre-footer .wp-block-columns .wp-block-column:nth-child(3) .wp-block-group:hover {
background-position: 35% 10% !important;
}
footer.wp-block-template-part #main-footer .wp-block-button.is-style-text {
margin-bottom: 2rem;
}
footer.wp-block-template-part #main-footer .wp-block-group.is-layout-grid + .wp-block-group.is-layout-grid {
margin-top: 3rem;
}
footer.wp-block-template-part #main-footer h2 {
font-family: "Proxima Sera", "Proxima Nova", Times, serif;
text-transform: capitalize;
font-size: clamp(1rem, 1rem + 1vw, 1.5rem) !important;
font-weight: 400;
}
@media (max-width: 600px) {
footer.wp-block-template-part #main-footer .wp-block-group.is-layout-grid {
grid-template-columns: 1fr;
}
}
.wp-block-group.has-salty-background {
background-size: 20%;
background-position: center;
background-repeat: repeat;
}
.wp-block-group.salty-bg-salty-blue {
background-image: url("images/salty-patterns/salty-blue.png");
}
.wp-block-group.salty-bg-salty-cream {
background-image: url("images/salty-patterns/salty-cream.png");
}
.wp-block-group.salty-bg-salty-green {
background-image: url("images/salty-patterns/salty-green.png");
}
.wp-block-group.salty-bg-salty-ink {
background-image: url("images/salty-patterns/salty-ink.png");
color: #ffffff;
}
.wp-block-group.salty-bg-salty-orange {
background-image: url("images/salty-patterns/salty-orange.png");
}
.wp-block-group.salty-bg-salty-pink {
background-image: url("images/salty-patterns/salty-pink.png");
}
.wp-block-group.salty-bg-salty-yellow {
background-image: url("images/salty-patterns/salty-yellow.png");
}
@media (min-width: 768px) {
.wp-block-group.is-layout-grid {
gap: 48px;
}
}
@media (max-width: 767px) {
.wp-block-group.is-layout-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
.wp-block-group.is-layout-grid figure {
aspect-ratio: 2/1;
background: transparent;
}
.wp-block-group.is-layout-grid figure img {
object-fit: contain;
width: 100%;
height: 100% !important;
}
.wp-block-group.is-layout-grid + .wp-block-buttons {
margin-top: 48px;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
.hero-banner {
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin: 0;
}
.hero-banner__media, .hero-banner__content {
min-width: 20rem;
display: flex;
align-items: center;
overflow: visible;
position: relative;
width: 100%;
}
@media (min-width: 768px) {
.hero-banner__media, .hero-banner__content {
flex: 0 1 50%;
}
.hero-banner__media img, .hero-banner__content img {
position: absolute;
}
}
.hero-banner__content-inner {
box-sizing: border-box;
width: 100%;
max-width: 620px;
margin-left: auto;
margin-right: auto;
padding: 150px 40px 150px 50px;
position: relative;
transform: rotate(-7deg);
z-index: 1;
}
@media (min-width: 768px) {
.hero-banner__content-inner {
margin-right: 0;
}
}
.hero-banner__image {
display: block;
height: 100%;
object-fit: cover;
width: 100%;
}
.hero-banner__heading {
margin: 0 0 0.5rem;
}
.hero-banner__body p {
font-size: clamp(1rem, 1rem + 1vw, 1.5rem);
}
.hero-banner__body p:first-child {
margin-top: 0;
}
.hero-banner__body p:last-child {
margin-bottom: 0;
}
.hero-banner__content.has-salty-background {
background-size: 20%;
background-position: center;
background-repeat: repeat;
}
.hero-banner__content.salty-bg-salty-blue {
background-image: url("images/salty-patterns/salty-blue.png");
}
.hero-banner__content.salty-bg-salty-cream {
background-image: url("images/salty-patterns/salty-cream.png");
}
.hero-banner__content.salty-bg-salty-green {
background-image: url("images/salty-patterns/salty-green.png");
}
.hero-banner__content.salty-bg-salty-ink {
background-image: url("images/salty-patterns/salty-ink.png");
color: #ffffff;
}
.hero-banner__content.salty-bg-salty-orange {
background-image: url("images/salty-patterns/salty-orange.png");
}
.hero-banner__content.salty-bg-salty-pink {
background-image: url("images/salty-patterns/salty-pink.png");
}
.hero-banner__content.salty-bg-salty-yellow {
background-image: url("images/salty-patterns/salty-yellow.png");
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
main figure.wp-block-image {
background-color: #fff3cc;
margin-block-start: 0;
margin-block-end: 0;
}
main figure.wp-block-image.is-style-rounded {
border-radius: 100%;
overflow: hidden;
}
main figure.wp-block-image img {
background-color: #ffffff;
}
main figure.wp-block-image figcaption {
font-size: clamp(0.75rem, 0.75rem + 1vw, 0.875rem);
display: flex;
flex-direction: row;
justify-content: flex-end;
padding: 20px clamp(30px, 5vw, 50px);
max-width: 550px;
margin-bottom: 0;
margin-left: auto;
margin-right: 0;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
.wp-block-media-text {
margin-block-start: 0;
margin-block-end: 0;
}
.wp-block-media-text__content {
box-sizing: border-box;
max-width: 620px;
margin-left: 0;
margin-right: auto;
padding: 120px 6% !important;
}
.wp-block-media-text__content p {
font-size: clamp(1rem, 1rem + 1vw, 1.5rem);
}
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
margin-left: auto;
margin-right: 0;
}
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content p:first-child {
margin-top: 0;
}
.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content p:last-child {
margin-bottom: 0;
}
.wp-block-media-text.has-salty-background {
background-size: 20%;
background-position: center;
background-repeat: repeat;
}
.wp-block-media-text.salty-bg-salty-blue {
background-image: url("images/salty-patterns/salty-blue.png");
}
.wp-block-media-text.salty-bg-salty-cream {
background-image: url("images/salty-patterns/salty-cream.png");
}
.wp-block-media-text.salty-bg-salty-green {
background-image: url("images/salty-patterns/salty-green.png");
}
.wp-block-media-text.salty-bg-salty-ink {
background-image: url("images/salty-patterns/salty-ink.png");
color: #ffffff;
}
.wp-block-media-text.salty-bg-salty-orange {
background-image: url("images/salty-patterns/salty-orange.png");
}
.wp-block-media-text.salty-bg-salty-pink {
background-image: url("images/salty-patterns/salty-pink.png");
}
.wp-block-media-text.salty-bg-salty-yellow {
background-image: url("images/salty-patterns/salty-yellow.png");
}
.wp-block-media-text figure.wp-block-media-text__media {
height: 100%;
position: relative;
}
.wp-block-media-text figure.wp-block-media-text__media img {
width: 100%;
height: 100%;
object-fit: cover;
}
@media (min-width: 768px) {
.wp-block-media-text figure.wp-block-media-text__media img {
position: absolute;
}
}
.wp-block-media-text .wp-block-details {
background: none;
border-bottom: 1px solid #0f3033;
margin: 0;
padding: 0 0 2rem 0;
}
.wp-block-media-text .wp-block-details summary {
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem);
}
.wp-block-media-text .wp-block-details summary span {
font-size: clamp(0.75rem, 0.75rem + 1vw, 0.875rem);
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
nav[aria-label="Main Menu"] a span,
footer nav a span {
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
line-height: 1;
text-box-edge: cap;
text-decoration-color: #ffc524;
text-transform: uppercase;
transition: all 0.3s ease;
}
nav[aria-label="Main Menu"] a span:hover,
footer nav a span:hover {
text-decoration-skip-ink: none;
text-decoration-line: underline;
text-decoration-thickness: 0.6rem;
text-underline-offset: -0.4rem;
}
nav[aria-label="Main Menu"] li.wp-block-navigation-link:last-child a {
background: #84d9bb;
padding: 16px 24px;
text-box-edge: cap alphabetic;
text-box-trim: trim-both;
text-decoration: none;
transition: all 0.3s ease;
}
nav[aria-label="Main Menu"] li.wp-block-navigation-link:last-child a span {
text-decoration: none;
}
nav[aria-label="Main Menu"] li.wp-block-navigation-link:last-child a:hover {
transform: rotate(-6deg);
}
nav[aria-label="Social Menu"] a {
background-image: url("./images/icons/instagram.svg");
background-repeat: no-repeat;
background-size: contain;
background-position: center;
display: inline-block;
position: relative;
width: 24px;
height: 24px;
transition: all 0.3s ease;
}
nav[aria-label="Social Menu"] a span {
font-size: 0;
}
nav[aria-label="Social Menu"] a:hover {
cursor: pointer;
transform: scale(1.1);
}
nav[aria-label="Social Menu"] li.tiktok a {
background-image: url("./images/icons/tiktok.svg");
}
nav[aria-label="Social Menu"] li.facebook a {
background-image: url("./images/icons/facebook.svg");
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
.wp-block-quote.has-salty-background {
background-size: 20%;
background-position: center;
background-repeat: repeat;
}
.wp-block-quote.salty-bg-salty-blue {
background-image: url("images/salty-patterns/salty-blue.png");
}
.wp-block-quote.salty-bg-salty-cream {
background-image: url("images/salty-patterns/salty-cream.png");
}
.wp-block-quote.salty-bg-salty-green {
background-image: url("images/salty-patterns/salty-green.png");
}
.wp-block-quote.salty-bg-salty-ink {
background-image: url("images/salty-patterns/salty-ink.png");
color: #ffffff;
}
.wp-block-quote.salty-bg-salty-orange {
background-image: url("images/salty-patterns/salty-orange.png");
}
.wp-block-quote.salty-bg-salty-pink {
background-image: url("images/salty-patterns/salty-pink.png");
}
.wp-block-quote.salty-bg-salty-yellow {
background-image: url("images/salty-patterns/salty-yellow.png");
}
.wp-block-quote {
border: none !important;
margin-block-start: 0;
padding-bottom: 150px;
padding-top: 150px;
position: relative;
}
.wp-block-quote p {
font-size: clamp(1.375rem, 1.375rem + 1vw, 2.25rem);
max-width: 800px;
margin-left: auto;
margin-right: auto;
position: relative;
z-index: 2;
}
.wp-block-quote p:first-child {
margin-top: 0;
text-indent: -1rem;
}
.wp-block-quote p:last-child {
margin-bottom: 0;
}
.wp-block-quote cite {
display: block;
font-size: clamp(1rem, 1rem + 1vw, 1.5rem);
font-style: italic;
max-width: 800px;
margin-left: auto;
margin-right: auto;
position: relative;
z-index: 2;
}
.wp-block-quote cite:before {
content: "— ";
}
.wp-block-quote:not(.is-style-book-cover):after {
content: "";
background-image: url("images/quote.png");
background-size: 600px;
background-position: bottom left;
background-repeat: no-repeat;
display: block;
height: 100%;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
width: 600px;
z-index: 1;
}
.wp-block-quote.is-style-book-cover {
padding: 100px 4%;
}
.wp-block-quote.is-style-book-cover .wp-block-quote__content {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 3rem;
max-width: 1240px;
margin-left: auto;
margin-right: auto;
}
.wp-block-quote.is-style-book-cover .wp-block-quote__content .text {
flex: 1 1 calc(100% - 380px);
min-width: 300px;
}
.wp-block-quote.is-style-book-cover .wp-block-quote__content .text p:first-child {
text-indent: -1rem;
}
.wp-block-quote.is-style-book-cover .wp-block-quote__content .wp-block-quote__cover-image {
width: 100%;
max-width: 320px;
height: auto;
position: relative;
transform: rotate(7deg);
}
.wp-block-quote__book-cover-editor {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 3rem;
}
.wp-block-quote__book-cover-editor > .wp-block-quote {
flex: 1 1 60%;
min-width: 300px;
}
.wp-block-quote__book-cover-editor .wp-block-quote__cover-image {
flex: 0 0 30%;
width: 100%;
max-width: 400px;
height: auto;
transform: rotate(7deg);
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
.hero-slider .slick-prev-icon,
.hero-slider .slick-next-icon,
.hero-slider .slick-dot-icon,
.hero-slider .slick-dot-icon:before,
.book-carousel .slick-prev-icon,
.book-carousel .slick-next-icon,
.book-carousel .slick-dot-icon,
.book-carousel .slick-dot-icon:before {
color: #a1a1a1 !important;
opacity: 1 !important;
}
.hero-slider .slick-prev:focus .slick-prev-icon,
.hero-slider .slick-next:focus .slick-next-icon,
.hero-slider .slick-dots li button:focus .slick-dot-icon,
.hero-slider .slick-dots li button:focus .slick-dot-icon:before,
.hero-slider .slick-dots li.slick-active .slick-dot-icon,
.hero-slider .slick-dots li.slick-active .slick-dot-icon:before,
.book-carousel .slick-prev:focus .slick-prev-icon,
.book-carousel .slick-next:focus .slick-next-icon,
.book-carousel .slick-dots li button:focus .slick-dot-icon,
.book-carousel .slick-dots li button:focus .slick-dot-icon:before,
.book-carousel .slick-dots li.slick-active .slick-dot-icon,
.book-carousel .slick-dots li.slick-active .slick-dot-icon:before {
color: #0f3033 !important;
}
.slick-dots li {
margin: 0 2px;
}
.slick-dots li.slick-active button .slick-dot-icon:before {
font-size: 12px;
margin-top: 0;
margin-left: 0;
}
.hero-slider {
margin-bottom: 0 !important;
}
.hero-slider h1 {
margin: 0;
}
.hero-slider .slick-autoplay-toggle-button,
.hero-slider .slick-prev,
.hero-slider .slick-next,
.hero-slider .slick-dots {
bottom: 15px;
}
.hero-slider .slick-list {
margin-bottom: -7px;
}
.hero-slider__slide {
position: relative;
}
.hero-slider__link {
display: block;
}
.hero-slider__image {
width: 100%;
height: auto;
aspect-ratio: 1440/700;
object-fit: cover;
}
.book-carousel {
margin-bottom: 2rem;
}
.book-carousel .slick-track {
display: flex !important;
}
.book-carousel .slick-slide {
height: auto !important;
margin: 0 0.75rem;
}
.book-carousel .slick-slide > div {
height: 100%;
}
.book-carousel .slick-slide > div .book-carousel__slide {
height: 100%;
}
.book-carousel__slide {
background-color: #fff3cc;
color: #0f3033;
height: auto;
margin: 0 0.75rem;
}
.book-carousel__link {
display: block;
color: inherit;
text-decoration: none;
}
.book-carousel__text {
padding: 0 0.75rem 0.75rem 0.75rem;
}
.book-carousel__image {
display: block;
height: 100%;
width: 100%;
aspect-ratio: 2/3;
object-fit: cover;
pointer-events: none;
}
.book-carousel__title {
margin: 0.75rem 0 0.25rem !important;
font-family: "CervinoExtraBoldNeue", Helvetica, Arial, sans-serif;
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem);
text-transform: uppercase;
height: 1.75rem;
/* truncate text with ellipsis */
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.book-carousel__authors {
margin: 0;
font-size: 0.875em;
opacity: 0.75;
white-space: pre-line;
}
.book-carousel--continuous {
padding-bottom: 0;
overflow: hidden;
}
.book-carousel--continuous .book-carousel__track {
display: flex;
width: max-content;
animation-name: book-carousel-scroll;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
.book-carousel--continuous .book-carousel__slide {
flex: 0 0 280px;
}
.book-carousel--pausable:hover .book-carousel__track,
.book-carousel--pausable:focus-within .book-carousel__track {
animation-play-state: paused;
}
@keyframes book-carousel-scroll {
to {
transform: translateX(-50%);
}
}
@media (prefers-reduced-motion: reduce) {
.book-carousel--continuous .book-carousel__track {
animation: none;
}
}
@media (max-width: 767px) {
.small-tiles .is-layout-grid {
grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
}
}
.small-tiles .wp-block-columns {
margin-bottom: 0;
}
.small-tiles .wp-block-columns .wp-block-column {
display: flex;
flex-direction: column;
justify-content: center;
}
.small-tiles .wp-block-columns .wp-block-column:last-child {
align-items: flex-end;
}
.support-tile {
padding: 0;
gap: 0;
}
.support-tile .wp-block-column:first-child {
box-sizing: border-box;
padding: 26px 0 26px 26px;
}
@media (min-width: 768px) {
.support-tile .wp-block-column:first-child {
padding: 48px 0 48px 48px;
}
}
.support-tile .wp-block-column:last-child {
margin: 0;
}
.support-tile .wp-block-column:last-child figure {
background: transparent;
height: 100%;
overflow: hidden;
position: relative;
width: 100%;
}
.support-tile .wp-block-column:last-child figure img {
height: 100%;
width: 100%;
object-fit: cover;
object-position: left center;
position: absolute;
}
.wp-block-paragraph.is-style-extra-narrow,
.wp-block-heading.is-style-extra-narrow {
max-width: 550px;
}
.text-img-rounded .wp-block-columns {
align-items: center !important;
}
.text-img-rounded .wp-block-columns .wp-block-image {
max-width: 480px;
overflow: hidden;
}
/*!
Theme Name: Graywolf
Theme URI: https://bustout.com
Description: Graywolf is a child theme of Twenty Twenty-Five.
Author: BustOut
Author URI: https://bustout.com
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graywolf
*/
.woocommerce-account h1 {
margin-bottom: 1rem;
}
.woocommerce-account .entry-content {
margin-bottom: 3rem;
}
.woocommerce-account .entry-content h2 {
font-size: clamp(0.875rem, 0.875rem + 1vw, 1.125rem);
}
.wc-block-components-button:not(.is-link) .wc-block-components-button__text {
font-family: "CervinoExtraBoldNeue";
text-transform: uppercase;
}
/*# sourceMappingURL=style.css.map */