﻿@charset "UTF-8";
/* CSS Document */ :root {
	--font-weight-normal: 400;
	--font-weight-bold: 600;
	--font-weight-black: 700;
	
	--gx: 2rem;
	--gy: 1rem;
	--gx-lg: 3rem;
	--gy-lg: 2rem;
	
	--pt: 2rem;
	--pb: 1rem;
	--pl: 2rem;
	--pr: 2rem;
	--pt-lg: 3rem;
	--pb-lg: 2rem;
	--pl-lg: 3rem;
	--pr-lg: 3rem;
	
	--radius: 1rem;
	
	--carousel-gap: 2rem;
}

/* Theme variables (safe layer on top) */
.color-default {
  --theme-bg: #f9f6f5;
  --theme-text: #201f1d;
  --theme-soft: #e5e5e5;
}
.btn-default,
.pagination-default {
  --button-bg: #193138;
  --button-text: #fff;
}
.color-web {
  --theme-bg: #9dcbc5;
  --theme-text: #1e3834;
  --theme-soft: #eaf4f3;
}
.btn-web,
.pagination-web {
  --button-bg: #9dcbc5;
  --button-text: #1e3834;
}
.color-mag {
  --theme-bg: #9dbacb;
  --theme-text: #17242b;
  --theme-soft: #eaf0f4;
}
.btn-mag,
.pagination-mag {
  --button-bg: #9dbacb;
  --button-text: #17242b;
}
.color-book {
  --theme-bg: #cebbe2;
  --theme-text: #3b2453;
  --theme-soft: #f6f2f9;
}
.btn-book,
.pagination-book {
  --button-bg: #cebbe2;
  --button-text: #3b2453;
}
.color-con {
  --theme-bg: #ef8d61;
  --theme-text: #4a1c07;
  --theme-soft: #fce7de;
}
.btn-con,
.pagination-con {
  --button-bg: #ef8d61;
  --button-text: #4a1c07;
}
.color-shop {
  --theme-bg: #f9f6f5;
  --theme-text: #5a697c;
  --theme-soft: #eaf4f3;
}
.btn-shop,
.pagination-shop {
  --button-bg: #5a697c;
  --button-text: #fff;
}
.btn-outline-web {
	--button-bg: #9dcbc5;
	--button-text: #1e3834;
}
.btn-outline-mag {
	--button-bg: #9dbacb;
	--button-text: #17242b;
}
.btn-outline-book {
	--button-bg: #cebbe2;
	--button-text: #3b2453;
}
.btn-outline-con {
	--button-bg: #ef8d61;
	--button-text: #4a1c07;
}
.navbar-nav .nav-link.color-shop {
    background-color: #5a697c;
    color: #fff;
}

.navbar-nav .nav-link.color-shop:hover,
.navbar-nav .nav-link.color-shop:focus {
    background-color: #5a697c;
    color: #fff;
}

/* Accordion - bootstrap-custom.min.css doesn't include the accordion component, so these styles
   are added here instead (uses the site's own --radius and button theme colours) */
.accordion-item {
	border: 1px solid #e5e5e5;
}
.accordion-item:first-of-type {
	border-top-left-radius: var(--radius);
	border-top-right-radius: var(--radius);
}
.accordion-item:first-of-type .accordion-button {
	border-top-left-radius: calc(var(--radius) - 1px);
	border-top-right-radius: calc(var(--radius) - 1px);
}
.accordion-item:not(:first-of-type) {
	border-top: 0;
}
.accordion-item:last-of-type {
	border-bottom-right-radius: var(--radius);
	border-bottom-left-radius: var(--radius);
}
.accordion-item:last-of-type .accordion-button.collapsed {
	border-bottom-right-radius: calc(var(--radius) - 1px);
	border-bottom-left-radius: calc(var(--radius) - 1px);
}
.accordion-item:last-of-type .accordion-collapse {
	border-bottom-right-radius: var(--radius);
	border-bottom-left-radius: var(--radius);
}
.accordion-button {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: 1.25rem 1.5rem;
	font-family: system-ui, sans-serif;
	font-size: 1rem;
	font-weight: 700;
	text-align: left;
	color: #201f1d;
	background-color: #fff;
	border: 0;
	overflow-anchor: none;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}
.accordion-button:not(.collapsed) {
	background-color: var(--button-bg, #193138);
	color: var(--button-text, #fff);
}
.accordion-button::after {
	flex-shrink: 0;
	width: 1.25rem;
	height: 1.25rem;
	margin-left: auto;
	content: "";
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23201f1d'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-size: 1.25rem;
	transition: transform 0.2s ease-in-out;
}
.accordion-button:not(.collapsed)::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	transform: rotate(-180deg);
}
.accordion-body {
	padding: 1.5rem;
}
@media (min-width: 992px) {
	.accordion-button,
	.accordion-body {
		padding: 2rem;
	}
}

/*-- Reboot --*/
body {
	font-family: system-ui, sans-serif;
	line-height: 1.45;
	color: #201f1d;
	font-weight: 400;
	text-align: left;
	background-color: #fff;
	transition: background-color 0.6s ease; /* JS is only on the home page, so this will be ignored on other pages */
}
a {
	color: #201f1d;
	text-decoration: none;
	font-weight: 700;
}
a:hover {
	text-decoration: underline;
}

/* Animation on home page */
#animation_wrapper {
	width: 100%;
	display: flex;
	justify-content: center;
	transform: translateY(calc(var(--nav-height) * -1));
}
#animation_container {
	position: relative;
	overflow: hidden;
}

/*-- Backgrounds --*/
.bg-holder {
	position: absolute;
	width: 100%;
	min-height: 100%;
	top: 0;
	left: 0;
	background-size: cover;
	background-position: center;
	overflow: hidden;
	will-change: transform, opacity, filter;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	background-repeat: no-repeat;
}
.bg-holder.overlay:before {
	position: absolute;
	content: '';
	background: rgba(0, 0, 0, 0.25);
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
.bg-holder.overlay-2:before {
	background: rgba(0, 0, 0, 0.4);
}
.bg-holder .bg-video {
	position: absolute;
	display: block;
	z-index: -1;
	top: 0;
	left: 0;
	-o-object-fit: cover;
	object-fit: cover;
	height: 100%;
	min-width: 100%;
}

/*-- Buttons --*/
.btn {
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-size: 0.75rem;
	border: 3px solid transparent;
	border-radius: var(--radius);
	padding: 0.8rem 2.5rem;
	line-height: 1.45;
	margin-bottom: 1rem;
}
.btn,
.btn:hover {
	text-decoration: none !important;
}
.btn-outline {
	font-weight: 700;
	letter-spacing: 0em;
	text-transform: capitalize;
	font-size: 1rem;
	border: 3px solid transparent;
	border-radius: var(--radius);
	padding: 0.8rem 2.5rem;
	line-height: 1.45;
	margin-bottom: 1rem;
	background-color: transparent;
}
.btn-link {
	letter-spacing: 0;
	text-transform: none;
	font-size: 1rem;
	text-decoration: none;
}

.btn-sm,
.btn-group-sm > .btn {
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-size: 0.75rem;
	border-width: 1px;
    padding: 0.5rem 1rem;
   	border-radius: 0.5rem;
}

/* Cards */
.card {
	border-radius: var(--radius);
}
.card-header:first-child {
	border-radius: var(--radius) var(--radius) 0 0;
}

/* Carousel */
.carousel {
	display: flex;
	overflow-x: auto;
	gap: var(--carousel-gap);
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-ms-overflow-style: none;
	-webkit-overflow-scrolling: touch;
	align-items: stretch;
}
.carousel::-webkit-scrollbar {
	display: none;
}
.carousel-item {
	flex: 0 0 100%;
	min-width: 0;
	scroll-snap-align: start;
}
@media (min-width: 768px) {
	.carousel--2 .carousel-item {
		flex: 0 0 calc((100% - var(--carousel-gap)) / 2);
	}
}
@media (min-width: 992px) {
	.carousel--3 .carousel-item {
		flex: 0 0 calc((100% - (2 * var(--carousel-gap))) / 3);
	}
}

/* Colours */
.color-default,
.color-web,
.color-mag,
.color-con,
.color-book,
.color-shop {
	background-color: var(--theme-bg);
	color: var(--theme-text);
}
.color-web .btn,
.color-mag .btn,
.color-con .btn,
.color-book .btn {
	background-color: #fff;
	color: var(--theme-text);
	border-color: #fff;
}
.color-shop .btn {
	background-color: var(--theme-text);
	color: #fff;
	border-color: var(--theme-text)
}
.color-web .btn:hover,
.color-mag .btn:hover,
.color-con .btn:hover,
.color-book .btn:hover {
	background-color: var(--theme-soft);
	color: var(--theme-text);
	border-color: var(--theme-soft);
}

.color-shop .btn:hover {
	background-color: var(--theme-text);
	color: #fff;
	border-color: var(--theme-text);
}
.card.color-web,
.card.color-mag,
.card.color-con,
.card.color-book {
	background-color: var(--theme-bg);
	color: var(--theme-text);
}
.card.color-shop {
	background-color: #fff;
	color: var(--theme-text);
}

/* Colours - solid theme buttons (for use on white or default backgrounds) */
.btn-default,
.btn-web,
.btn-mag,
.btn-con,
.btn-book,
.btn-shop {
	background-color: var(--button-bg);
	border-color: var(--button-bg);
	color: var(--button-text);
}
.btn-default:hover,
.btn-web:hover,
.btn-mag:hover,
.btn-con:hover,
.btn-book:hover,
.btn-shop:hover {
	background-color: var(--button-bg);
	border-color: var(--button-bg);
	color: #fff;
}

/* Colours - outline theme buttons */
.btn-outline-theme {
	background-color: transparent;
	border-color: var(--button-bg);
	color: var(--button-text);
}
.btn-outline-theme:hover {
	background-color: var(--button-bg);
	color: #fff;
}
.filters-button-group .button.is-checked {
	background-color: var(--button-bg);
	border-color: var(--button-bg);
	color: #fff;
}
.color-shop .btn.btn-outline-shop,
.btn.btn-outline-shop {
	background-color: #fff;
	border-color: #5a697c;
	color: #5a697c;
}
.color-shop .btn.btn-outline-shop:hover,
.color-shop .btn.btn-outline-shop:focus,
.btn.btn-outline-shop:hover,
.btn.btn-outline-shop:focus {
	background-color: #5a697c;
	border-color: #5a697c;
	color: #fff;
}

/* Colours - overides for bg-white items that are nested in coloured-bg */
.color-web .bg-white .btn,
.color-mag .bg-white .btn,
.color-con .bg-white .btn,
.color-book .bg-white .btn,
.color-shop .bg-white .btn {
	background-color: var(--theme-bg);
	border-color: var(--theme-bg);
	color: var(--theme-text);
}

.color-web .bg-white .btn:hover,
.color-mag .bg-white .btn:hover,
.color-con .bg-white .btn:hover,
.color-book .bg-white .btn:hover,
.color-shop .bg-white .btn:hover {
	background-color: var(--theme-bg);
	border-color: var(--theme-bg);
	color: #fff;
}

/* Colours – Nav*/
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
	color: var(--nav-hover-color, #fff);
}
.color-web,
.color-mag,
.color-con,
.color-book,
.color-shop {
	--nav-hover-color: #fff;
}
.color-default {
	--nav-hover-color: var(--theme-text);
}

/* Colours - Pagination */
.pagination-chevron .icon-chevron {
	color: var(--button-bg);
}
.pagination-chevron:hover .icon-chevron,
.pagination-chevron:focus-visible .icon-chevron {
	color: var(--button-text);
}

/* Colours - Pagination on coloured backgrounds */
.color-web .pagination-chevron,
.color-mag .pagination-chevron,
.color-con .pagination-chevron,
.color-book .pagination-chevron,
.color-shop .pagination-chevron {
	color: #fff;
}
.color-web .pagination-chevron:hover,
.color-web .pagination-chevron:focus-visible,
.color-mag .pagination-chevron:hover,
.color-mag .pagination-chevron:focus-visible,
.color-con .pagination-chevron:hover,
.color-con .pagination-chevron:focus-visible,
.color-book .pagination-chevron:hover,
.color-book .pagination-chevron:focus-visible,
.color-shop .pagination-chevron:hover,
.color-shop .pagination-chevron:focus-visible {
	color: var(--theme-soft);
}

/* Full Page */
.hero-section {
	min-height: 100vh;
	display: flex;
	align-items: center;   /* vertical center */
	justify-content: center; /* horizontal center (optional but useful) */
}


/* Font Family */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	margin-bottom: 1rem;
	font-weight: var(--font-weight-black);
}

/*-- Font styles and Utilities --*/
h1,
.h1,
.display-1,
.display-2 {
	font-weight: 700;
}
h3, .h3 {
	font-weight: 600;
}
.fs-1,
.fs-2,
.display-6 {
	font-weight: 400;
}

/* Footer Styles */
footer {
	background-color: #193138;
}
footer p, footer address, footer a:hover {
	color: #e5e5e5;
}
footer h4 {
	color: #fff;
}
footer a {
	color: #fff;
}

/* Image */
img, .img {
	margin-bottom: 1rem;
}

/*-- Logo --*/
.logo {
	width: 175px;
}
@media (min-width: 768px) {
	.logo {
		width: 225px;
	}
}

/*-- Margin and Padding Utility Classes --*/
.p-custom {
	padding-top: var(--pt);
	padding-bottom: var(--pb);
	padding-left: var(--pl);
	padding-right: var(--pr);
}
.py-custom {
	padding-top: var(--pt);
	padding-bottom: var(--pb);
}
.pt-custom {
	padding-top: var(--pb);
}
.pb-custom {
	padding-bottom: var(--pb);
}
.px-custom {
	padding-left: var(--pl);
	padding-right: var(--pr);
}
.row.g-custom, .row.gy-custom {
	--bs-gutter-y: var(--gy);
}
.row.g-custom, .row.gx-custom {
	--bs-gutter-x: var(--gx);
}
@media (min-width: 992px) {
	.p-custom {
		padding-top: var(--pt-lg);
		padding-bottom: var(--pb-lg);
		padding-left: var(--pl-lg);
		padding-right: var(--pr-lg);
	}
	.py-custom {
		padding-top: var(--pt-lg);
		padding-bottom: var(--pb-lg);
	}
	.pt-custom {
		padding-top: var(--pb-lg);
	}
	.pb-custom {
		padding-bottom: var(--pb-lg);
	}
	.px-custom {
		padding-left: var(--pl-lg);
		padding-right: var(--pr-lg);
	}
	.row.g-custom, .row.gy-custom {
		--bs-gutter-y: var(--gy-lg);
	}
	.row.g-custom, .row.gx-custom {
		--bs-gutter-x: var(--gx-lg);
	}
}

/*-- Nav --*/
.navbar-nav.nav-pills .nav-link {
	display: block;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-size: 0.75rem;
	padding: 2rem;
	border: 1px solid transparent;
	line-height: 1.45;
	border-radius: 0;
}
.nav-link,
.nav-link:hover {
	text-decoration: none !important;
}

/* Mobile stacked nav */
@media (max-width: 991.98px) {
	.navbar-nav.nav-pills {
		gap: 0;
	}
	.navbar-nav.nav-pills .nav-item {
		width: 100%;
	}
	.navbar-nav.nav-pills .nav-link {
		width: 100%;
	}
}
.navbar-toggler {
	padding: 0.25rem 0.75rem;
	font-size: 1.333rem;
	line-height: 1;
	background-color: transparent;
	border: 0;
	border-radius: 0;
}
.navbar-toggler-icon {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Page Decoration */
.underlay {
	position: absolute;
	z-index: 1;
	overflow-x: hidden;
	width: 100%;
	height: auto;
}
.wrapper {
	position: relative;
	z-index: 10;
}

/* Pagination */
.pagination-chevron {
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
}
.icon-chevron {
	width: 48px;
	height: 48px;
	transition: color 0.2s;
}
.pagination-chevron:disabled {
	opacity: 0.3;
	cursor: default;
	pointer-events: none;
}

/*-- Phone Animation --*/
.device, .device::before, .device::after, .device *, .device *::before, .device *::after {
	box-sizing: border-box;
	display: block;
	-webkit-transition: all .5s;
}
.device {
	position: relative;
	transform: scale(1);
	z-index: 1;
}
.device .device-frame {
	z-index: 1;
}
.device .device-content {
	background-color: #222;
	background-position: center center;
	background-size: cover;
	object-fit: cover;
	position: relative;
}

/*--half sizes between here--*/
.device-iphone-x {
	height: 260px;
	width: 277px;
	margin: auto;
}
.device-iphone-x .device-frame {
	background: #222;
	border-radius: 17px;
	box-shadow: inset 0 0 1px 1px #c8cacb, inset 0 0 0 3px #e2e3e4;
	height: 260px;
	padding: 7px;
	width: 128px;
	margin: auto;
}
.device-iphone-x .device-content {
	border-radius: 10px;
	height: 244px;
	width: 113px;
	background-image: url("/common/img/iphone-188x406.webp");
}
.device-iphone-x .device-header {
	background: #222;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	height: 7px;
	left: 50%;
	margin-left: -26px;
	position: absolute;
	top: 7px;
	width: 51px;
}
.device-iphone-x .device-header::after, .device-iphone-x .device-header::before {
	content: "";
	height: 3px;
	position: absolute;
	top: 0;
	width: 3px;
}
.device-iphone-x .device-header::after {
	background: radial-gradient(circle at bottom left, transparent 0, transparent 75%, #222 75%, #222 100%);
	left: -5px;
}
.device-iphone-x .device-header::before {
	background: radial-gradient(circle at bottom right, transparent 0, transparent 75%, #222 75%, #222 100%);
	right: -5px;
}
.device-iphone-x .device-sensors::after, .device-iphone-x .device-sensors::before {
	content: "";
	position: absolute;
}
.device-iphone-x .device-sensors::after {
	background: #444;
	border-radius: 1px;
	height: 2px;
	left: 50%;
	margin-left: -7px;
	top: 8px;
	width: 12px;
}
.device-iphone-x .device-sensors::before {
	background: #444;
	border-radius: 50%;
	height: 3px;
	left: 50%;
	margin-left: 20px;
	top: 7px;
	width: 3px;
}
.device-iphone-x .device-btns {
	background: #c8cacb;
	height: 8px;
	left: -2px;
	position: absolute;
	top: 28px;
	width: 1px;
}
.device-iphone-x .device-btns::after, .device-iphone-x .device-btns::before {
	background: #c8cacb;
	content: "";
	height: 16px;
	left: 0;
	position: absolute;
	width: 1px;
}
.device-iphone-x .device-btns::after {
	top: 15px;
}
.device-iphone-x .device-btns::before {
	top: 35px;
}
.device-iphone-x .device-power {
	top: 0px;
	width: 0px;
}
/*-- and here --*/

@media (min-width: 992px) {
	.device-iphone-x {
		height: 434px;
		width: 462px;
		margin: auto;
	}
	.device-iphone-x .device-frame {
		background: #222;
		border-radius: 34px;
		box-shadow: inset 0 0 2px 2px #c8cacb, inset 0 0 0 7px #e2e3e4;
		height: 434px;
		padding: 14px;
		width: 214px;
		margin: auto;
	}
	.device-iphone-x .device-content {
		border-radius: 20px;
		height: 406px;
		width: 188px;
		background-image: url("/common/img/iphone-188x406.webp");
	}
	.device-iphone-x .device-header {
		background: #222;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		height: 15px;
		left: 50%;
		margin-left: -51px;
		position: absolute;
		top: 14px;
		width: 102px;
	}
	.device-iphone-x .device-header::after, .device-iphone-x .device-header::before {
		content: "";
		height: 5px;
		position: absolute;
		top: 0;
		width: 5px;
	}
	.device-iphone-x .device-header::after {
		background: radial-gradient(circle at bottom left, transparent 0, transparent 75%, #222 75%, #222 100%);
		left: -5px;
	}
	.device-iphone-x .device-header::before {
		background: radial-gradient(circle at bottom right, transparent 0, transparent 75%, #222 75%, #222 100%);
		right: -5px;
	}
	.device-iphone-x .device-sensors::after, .device-iphone-x .device-sensors::before {
		content: "";
		position: absolute;
	}
	.device-iphone-x .device-sensors::after {
		background: #444;
		border-radius: 1px;
		height: 3px;
		left: 50%;
		margin-left: -13px;
		top: 16px;
		width: 25px;
	}
	.device-iphone-x .device-sensors::before {
		background: #444;
		border-radius: 50%;
		height: 7px;
		left: 50%;
		margin-left: 20px;
		top: 14px;
		width: 7px;
	}
	.device-iphone-x .device-btns {
		background: #c8cacb;
		height: 16px;
		left: -2px;
		position: absolute;
		top: 57px;
		width: 2px;
	}
	.device-iphone-x .device-btns::after, .device-iphone-x .device-btns::before {
		background: #c8cacb;
		content: "";
		height: 32px;
		left: 0;
		position: absolute;
		width: 2px;
	}
	.device-iphone-x .device-btns::after {
		top: 30px;
	}
	.device-iphone-x .device-btns::before {
		top: 70px;
	}
	.device-iphone-x .device-power {
		top: 0px;
		width: 0px;
	}
}

/* half sizes between here */
.device-macbook {
	height: 260px;
	width: 277px;
	margin: auto;
	padding-top: 28px;
}
.device-macbook .device-frame {
	background: #0d0d0d;
	border-radius: 7px;
	box-shadow: inset 0 0 0 1px #c8cacb;
	height: 192px;
	margin: 0 auto;
	padding: 11px 7px 15px 7px;
	position: relative;
	width: 277px;
}
.device-macbook .device-content {
	border: 1px solid #121212;
	border-radius: 1px;
	height: 170px;
	width: 260px;
	background-image: url("/common/img/laptop-432x270.webp");
}
.device-macbook .device-btns {
	display: none;
}
.device-macbook .device-btns::after, .device-macbook .device-btns::before {
	display: none;
}
.device-macbook .device-btns::after {
	display: none;
}
.device-macbook .device-btns::before {
	display: none;
}
.device-macbook .device-power {
	display: none;
}
/* and here */

@media (min-width: 992px) {
	.device-macbook {
		height: 434px;
		width: 462px;
		margin: auto;
		padding-top: 57px;
	}
	.device-macbook .device-frame {
		background: #0d0d0d;
		border-radius: 14px;
		box-shadow: inset 0 0 0 2px #c8cacb;
		height: 321px;
		margin: 0 auto;
		padding: 22px 14px 29px 14px;
		position: relative;
		width: 462px;
	}
	.device-macbook .device-content {
		border: 2px solid #121212;
		border-radius: 2px;
		height: 270px;
		width: 432px;
		background-image: url("/common/img/laptop-432x270.webp");
	}
	.device-macbook .device-btns {
		display: none;
	}
	.device-macbook .device-btns::after, .device-macbook .device-btns::before {
		display: none;
	}
	.device-macbook .device-btns::after {
		display: none;
	}
	.device-macbook .device-btns::before {
		display: none;
	}
	.device-macbook .device-power {
		display: none;
	}
}

/* Quotes */
.openquote {
	height: 96px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	left: 0;
	font-weight: 500;
	font-size: 6rem;
}
.closequote {
	height: 64px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	bottom: 0;
	right: 0;
	font-weight: 500;
	font-size: 6rem;
}

/* Stars */
.star-row {
	display: flex;
	gap: 4px;
}
.icon-star {
	width: 20px;
	height: 20px;
	color: #ffc107;
	flex: 0 0 auto;
}