.blog-link--body figure { display: table; margin: 0 auto 3rem; } .form-group { position: relative; margin-bottom: 1.25rem; } .form-group .form-control-label { position: absolute; z-index: 1; font-size: 1rem; padding: 0 1rem; top: 0.5rem; color: #5e5e5e; transition: top 0.3s ease, font-size 0.3s ease, left 0.3s ease; } .form-group .form-control-label::before { color: #ae2d24; } .form-group .form-control { border-radius: 0; border-color: #000; color: #000; } .form-group .form-control:focus { box-shadow: 0 0 0 0.2rem rgba(100, 100, 100, 0.25); } .form-group .form-control.is-invalid { border-color: #ae2d24; } .form-group--helper { font-family: PitchSans, serif; text-transform: uppercase; font-size: 0.6875rem; font-weight: 500; } @media (min-width: 544px) { .form-group--helper { font-size: 0.75rem; } } .form-group--active .form-control-label, .form-group--active__force .form-control-label { line-height: 1; top: -0.4rem; left: 0.4rem; z-index: 1; font-size: 0.8rem; background: #fff; transition: top 0.3s ease, font-size 0.3s ease, left 0.3s ease; } .form-group.required .form-control-label::before { content: "*"; margin-right: -2px; } .form-group :-webkit-autofill { animation-name: onAutoFillStart; } @keyframes onAutoFillStart {} .custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.2rem rgba(100, 100, 100, 0.25); } .custom-checkbox { display: block; cursor: pointer; padding-left: 0; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .custom-checkbox input[type=checkbox] { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .custom-checkbox input[type=checkbox]:checked ~ .custom-control-label::before { background-image: url("../../images/checkbox-active.svg"); background-color: #fff; } .custom-checkbox input[type=checkbox]:checked ~ .custom-control-label::after { display: none; } .custom-checkbox .custom-control-label { display: flex; } .custom-checkbox .custom-control-label::before { content: ""; position: unset; border: 0; background: url("../../images/checkbox.svg"); background-size: contain; background-repeat: no-repeat; border-radius: 0; min-height: 17px; min-width: 16px; align-self: center; margin-right: 0.5rem; } #braintreeCreditCardFieldsContainer .braintree-field-wrap .braintree-hosted-fields-iframe-container { padding: 0 1rem; border: 1px solid #000; border-radius: 0; } #braintreeCreditCardFieldsContainer .braintree-field-wrap .braintree-hosted-fields-ph { padding: 0 1rem; color: #000; border: 0.1rem solid #000; border-radius: 0; } #braintreeCreditCardFieldsContainer .braintree-field-wrap .braintree-text-input { border: 1px solid #000; border-radius: 0; } #braintreeCreditCardFieldsContainer .braintree-field-wrap .braintree-hosted-fields-focused { box-shadow: 0 0 0 0.2rem rgba(100, 100, 100, 0.25); } #braintreeCreditCardFieldsContainer .braintree-field-wrap .braintree-hosted-fields-invalid { border-color: #ae2d24; } #braintreeCreditCardFieldsContainer .braintree-field-wrap .braintree-hosted-fields-valid { border-color: #000; } #braintreeCreditCardFieldsContainer .form-caption { font-family: PitchSans, serif; text-transform: uppercase; font-size: 0.6875rem; font-weight: 500; } @media (min-width: 544px) { #braintreeCreditCardFieldsContainer .form-caption { font-size: 0.75rem; } } .blog-link { font-size: 0.9375rem; line-height: 1.375rem; } @media (min-width: 769px) { .blog-link { font-size: 1.125rem; line-height: 1.5625rem; } } .blog-link .wp-block-image figcaption { font-family: ApercuLight, "Helvetica", sans-serif; font-size: 0.875rem; font-weight: 600; font-style: italic; margin-top: 0.3125rem; } .blog-link .wp-block-coblocks-gallery-carousel { margin-bottom: 1.5rem; } .blog-link h1, .blog-link .h1 { font-size: 1.625rem; line-height: 1.625rem; } @media (min-width: 769px) { .blog-link h1, .blog-link .h1 { font-size: 3.5rem; line-height: 3.5rem; } } .blog-link h1 ~ .blog-link--category, .blog-link .h1 ~ .blog-link--category { margin-bottom: 0.9375rem; } @media (min-width: 769px) { .blog-link h1 ~ .blog-link--category, .blog-link .h1 ~ .blog-link--category { margin-bottom: 1.5625rem; } } .blog-link .h2, .blog-link .h2 a { line-height: 1rem; } @media (min-width: 544px) { .blog-link .h2, .blog-link .h2 a { font-family: ChiswickSans, sans-serif; font-size: 1.625rem; line-height: 1.625rem; } } @media (min-width: 769px) { .blog-link .h2, .blog-link .h2 a { font-size: 2.625rem; line-height: 2.625rem; } } .blog-link--header { margin-top: 0.9375rem; margin-bottom: 1.5rem; } @media (min-width: 769px) { .blog-link--header { margin-top: 1.5rem; margin-bottom: 3.125rem; } .blog-link--header h1 { width: 80%; margin: 0px auto; } } .blog-link--header .blog-link--category:first-child .article-categories { display: block; } .blog-link--header .blog-link--category:first-child .article-categories::before { display: none; } @media (min-width: 992px) { .blog-link--share { position: absolute; left: -90px; } } .blog-link--share .sharetext { vertical-align: top; font-family: PitchSans, serif; font-weight: bolder; } .blog-link--share ul { width: unset; list-style: none; padding-inline-start: 0rem; display: inline-flex; } @media (min-width: 992px) { .blog-link--share ul { margin-left: 0.9375rem; } } @media (min-width: 769px) { .blog-link--share ul { display: inline-block; } } .blog-link--share ul li { float: left; margin-right: 0.9375rem; } @media (min-width: 992px) { .blog-link--share ul li { float: none; margin-right: 0rem; } } .blog-link--share ul a { display: inline-block; width: 1.25rem; height: 1.25rem; background-size: contain; background-repeat: no-repeat; background-position-x: center; } .blog-link--share ul a.facebook { background-image: url("../images/facebook.png"); } .blog-link--share ul a.twitter { background-image: url("../images/twitter.png"); } .blog-link--share ul a.pinterest { background-image: url("../images/pinterest.png"); } .blog-link--share ul a.email { background-image: url("../images/email.png"); } .blog-link--body { margin-bottom: 1.875rem; } @media (min-width: 769px) { .blog-link--body { margin-bottom: 2.5rem; } } .blog-link--body::after { content: ""; background-size: contain; background-repeat: no-repeat; display: block; margin-top: 0.9375rem; margin-left: 50%; width: 1.1875rem; height: 1.1875rem; background-image: url("../images/keyhole-icon.png"); } .blog-link--body h2:first-of-type { font-family: PitchSans, serif; font-size: 1rem !important; line-height: 1.25rem !important; text-transform: uppercase; } @media (min-width: 769px) { .blog-link--body h2:first-of-type { font-size: 1.25rem !important; line-height: 1.5rem !important; } } .blog-link--body h3:first-of-type { font-family: PitchSans, serif; font-size: 0.75rem !important; line-height: 0.9375rem !important; text-transform: uppercase; } .blog-link--body h3:first-of-type::first-letter { font-size: 1.25rem; font-weight: 900; color: #ffc600; } .blog-link--body h6 { font-size: 0.875rem !important; line-height: 1rem !important; text-transform: uppercase; } @media (min-width: 769px) { .blog-link--body h6 { font-size: 1rem !important; line-height: 1.25rem !important; } } .blog-link--body p.custom-underline a { font-weight: 800; font-family: ApercuLight, "Helvetica", sans-serif; text-transform: none; font-size: 0.9375rem; line-height: 1.375rem; display: inline-block; position: relative; background-color: transparent; } @media (min-width: 769px) { .blog-link--body p.custom-underline a { font-size: 1.125rem; line-height: 1.5625rem; } } .blog-link--body p.custom-underline a::after { content: ""; position: absolute; top: 55%; height: 5px; width: 100%; left: 0; z-index: -99; background-color: #ffc600; transition: 0.2s ease all 0.2s; } .blog-link--body p.custom-underline a:hover { text-decoration: none; } .blog-link--body p.custom-underline a:hover::after { width: 0; left: 100%; transition: 0.2s ease all; } .blog-link--body p.custom-underline a.btn::after { top: 50%; } .blog-link--body img { height: auto !important; } .blog-link .blog-related-posts { border-bottom: 1px solid #000; margin-bottom: 50px; } @media (min-width: 769px) { .blog-link .blog-related-posts { margin-bottom: 100px; } } @media (max-width: 768.98px) { .blog-link .blog-related-posts { overflow: auto; margin-right: -10px; } } .blog-link .blog-related-posts-title { border-top: 1px solid black; padding-top: 3.125rem; } @media (min-width: 769px) { .blog-link .blog-related-posts-title { padding-top: 5rem; } } @media (max-width: 768.98px) { .blog-link .blog-related-posts--container { width: 300%; } } .blog-link .blog-related-posts--post { display: grid; grid-template: 70% 30%/100%; } @media (min-width: 769px) and (max-width: 991.98px) { .blog-link .blog-related-posts--post { grid-template: 60% 40%/100%; } } @media (max-width: 991.98px) { .blog-link .blog-related-posts--post { max-width: 75vw; } } .blog-link .blog-related-posts--image { overflow: hidden; margin-bottom: 0.875rem; } @media (min-width: 544px) { .blog-link .blog-related-posts--image { margin-bottom: 1.1875rem; } } .blog-link .blog-related-posts--image a { display: block; } .blog-link .blog-related-posts--image img { width: 100%; } .blog-link .blog-trending-posts--container { padding: 0px; } .blog-link .blog-trending-posts--post { padding-bottom: 20px; } .blog-link .coblocks-gallery .has-carousel, .blog-link .coblocks-gallery .carousel-nav { display: flex; } .blog-link .coblocks-gallery .has-carousel { display: flex !important; overflow-x: scroll; height: auto !important; scroll-snap-type: x mandatory; margin-bottom: 0.75rem; } .blog-link .coblocks-gallery .has-carousel > .coblocks-gallery--item { flex: 1 0 100%; scroll-snap-align: start; } .blog-link .coblocks-gallery .has-carousel > .coblocks-gallery--item figure, .blog-link .coblocks-gallery .has-carousel > .coblocks-gallery--item img { margin: 0; width: 100%; } @media (min-width: 992px) { .blog-link .coblocks-gallery .has-carousel:hover > ul { display: flex; } } .blog-link .coblocks-gallery .has-carousel > ul { display: flex; position: absolute; top: 50%; transform: translateY(-50%); justify-content: space-between; width: 100%; padding: 0; } @media (min-width: 992px) { .blog-link .coblocks-gallery .has-carousel > ul { display: none; } } .blog-link .coblocks-gallery .has-carousel > ul li { display: block; } .blog-link .coblocks-gallery .has-carousel > ul li a:hover::before, .blog-link .coblocks-gallery .has-carousel > ul li a:focus::before { opacity: 1; } .blog-link .coblocks-gallery .has-carousel > ul li a::before { content: ""; display: block; background-image: url("../images/gallery-left-arrow.svg"); background-size: contain; background-repeat: no-repeat; width: 27px; height: 88px; opacity: 0.8; } @media (min-width: 544px) { .blog-link .coblocks-gallery .has-carousel > ul li a::before { width: 37px; height: 88px; } } .blog-link .coblocks-gallery .has-carousel > ul li:last-of-type a::before { transform: rotate(180deg); background-position: bottom; } .blog-link .coblocks-gallery .has-carousel > ul li.disabled a::before { opacity: 0.2; } .blog-link .coblocks-gallery .has-carousel-wrapper { position: relative; } .blog-link .coblocks-gallery .carousel-nav a { display: block; } .blog-link .coblocks-gallery .carousel-nav a img { pointer-events: none; } .blog-link .coblocks-gallery .carousel-nav .coblocks--item-thumbnail { flex: 0 0 20%; position: relative; padding-right: 10px; } .blog-link .coblocks-gallery .carousel-nav .coblocks--item-thumbnail:not(.active) a::before { content: ""; display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(255, 255, 255, 0.5); } .blog-link .coblocks-gallery .carousel-nav .coblocks--item-thumbnail figure { margin-bottom: 1rem; } .blog-link.blog-folder-header .folder-name { font-size: 1.625rem; } .blog-link.blog-folder-header .folder-description { font-size: 0.8125rem; line-height: 1.125rem; } @media (min-width: 769px) { .blog-link.blog-folder-header .folder-name { font-size: 2.25rem; line-height: 2.625rem; } .blog-link.blog-folder-header .folder-description { font-size: 0.9375rem; line-height: 1.25rem; } } .blog-link .blog-featured-posts--top-post { margin: 1.25rem 0rem; } @media (min-width: 769px) { .blog-link .blog-featured-posts--top-post { width: 95%; margin: 3.75rem auto; } } @media (min-width: 992px) { .blog-link .blog-featured-posts--top-post .blog-featured-posts--image { order: 1; align-self: center; } .blog-link .blog-featured-posts--top-post .blog-featured-posts--headline { align-self: center; margin-left: 0; z-index: 1; } } .blog-link .blog-featured-posts--top-post .h1, .blog-link .blog-featured-posts--top-post .h1 a { font-family: ChiswickSans, sans-serif; font-size: 2.125rem; line-height: 2.125rem; } @media (min-width: 769px) { .blog-link .blog-featured-posts--top-post .h1, .blog-link .blog-featured-posts--top-post .h1 a { font-size: 3.5rem; line-height: 3.5rem; } } .blog-link .blog-featured-posts--top-post .h8 a { font-size: 0.75rem; line-height: 0.9375rem; } .blog-link .blog-featured-posts--top-post .blog-featured-posts--headline > .article-categories::before { display: none; } .blog-link .blog-featured-posts--top-post .blog-featured-posts--subhead { width: 70%; margin: 0px auto; font-size: 0.9375rem; line-height: 1.25rem; } .blog-link .blog-featured-posts--top-post .article-categories { margin-top: 0.9375rem; justify-content: center; } .blog-link .blog-featured-posts--group { padding: 0.625rem; padding-top: 0rem; } @media (min-width: 769px) { .blog-link .blog-featured-posts--group { display: grid; padding: 0rem; margin-top: 1.25rem; grid-template-columns: 25% 50% 25%; grid-template-rows: 50% 50%; } } .blog-link .blog-featured-posts--group .blog-featured-posts--post { padding-top: 1.25rem; } @media (min-width: 544px) { .blog-link .blog-featured-posts--group .blog-featured-posts--post:first-child .blog-featured-posts--headline { text-align: center; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:first-child .blog-featured-posts--headline > .article-categories::before { display: none; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:first-child .article-categories { justify-content: center; } } @media (min-width: 769px) { .blog-link .blog-featured-posts--group .blog-featured-posts--post { padding: 1.25rem; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:first-child { grid-column: 2; grid-row: 1/span 2; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:nth-child(2) { grid-column: 1; grid-row: 1; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:nth-child(3) { grid-column: 1; grid-row: 2; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:nth-child(4) { grid-column: 3; grid-row: 1; } .blog-link .blog-featured-posts--group .blog-featured-posts--post:nth-child(5) { grid-column: 3; grid-row: 2; } } .blog-link .blog-featured-posts--group img { width: 100%; } .blog-link .blog-featured-posts--group .h8 a { font-size: 0.75rem; line-height: 0.9375rem; } @media (min-width: 769px) { .blog-link .blog-featured-posts--group .h8 a { line-height: 1.875rem; } } @media (min-width: 769px) { .blog-link .blog-featured-posts--group.alt { grid-template-columns: 50% 25% 25%; } } @media (min-width: 769px) { .blog-link .blog-featured-posts--group.alt .blog-featured-posts--post:first-child { grid-column: 1; } .blog-link .blog-featured-posts--group.alt .blog-featured-posts--post:nth-child(2) { grid-column: 2; } .blog-link .blog-featured-posts--group.alt .blog-featured-posts--post:nth-child(3) { grid-column: 2; } } .blog-link .blog-featured-posts--headline { padding-top: 0.625rem; } .blog-link .add-comment-form-container { margin-bottom: 43px; } @media (min-width: 769px) { .blog-link .add-comment-form-container { margin-bottom: 80px; } } .blog-link .post-comments--header { margin-bottom: 13px; } @media (min-width: 769px) { .blog-link .post-comments--header { margin-bottom: 26px; } } .blog-link .post-comments--byline { font-weight: 500; } .blog-link .post-comments--content p { margin-bottom: 0; font-size: 0.8125rem; } .blog-link .post-comments--replies { padding-left: 20px; border-left: 1px solid #000; } .blog-link .post-comments--reply a { font-size: 9px; text-decoration: underline; } @media (min-width: 769px) { .blog-link .post-comments--reply a { font-size: 12px; } } .blog-link .post-comments--reply .add-comment-form-container { margin-bottom: 0; } .blog-link.blog-featured-pillars ul li p { font-size: 0.9375rem; line-height: 1.25rem; } .blog-link.blog-featured-pillars ul li p.min-two-lines { min-height: 2.5rem; } @media (max-width: 768.98px) { .blog-link.blog-featured-pillars .h1 { font-size: 2.75rem; line-height: 2.75rem; } } .blog-link .custom-underline { display: inline-block; position: relative; background-color: transparent; font-weight: 800; font-family: PitchSans, serif; text-transform: none; font-size: 0.875rem; line-height: 1.375rem; } .blog-link .custom-underline::after { content: ""; position: absolute; top: 55%; height: 5px; width: 100%; left: 0; z-index: -99; background-color: #ffc600; transition: 0.2s ease all 0.2s; } .blog-link .custom-underline:hover { text-decoration: none; } .blog-link .custom-underline:hover::after { width: 0; left: 100%; transition: 0.2s ease all; } .blog-link .custom-underline.btn::after { top: 50%; } .blog-last-content-tile { display: flex; gap: 30px; width: 95%; margin: 3.75rem auto; flex-wrap: wrap; justify-content: center; } @media (min-width: 769px) { .blog-last-content-tile { flex-wrap: nowrap; } } .blog-last-content-tile h3 { font-size: 2.625rem; line-height: 2.625rem; } .blog-last-content-tile img { max-width: 100%; } .blog-last-content-tile .left { max-width: 100%; } @media (min-width: 769px) { .blog-last-content-tile .left { max-width: 50%; } } .blog-last-content-tile .right { max-width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; } @media (min-width: 769px) { .blog-last-content-tile .right { max-width: 50%; } } @media (min-width: 992px) { .blog-last-content-tile .right { padding: 5rem; } }