/* global variables */
:root {
	--sds-blue-1: #130349;
	--sds-blue-2: #3408c4;
	--sds-blue-3: #7a54f8;
	--sds-not-quite-white: #fefdff;
	--sds-kinda-grey: #d9d9d9;
}

/* big monitor */
body {
	font-family: 'Poppins', sans-serif !important;
	font-size: 1.25vw;
	letter-spacing: 0.02vw;
	color: var(--sds-blue-1);
	background-color: var(--sds-not-quite-white);
	margin: 0;
}
header,
main,
footer {
	width: 100%;
}
header {
	position: sticky;
	top: 0;
	z-index: 9999;
}
#sds-layout-grid {
	display: grid;
	grid-template-columns: 1fr;
}
#sds-header-flex-container {
	height: 6vw;
	display: flex;
	justify-content: center;
	background-color: var(--sds-not-quite-white);
	border-bottom: 1px solid var(--sds-kinda-grey);
}
#sds-header-logo {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sds-header-logo img {
	display: flex;
}
#sds-header-logo img {
	width: 20vw;
	max-width: 100%;
	height: auto;
}
#sds-header-menu {
	flex: 2;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sds-header-menu ul {
	list-style-type: none;
	display: flex;
	width: 35vw;
	padding-left: 0;
	justify-content: space-around;
}
#sds-header-menu ul li:last-child {
	margin-right: 0;
}
#sds-header-menu ul li a {
	font-size: 1.5vw;
	font-weight: 700;
	letter-spacing: 0.05vw;
	text-decoration: none;
	color: var(--sds-blue-1);
}
#sds-header-menu ul li a.active {
	color: var(--sds-blue-3);
}
#sds-mobile-burger, #sds-mobile-menu {
	display: none;
}
#sds-section-home-flex-container,
#sds-section-services-flex-container,
#sds-section-about-flex-container,
#sds-section-contact-flex-container {
	display: flex;
}

#sds-section-home-flex-container,
#sds-section-about-flex-container,
#sds-section-contact-flex-container {
	color: var(--sds-not-quite-white);
	background-color: var(--sds-blue-1);
}
#sds-section-home-flex-container > *,
#sds-section-services-flex-container > *,
#sds-section-about-flex-container > *,
#sds-section-contact-flex-container > * {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sds-section-home-flex-container img, #sds-section-contact-flex-container img {
	max-width: 25vw;
	height: auto;
}
#sds-section-services-flex-container img,
#sds-section-about-flex-container img,
#sds-section-error-container img {
	max-width: 30vw;
	height: auto;
}
#sds-section-home-flex-container,
#sds-section-about-flex-container,
#sds-section-contact-flex-container {
	width: 80vw;
	padding: 3vw;
}
.sds-body-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.sds-body-text h1, .sds-body-text h2 {
	font-size: 3vw;
	font-weight: 400;
	line-height: 1.25;
	margin: 2.5vw 0;
}
#sds-section-home {
	scroll-margin-top: 7vw;
}
#sds-section-home-flex-container {
	border-radius: 0 0 3vw 0;
}
#sds-section-services {
	scroll-margin-top: 4vw;
}
#sds-section-services-flex-container {
	width: 80vw;
	margin: 4vw auto 6vw auto;
}
#sds-section-services-flex-container ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
#sds-section-services-flex-container li {
	position: relative;
	padding-left: 4vw;
}
#sds-section-services-flex-container li:before {
	content: url('/img/memory.svg') / "Memory bullet point";
    position: absolute;
    left: 0;
    top: 1vw;
    transform: translateY(-50%);
    width: 3vw;
    height: 3vw;
}
#sds-section-services-flex-container li p {
	text-align: left;
	font-size: 1vw;
	margin: 0;
}
#sds-section-services-flex-container h3 {
	text-align: left;
	font-size: 1.5vw;
	margin: 1vw 0 0.1vw 0;
}
#sds-section-about {
	scroll-margin-top: 1vw;
}
#sds-section-about-flex-container {
	margin-left: auto;
	border-radius: 3vw 0 0 3vw;
}
#sds-brags {
	text-align: center;
}
#sds-brags-everything {
	font-size: 1.75vw;
	font-weight: 400;
	margin: 4vw 0 2vw 0;
}
#sds-brags-list {
	display: flex;
	width: 70vw;
	margin: auto;
}
#sds-brags-imagine {
	font-size: 2.5vw;
	margin: 2vw 0 6vw 0;
}
.sds-site-brag {
	display: flex;
	flex-direction: column;
	width: 15vw;
	min-height: 16vw;
	margin: auto;
	color: var(--sds-blue-2);
	background-color: var(--sds-not-quite-white);
	border-radius: 1vw;
	box-shadow: 0px 1vw 1.25vw -0.25vw rgba(0,0,0,0.2);
}
.sds-brag-icon {
	height: 3.5vw;
	padding-top: 0.3vw;
	background-color: var(--sds-blue-2);
	border-radius: calc(1vw - 1px) calc(1vw - 1px) 0 0;
}
.sds-brag-icon img {
	height: auto;
	width: 3.5vw;
	filter: invert(90%) sepia(6%) saturate(158%) hue-rotate(212deg) brightness(106%) contrast(106%);
}
.sds-brag-label {
	padding-bottom: 0.3vw;
	margin: 0;
	font-size: 1.5vw;
	font-weight: 400;
	color: var(--sds-not-quite-white);
	background-color: var(--sds-blue-2);
}
.sds-brag-body {
	padding: 0.5vw;
	margin: auto;
	font-size: 0.8vw;
	letter-spacing: 0.01vw;
}
#sds-section-contact {
	scroll-margin-top: 5vw;
}
#sds-section-contact-flex-container {
	margin: auto;
	border-radius: 3vw;
}
#sds-contact-letstalk-container {
	display: flex;
	flex-direction: column-reverse;
}
#sds-section-contact-flex-container h2 {
	font-size: 1.5vw;
	font-weight: 400;
}
#sds-section-contact-flex-container > div {
	justify-content: center;
}
#sds-section-contact-flex-container p {
	font-size: 2.5vw;
	margin-bottom: 0.5vw;
}
#sds-section-contact-flex-container a {
	text-decoration: none;
	color: var(--sds-not-quite-white);
}
#sds-section-contact-flex-container a:hover {
	color: var(--sds-blue-3);
}
#sds-section-contact-line {
	border-top: 0.25vw solid var(--sds-blue-3);
	margin: 2vw 0;
	width: 4vw;
}
#sds-contact-letstalk-container > p {
	font-size: 3vw;
	margin: 2.5vw 0;
	line-height: 1.25;
}
#sds-section-contact-form {
	display: flex;
	width: 35vw;
	flex-direction: column;
}
#sds-section-contact-form input,
#sds-section-contact-form textarea {
	line-height: 2;
	font-size: 1.2vw;
	font-family: 'Poppins', sans-serif;
	margin-bottom: 0.5vw;
	border-radius: 0.4vw;
	outline: none;
}
#sds-section-contact-form input {
	width: 20vw;
	padding: 0 1vw;
}
#sds-section-contact-form textarea {
	width: 25vw;
	padding: 0.3vw 1vw;
}
#sds-contact-form-address {
	display: none;
}
#sds-section-contact-form input:focus,
#sds-section-contact-form textarea:focus {
	outline: 2px solid var(--sds-blue-3);
}
#sds-section-contact-form button {
	color: var(--sds-not-quite-white);
	background-color: var(--sds-blue-2);
	font-family: 'Poppins', sans-serif;
	font-size: 1.3vw;
	letter-spacing: 0.05vw;
	width: 7vw;
	line-height: 2;
	padding: 0 1.5vw;
	margin: 0.5vw 0 1vw 1vw;
	border: none;
	text-transform: uppercase;
	cursor: pointer;
}
#sds-turnstile-widget-container {
	display: none;
}
#sds-footer-container {
	width: 60vw;
	margin: 0.5vw auto;
}
#sds-footer {
	display: flex;
	height: 2.5vw;
	justify-content: center;
	align-items: flex-end;
	text-transform: uppercase;
	font-size: 1vw;
	letter-spacing: 0.1vw;
	border-top: 0.15vw solid var(--sds-kinda-grey);
}
#sds-section-error-container {
	display: flex;
	align-items: center;
	min-height: 40vw;
}
#sds-error-left-column {
	flex: 4;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sds-error-left-column h1 {
	font-size: 8vw;
	font-weight: 400;
	margin: 0;
}
#sds-error-left-column h2 {
	font-size: 3vw;
	font-weight: 600;
	margin: 0 0 5vw 0;
}
#sds-error-left-column h3 {
	font-size: 1.5vw;
	font-weight: 400;
	margin: 0;
	text-align: center;
}
#sds-error-left-column p:first-of-type {
	margin: 1vw 0 8vw 0;
}
#sds-error-left-column p:nth-of-type(2) {
	margin: 0;
}
#sds-error-left-column a:link, #sds-error-left-column a:visited {
	background-color: var(--sds-blue-2);
	color: var(--sds-not-quite-white);
	padding: 1vw 2vw;
	text-align: center;
	text-decoration: none;
	display: inline-block
}
#sds-error-left-column-body {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
#sds-error-right-column {
	flex: 3;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sds-error-right-column img {
	width: 50vw;
}

/* regular monitor */
@media screen and (max-width: 1600px) {
}

/* tablet */
@media screen and (max-width: 960px) {
	body {
		font-size: 2.5vw;
	}
	#sds-header-flex-container {
		height: 10vw;
	}
	#sds-header-logo {
		flex: 2;
	}
	#sds-header-menu {
		flex: 3;
	}
	#sds-header-logo img {
		width: 35vw;
	}
	#sds-header-menu ul {
		width: 58vw;
	}
	#sds-header-menu ul li a {
		font-size: 2.75vw;
	}
	.sds-body-text h1, .sds-body-text h2 {
		font-size: 5vw;
		margin: 5vw 0;
	}
	.sds-body-text p {
		margin-bottom: 5vw;
	}
	#sds-section-home {
		scroll-margin-top: 10vw;
	}
	#sds-section-services {
		scroll-margin-top: 3vw;
	}
	#sds-section-about {
		scroll-margin-top: 3vw;
	}
	#sds-section-contact {
		scroll-margin-top: 3vw;
	}
	#sds-section-home-flex-container, #sds-section-services-flex-container, #sds-section-about-flex-container, #sds-section-contact-flex-container {
		display: flex;
		flex-direction: column-reverse;
		width: 90vw;
		padding-top: 10vw;
	}
	#sds-section-home-flex-container > div:first-child, #sds-section-services-flex-container > div:first-child, #sds-section-about-flex-container > div:first-child, #sds-section-contact-flex-container > div:first-child {
		flex: initial;
	}
	#sds-section-services-flex-container > div:first-child, #sds-section-contact-flex-container > div:first-child {
		order: 1
	}
	#sds-section-home-flex-container > div:nth-child(2), #sds-section-services-flex-container > div:nth-child(2), #sds-section-about-flex-container > div:nth-child(2), #sds-section-contact-flex-container > div:nth-child(2) {
		flex: initial;
	}
	#sds-section-home-flex-container img, #sds-section-about-flex-container img, #sds-section-services-flex-container img, #sds-section-contact-flex-container img {
		max-width: 35vw;
	}
	#sds-section-services-flex-container {
		margin: 5vw auto 6vw auto;
	}
	#sds-section-services-flex-container h2 {
		margin: 2vw 0 0 0;
	}
	#sds-section-services-flex-container h3 {
		font-size: 3vw;
	}
	#sds-section-services-flex-container ul {
		width: 80vw;
	}
	#sds-section-services-flex-container li {
		padding-bottom: 2vw;
	}
	#sds-section-services-flex-container li::before {
		width: 6vw;
		top: 0.75vw;
		left: -4vw;
	}
	#sds-section-services-flex-container li p {
		font-size: 2vw;
	}
	#sds-brags-everything {
		font-size: 2.5vw;
		margin: 3vw;
	}
	#sds-brags-list {
		flex-direction: column;
		width: 85vw;
	}
	.sds-site-brag {
		flex-direction: initial;
		width: 85vw;
		margin-bottom: 3vw;
	}
	.sds-site-brag-header {
		display: flex;
		flex-direction: column;
		flex: 0 0 22vw;
	}
	.sds-brag-icon {
		height: 5vw;
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: end;
		border-radius: calc(1vw - 1px) 0 0 0;
	}
	.sds-brag-icon img {
		width: 5vw;
	}
	.sds-brag-label {
		font-size: 2.5vw;
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: start;
		border-radius: 0 0 0 calc(1vw - 1px);
	}
	.sds-brag-body {
		font-size: 2vw;
		text-align: left;
		padding: 0.5vw 2vw;
	}
	#sds-section-contact-flex-container img {
		max-width: 30vw;
	}
	#sds-section-contact-flex-container h1 {
		font-size: 4vw;
	}
	#sds-section-contact-flex-container h2 {
		font-size: 2.75vw;
		line-height: normal;
		margin: 2.25vw 0;
	}
	#sds-section-contact-flex-container p {
		margin: 0.25vw 0.25vw 2vw 0.25vw;
	}
	#sds-section-contact-line {
		width: 8vw;
	}
	#sds-contact-letstalk-container > p {
		font-size: 4vw;
		margin: 5vw 0 0.5vw 0;
	}
	#sds-section-contact-form {
		width: 60vw;
		align-items: center;
	}
	#sds-section-contact-form input, #sds-section-contact-form textarea {
		width: 60vw;
		font-size: 2.5vw;
		margin-bottom: 1vw;
	}
	#sds-section-contact-form button {
		font-size: 2.75vw;
		width: 15vw;
	}
	#sds-footer-container {
		width: 80vw;
		margin: 1vw auto;
	}
	#sds-footer {
		height: 4vw;
		font-size: 1.75vw;
		border-top: 0.3vw solid var(--sds-kinda-grey);
	}
	#sds-section-error-container {
		flex-direction: column-reverse;
		min-height: 100vw;
		margin-top: 5vw;
	}
	#sds-error-left-column h1 {
		font-size: 10vw;
	}
	#sds-error-left-column h2 {
		font-size: 5vw;
		margin: 0 0 10vw 0;
	}
	#sds-error-left-column h3 {
		width: 95vw;
		font-size: 2.5vw;
	}
	#sds-error-left-column p:first-of-type {
		margin: 3vw 0 20vw 0;
	}
	#sds-error-left-column p:nth-of-type(2) {
		margin-bottom: 2vw;
	}
}

/* mobile */
@media screen and (max-width: 640px) {
	body {
		font-size: 4.5vw;
	}
	#sds-header-flex-container {
		height: 20vw;
	}
	#sds-header-logo img {
		width: 70vw;
	}
	#sds-header-menu {
		display: none;
	}
	#sds-mobile-menu {
		display: none;
		position: absolute;
		top: 100%;
		right: 0;
		width: 40vw;
		z-index: 999;
	}
	#sds-mobile-menu.open {
		display: block;
	}
	#sds-mobile-burger {
		display: block;
		padding: 0 5vw;
		background: none;
		border: none;
		font-size: 10vw;
		cursor: pointer;
	}
	#sds-mobile-menu ul {
		font-size: 5vw;
		font-weight: 700;
		letter-spacing: 0.1vw;
		list-style: none;
		padding: 0;
		margin: 0;
		background: var(--sds-not-quite-white);
		box-shadow: 0px 2vw 2.5vw -0.5vw rgba(0,0,0,0.2);
	}
	#sds-mobile-menu li {
		border-bottom: 1px solid #ccc;
	}
	#sds-mobile-menu a {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 5vw;
		text-decoration: none;
		color: var(--sds-blue-1);
	}
	#sds-mobile-menu a.active {
		color: var(--sds-blue-3);
	}
	#sds-section-home {
		scroll-margin-top: 21vw;
	}
	#sds-section-services {
		scroll-margin-top: 16vw;
	}
	#sds-section-about {
		scroll-margin-top: 17vw;
	}
	#sds-section-contact {
		scroll-margin-top: 16vw;
	}
	#sds-section-home-flex-container, #sds-section-services-flex-container, #sds-section-about-flex-container, #sds-section-contact-flex-container {
		padding: 10vw 0;
		width: 100%;
	}
	#sds-section-home-flex-container, #sds-section-about-flex-container, #sds-section-contact-flex-container {
		border-radius: 0;
	}
	#sds-section-home-flex-container .sds-body-text, #sds-section-about-flex-container .sds-body-text {
		padding-left: 3vw;
		padding-right: 3vw;
	}
	#sds-section-home-flex-container img, #sds-section-about-flex-container img {
		max-width: 50vw;
	}
	#sds-section-services-flex-container img, #sds-section-contact-flex-container img {
		max-width: 45vw;
	}
	.sds-body-text h1, .sds-body-text h2 {
		font-size: 8vw;
		margin: 2vw 0;
	}
	.sds-body-text p {
		margin-bottom: 2vw;
	}
	#sds-section-services-flex-container {
		margin: 15vw auto;
	}
	#sds-section-services-flex-container h2 {
		margin: 2vw 0;
	}
	#sds-section-services-flex-container h3 {
		font-size: 5vw;
		margin-top: 5vw;
	}
	#sds-section-services-flex-container ul {
		width: 85vw;
		margin-left: 5vw;
	}
	#sds-section-services-flex-container li::before {
		width: 10vw;
		top: 0.25vw;
		left: -7vw;
	}
	#sds-section-services-flex-container li p {
		font-size: 4vw;
		line-height: 1.25;
	}
	#sds-brags-everything {
		font-size: 4.5vw;
		margin: 10vw 1vw 3vw 1vw;
	}
	#sds-brags-list {
		width: 90vw;
	}
	.sds-site-brag {
		width: 90vw;
		margin-bottom: 5vw;
		box-shadow: 0px 2vw 2.5vw -0.5vw rgba(0,0,0,0.2);
	}
	.sds-site-brag-header {
		flex: 0 0 28vw;
	}
	.sds-brag-icon img {
		width: 10vw;
	}
	.sds-brag-label {
		font-size: 4vw;
	}
	.sds-brag-body {
		font-size: 4vw;
		padding: 1vw 3vw;
	}
	#sds-brags-imagine {
		font-size: 4.5vw;
		margin: 0 1vw 10vw 1vw;
	}
	#sds-section-contact-flex-container img {
		max-width: 50vw;
	}
	#sds-section-contact-flex-container h1 {
		font-size: 7vw;
	}
	#sds-section-contact-flex-container h2 {
		font-size: 5vw;
		margin: 4vw 0;
	}
	#sds-section-contact-line {
		width: 15vw;
	}
	#sds-section-contact-flex-container p {
		font-size: 4.5vw;
	}
	#sds-contact-letstalk-container > p {
		font-size: 7vw;
		margin: 2vw 0 0.5vw 0;
	}
	#sds-section-contact-form {
		width: 80vw;
	}
	#sds-section-contact-form input, #sds-section-contact-form textarea {
		width: 80vw;
		font-size: 4.5vw;
		line-height: 2.25;
		margin-bottom: 1.5vw;
	}
	#sds-section-contact-form button {
		font-size: 5vw;
		width: 25vw;
	}
	#sds-footer-container {
		width: 90vw;
		margin: 2vw auto;
	}

	#sds-footer {
		font-size: 3vw;
		height: 6vw;
	}
	#sds-section-error-container {
		margin-top: 2vw;
	}
	#sds-error-right-column img {
		width: 80vw;
	}
	#sds-error-left-column h1 {
		font-size: 15vw;
	}
	#sds-error-left-column h2 {
		font-size: 6vw;
	}
	#sds-error-left-column h3 {
		font-size: 4.5vw;
	}
}