/*
Theme Name: NYC Tech
Author: Andrew Woods
Author URI: http://andrewwoods.net/
Version: 1.0.0
Description: A 2026 fork of my Aquatech theme, updated for New York, my forever city.
*/

:root {

	/*
	 * Grayscale Colors
	 * ================
	 *
	 * Gray is a color
	 * Grey is a colour
	 */
	--gray90: #e5e5e5;
	--grey90: #e5e5e5;
	--gray80: #cccccc;
	--grey80: #cccccc;
	--gray70: #b3b3b3;
	--grey70: #b3b3b3;
	--gray60: #999999;
	--grey60: #999999;
	--gray50: #7f7f7f;
	--grey50: #7f7f7f;
	--gray40: #666666;
	--grey40: #666666;
	--gray30: #4d4d4d;
	--grey30: #4d4d4d;
	--gray20: #333333;
	--grey20: #333333;
	--gray10: #1a1a1a;
	--grey10: #1a1a1a;

	/*
	 * Opacity
	 * =======
	 */
	--high-opacity: 0.90;
	--medium-opacity: 0.80;
	--low-opacity: 0.55;

	--default-opacity: var(--medium-opacity);
	--alt-opacity: var(--high-opacity);

	/*
	 * Debug Colors
	 * ============
	 */
	--debug-color1: #F0C;
	--debug-color2: #0AF;
	--debug-color3: #0F0;

	/*
	 * Brand Colors
	 * ============
	 */
	--bright-white: #ffffff;
	--white: #f0f0f0;
	--red-light: #ff6060;
	--red: #BB4545;


	--blue: rgb(9, 60, 110);
	--blue-dark: rgb(7, 48, 88);
	--blue-darker: rgb(4, 32, 58);
	--blue-dark-trans: rgba(9, 60, 110, var(--medium-opacity));
	--aqua2: #064456;
	--aqua2-trans: rgba(6, 68, 86, var(--medium-opacity));
	--aqua3: #096A86;
	--aqua3-trans: rgba(9, 96, 110, var(--medium-opacity));
	--aqua7: #00363C;
	--aqua-light: #A0E8FF;

	--green: #08e955;
	--purple: #BDA6C5;
	--purple-dark: #36243C;
	--purple-light: #F4A9FB;
	--amber5: #EF6238;
	--amber6: #FF7F60;
	--orange-dirty: #9A6009;

	--yellow: #E9CB79;
	--yellow-light: #F0DBA1;
	--yellow-dark: #D9B144;

	/*
	 * SPACING LEGEND
	 * ==============
	 */

	--spacing-small: 0.2em;
	--spacing-medium: 0.5em;
	--spacing-large: 1em;

	--padding-medium: 0.8em;


	/*
	 * FONT LEGEND
	 * ===========
	 */

	--sans-inter: "Inter";
	--sans-fira: "Fira Sans";
	--sans-default: Verdana, Tahoma, sans-serif;
	--sans-family: var(--sans-fira), var(--sans-inter), var(--sans-default);

	--serif-didot: Didot, "Didot LT STD";
	--serif-times: "Times New Roman";
	--serif-default: Georgia, serif;
	--serif-family: var(--serif-didot), var(--serif-times), var(--serif-default);

	--fixed-fira-code: "Fira Code";
	--fixed-default: "Menlo", "Consolas", "monospace";
	--mono-family: var(--fixed-fira-code), var(--fixed-default);

	--font-size-default: 16px;
	--line-height-base: 1.6;


	/*
	 * BRAND LEGEND
	 * ============
	 */

	--body-font-family: var(--sans-family);
	--body-font-size: var(--font-size-default);
	--body-bg-color: var(--blue-darker);
	--body-text-color: var(--white);

	--heading-font-family: var(--serif-family);

	--code-font-family: var(--mono-family);

	--link-normal-color: lighten(var(--amber6), 10%);
	--link-normal-bgcolor: transparent;
	--link-visited-color: lighten(var(--amber6), 20%);
	--link-visited-bgcolor: transparent;
	--link-active-color: var(--red-light);
	--link-active-bgcolor: var(--white);
	--link-hover-color: var(--red-light);
	--link-hover-bgcolor: var(--white);
	--link-focus-color: var(--red-light);
	--link-focus-bgcolor: var(--white);

	--selection-color: var(--grey90);
	--selection-bgcolor: var(--orange-dirty);

}

/* END OF LEGEND */

html {
	font-size: var(--font-size-default);
}

body {
	font-family: var(--body-font-family);
	font-weight: initial;
	line-height: var(--line-height-base);
}

* {
	margin: 0;
	padding: 0;
	/* apply a natural box layout model to all elements */
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}


a[href$=".pdf"]:after {
	content: " (PDF)";
}

a[href$=".doc"]:after {
	content: " (DOC)";
}

a[href$=".xls"]:after {
	content: " (XLS)";
}

a[href$=".pdf"][data-size]:after {
	content: " (PDF, " attr(data-size) ")";
}

a[href$=".doc"][data-size]:after {
	content: " (DOC, " attr(data-size) ")";
}

a[href$=".xls"][data-size]:after {
	content: " (XLS, " attr(data-size) ")";
}

dl {
	margin-left: 0;
}

dt {
	font-weight: bold;
}

dd {
	padding-left: 1rem;
}

ul {
	list-style-position: inside;
	list-style-type: square;
	margin-left: 0;

	ol {
		margin-left: 1.6rem;
	}

	ul {
		margin-left: 1.6rem;
		list-style-type: disc;

		ul {
			list-style-type: square;

			ul {
				list-style-type: disc;
			}
		}
	}
}

ul.no-bullets {
	list-style-type: none;
}

ul.flat li {
	display: inline-block;
}

ul.inline {
	display: inline-block;
}

ol {
	list-style-position: inside;
	list-style-type: decimal-leading-zero;
	margin-left: 0;

	ul {
		margin-left: 1.6rem;
	}

	ol {
		margin-left: 1.6rem;
		list-style-type: decimal-leading-zero;

		ol {
			list-style-type: decimal-leading-zero;
		}
	}
}

p,
div.public-DraftStyleDefault-block {
	margin: 1em 0;
	padding: var(--spacing-medium) 0;
	word-wrap: break-word;
}

p,
div.public-DraftStyleDefault-block,
dl,
dt,
dd,
ol,
ul,
li {
	font-family: var(--body-font-family);
	font-size: 1.1rem;
}

.caps {
	text-transform: uppercase;
}

.clean {
	list-style-type: none;
}


.completed {
	text-decoration: line-through;
}

.no-border {
	border: none !important;
}

.shaded {
	background-color: var(--gray90);
}

.shaded .medium {
	background-color: var(--gray90);
}

.shaded .dark {
	background-color: var(--gray10);
	color: var(--bright-white);
}

.message,
.error,
.success,
.warning,
.no-comments {
	background-color: #00309f;
	color: #d8ebfa;
	margin: 1em 0;
	padding: var(--spacing-medium);
	border-radius: 6px;
}

.message p,
.error p,
.success p,
.warning p,
.no-comments p,
.message div,
.error div,
.success div,
.warning div,
.no-comments div {
	margin: 0.20em 0;
}

.error {
	background-color: #aa0808;
	border: 2px solid #f9bbbb;
	color: #f9bbbb;
}

.success {
	background-color: #008000;
	border: 2px solid #ccf9cc;
	color: #ccf9cc;
}

.warning,
.no-comments {
	background-color: #B49463;
	color: #F9F9E9;
	border: none;
}

.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

.alignnone {
	float: none;
	margin: 0;
}

.alignleft {
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
}

.aligncenter {
	margin-left: auto;
	margin-right: auto;
	display: block;
	float: none;
}

.alignright {
	float: right;
	margin-left: 1em;
	margin-bottom: 1em;
}

.wp-caption-text {
	text-align: left;
}

.boxed,
.boxed-aqua,
.boxed-tinted,
.boxed-special {
	background: var(--blue-dark);
	color: var(--white);
	margin: 1em 0;
	padding: 1em;
}

.boxed-aqua {
	background: var(--blue);
	border-radius: 16px;
	border: none;
}

.boxed {
	font-size: 1.2em;
	margin: 1em 0;
	padding: 1em;
}

.boxed-tinted {
	background: var(--gray10);
	background: linear-gradient(135deg, transparent 16px, var(--gray10) 0) top left,
		linear-gradient(-135deg, transparent 16px, var(--gray10) 0) top right,
		linear-gradient(45deg, transparent 16px, var(--gray10) 0) bottom left,
		linear-gradient(-45deg, transparent 16px, var(--gray10) 0) bottom right;
	background-size: 50% 50%;
	background-repeat: no-repeat;
	border: none;
}

.boxed-special {
	background: var(--aqua2-trans);
	background: linear-gradient(135deg, transparent 30px, var(--aqua2-trans) 0) top left,
		linear-gradient(-135deg, transparent 30px, var(--aqua2-trans) 0) top right,
		linear-gradient(45deg, transparent 30px, var(--aqua2-trans) 0) bottom left,
		linear-gradient(-45deg, transparent 30px, var(--aqua2-trans) 0) bottom right;
	background-size: 50% 50%;
	background-repeat: no-repeat;
	border: none;
}

.mobile-hide {
	display: none;
}

.tablet-hide {
	display: none;
}

.screen-reader-text,
.visually-hidden {
	position: absolute;
	margin: -1px;
	padding: 0;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	border: 0;
}


::-moz-selection {
	color: var(--gray90);
	background-color: var(--red-light);
}

::-webkit-selection {
	color: var(--gray90);
	background-color: var(--red-light);
}

::-o-selection {
	color: var(--gray90);
	background-color: var(--red-light);
}

::-ms-selection {
	color: var(--gray90);
	background-color: var(--red-light);
}

::selection {
	color: var(--gray90);
	background-color: var(--selection-bgcolor);
}

a {
	background-color: transparent;
	font-size: inherit;
}

a:link {
	background-color: transparent;
	color: var(--yellow);
}

/**
* Examine the typography for weirdness.
*/
a:visited {
	background-color: transparent;
	color: var(--yellow-light);
}

a:hover {
	background-color: var(--white);
	color: var(--blue);
}

a:active {
	background-color: var(--yellow-light);
	color: var(--blue-dark);
}

a:focus {
	background-color: var(--yellow-light);
	color: var(--blue-dark);
}


acronym,
abbr {
	color: var(--purple-light);
	text-transform: uppercase;
	font-size: inherit;

	&[title] {
		text-decoration: none;
	}
}

q {
	font-family: var(--mono-family);
	font-size: inherit;
}

aside {
	width: 50%;
	background-color: var(--blue-dark);
	color: var(--white);
	font-size: larger;
	padding: 1em;
	margin: 1em 0;
}

blockquote {
	font-size: 1.2em;
	font-family: var(--serif-family);
	background-color: var(--blue-dark);
	color: var(--white);
	border-radius: 8px;
	padding: var(--spacing-medium);

	p {
		margin-top: 0;
		padding-top: 0;
		font-family: inherit;
		font-size: larger;
	}
}

em {
	color: var(--white);
	font-style: italic;
	font-size: inherit;
}

var {
	color: var(--green);
}

cite {
	font-family: var(--mono-family);
	font-style: normal;
}

form {
	padding: var(--spacing-medium);
	border: 1px solid var(--aqua3);
	width: 100%;
}

form .col1 {
	flex-grow: 1;
}

form .col2 {
	flex-grow: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--heading-font-family);
	line-height: 1.15;
	margin: var(--spacing-small) 0;
	color: var(--white);
}

h1 {
	font-weight: 700;
	font-size: 2.49em;
	margin-top: 0;
	text-shadow: 0px 0px 4px var(--gray10);
}

h1 a,
h1 a:link,
h1 a:visited {
	background-color: transparent;
	text-decoration: none;
}

h1 a:hover,
h1 a:active,
h1 a:focus {
	text-shadow: 0px 0px 4px var(--gray30);
	background-color: transparent;
	color: var(--white);
}

h2 {
	margin-top: 1rem;
	font-size: 2.07em;
}

h2 a,
h2 a:link,
h2 a:visited {
	color: var(--white);
	background-color: transparent;
	text-decoration: none;
}

h2 a:hover,
h2 a:active {
	background-color: transparent;
	color: var(--bright-white);
}

h2 a:focus {
	background-color: transparent;
	color: var(--bright-white);
}

h3 {
	margin-top: 1rem;
	font-size: 1.73em;
}

h3 a,
h3 a:link,
h3 a:visited {
	background-color: transparent;
	text-decoration: none;
	color: var(--white);
}

h3 a:hover,
h3 a:active,
h3 a:focus {
	background-color: transparent;
	color: var(--bright-white);
}

h4 {
	margin-top: 1rem;
	font-size: 1.44em;
}

h4 a,
h4 a:link,
h4 a:visited {
	color: var(--white);
	background-color: transparent;
	text-decoration: none;
}

h4 a:hover,
h4 a:active,
h4 a:focus {
	background-color: transparent;
	color: var(--bright-white);
}

h5 {
	margin-top: 1rem;
	font-size: 1.2em;
}

h5 a,
h5 a:link,
h5 a:visited {
	color: var(--white);
	background-color: transparent;
	text-decoration: none;
}

h5 a:hover,
h5 a:active,
h5 a:focus {
	color: var(--bright-white);
	background-color: transparent;
}

h6 {
	margin-top: 1rem;
	font-size: 1em;
	text-transform: uppercase;
}

h6 a,
h6 a:link,
h6 a:visited {
	color: var(--white);
	background-color: transparent;
	text-decoration: none;
}

h6 a:hover,
h6 a:active,
h6 a:focus {
	color: var(--bright-white);
	background-color: transparent;
}

img.wp-image-907 {
	width: 100% !important;
	height: auto !important;
}

input,
textarea {
	width: 100%;
	font-size: inherit;
	border-top-style: inset;
	border-left-style: inset;
	padding: var(--spacing-small);
	background-color: var(--bright-white);
}

input[type=submit] {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: var(--spacing-medium);
	border-top: 2px solid var(--gray30);
	border-right: 2px solid var(--gray90);
	border-bottom: 2px solid var(--gray80);
	border-left: 2px solid var(--gray40);
}

kbd {
	font-family: var(--mono-family);
	font-size: inherit;
}

label {
	display: block;
	padding: var(--spacing-medium) 0;
}

nav {
	background-color: transparent;
	padding: 0;
	margin: 0;
}

nav ul {
	width: 100%;
	padding: var(--spacing-medium) 0;
}

nav a {
	display: inline-block;
	color: var(--white);
	padding: var(--spacing-medium);
	text-decoration: none;
	text-transform: uppercase;
	font-size: 1em;
	font-family: var(--serif-family);
	width: 100%;
}

nav a:link,
nav a:visited {
	background: var(--blue-darker);
	color: var(--white);
	border: 1px solid var(--blue-dark);
	border-radius: 8px;
}

nav a:hover,
nav a:active,
nav a:focus {
	background: var(--selection-bgcolor);
	color: var(--white);
	border: 1px solid var(--white);
}

nav li {
	list-style-type: none;
	margin: 0;
}

nav li:first {
	padding-left: 0;
}

nav ul ul {
	display: none;
}

nav .sub-menu {
	border-radius: 8px;
}

nav .sub-menu a {
	width: 100%;
	border-collapse: collapse;
}

nav .current-menu-item>a {
	background: var(--blue);
	color: var(--yellow-light);
}

nav .current-menu-item>a:hover,
nav .current-menu-item>a:active,
nav .current-menu-item>a:focus {
	border: 1px solid var(--white);
}

nav .current_page_ancestor li {
	display: block;
}

nav .current_page_ancestor>a {
	background-color: var(--red);
	color: var(--white);
}

nav li:focus,
nav li:hover,
nav li.is-open {
	z-index: 10;
}

nav li:focus ul,
nav li:hover ul,
nav li.is-open ul {
	border: 1px solid var(--aqua3);
	padding: var(--spacing-medium);
	background-color: var(--aqua7);
	top: 1em;
	left: 1em;
	display: block;
	width: 12em;
}

nav li:focus li,
nav li:hover li,
nav li.is-open li {
	display: block;
}

.touch .current-menu-item ul {
	display: block;
}

.skip a {
	background-color: transparent;
	padding: var(--spacing-medium);
	text-decoration: none;
	font-size: 1em;
	font-family: var(--sans-family);
	-moz-border-radius: var(--spacing-small);
	-webkit-border-radius: var(--spacing-small);
	border-radius: var(--spacing-small);
	width: 100%;
}

.skip a:link,
.skip a:visited {
	display: inline-block;
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.skip a:hover,
.skip a:active,
.skip a:focus {
	display: inline-block;
	background-color: var(--red-light);
	color: var(--white);
	border: 1px solid var(--white);
	position: static;
	width: auto;
	height: auto;
}

ol {
	list-style-position: inside;
	font-size: 20px;
}

ol.no-bullets {
	list-style-type: none;
}

ul {
	list-style-position: inside;
}

ul.no-bullets {
	list-style-type: none;

	li {
		padding: 0.5em;
	}
}


ul.wp-block-list {
	list-style-type: none;

	li {
		padding: 0.5em;
	}
}

.taxonomy-list {
	padding: 0.5rem 0;
}

p.special {
	margin: 0 auto;
}

p.special strong {
	color: var(--bright-white);
	background-color: transparent;
}

.home p.special {
	margin-top: 0;
}

pre {
	padding: 6px;
	border-radius: 6px;
	background-color: var(--purple-dark);
	color: var(--white);
	margin: 1em 0;
	font-family: var(--mono-family);
	overflow-x: auto;
}

code,
.code {
	background-color: inherit;
	color: var(--white);
	font-family: var(--mono-family);
	overflow-x: scroll;
}

select {
	width: 100%;
}

strong {
	font-weight: bold;
	font-size: inherit;
}

table {
	margin: 1em 0;
	border-collapse: collapse;
	width: 100%;
}

td {
	padding: var(--spacing-medium);
}

th {
	padding: var(--spacing-medium);
	text-transform: uppercase;
	background-color: var(--gray90);
	color: var(--blue);
}

tr {
	background-color: var(--blue);
	color: var(--white);
}

tr:nth-child(even) {
	background-color: var(--blue-dark);
	color: var(--white);
}

tbody th {
	background-color: var(--gray80);
	color: var(--blue);
}

tbody th a:link {
	color: var(--blue);
}

.wp-block-table.is-style-stripes tbody {

	tr:nth-child(odd) {
		background-color: var(--blue);
		color: var(--white);
	}

	tr:nth-child(even) {
		background-color: var(--blue-dark);
		color: var(--white);
	}
}

textarea {
	width: 100%;
	height: 12em;
}

.alt-blog .photo {
	width: 100%;
}

/*
.borderradius nav {
	@include rounded-corners;
	padding: $spacing-medium;
}
*/
.clean {
	list-style-type: none;
}

.clear {
	clear: both;
}

.clearfix {
	/* For modern browsers */
	/* For IE 6/7 (trigger hasLayout) */
}

.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}

.commentlist {
	border-top: 2px solid var(--amber5);
	list-style-type: none;
	background-color: transparent;
	color: var(--white);
	padding: 0 var(--spacing-medium);
}

.comment {
	border-bottom: 1px solid var(--gray20);
	padding: var(--spacing-medium) 0;
}

.comment.even {
	border-bottom: 1px dashed var(--gray20);
}

.map img {
	width: 100px;
	height: auto;
	display: block;
}

.offscreen {
	display: block;
	text-indent: -9999em;
}

.invisible {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 0;
	height: 0;
	overflow: hidden;
}

/*
*/
.depth-2 {
	padding-left: 4px;
}

.depth-3 {
	padding-left: 8px;
}

.depth-4 {
	padding-left: 12px;
}

.depth-5 {
	padding-left: 16px;
}

.depth-6 {
	padding-left: 20px;
}

.depth-7 {
	padding-left: 24px;
}

.depth-8 {
	padding-left: 28px;
}

.depth-9 {
	padding-left: 32px;
}

.depth-10 {
	padding-left: 36px;
}

.no-comments {
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}

.projects h2 {
	margin-top: 0;
}

.publishing-info {
	font-family: var(--mono-family);
}

.publishing-info img {
	float: left;
	width: 96px;
	margin-right: var(--spacing-small);
	margin-bottom: var(--spacing-small);
}

.publishing-info .p-author {
	line-height: 1;
	display: block;
	margin-bottom: var(--spacing-small);
}

.publishing-info .dt-published {
	display: block;
	margin-bottom: var(--spacing-small);
	font-size: 1rem;
}

.role {
	background-color: var(--amber6);
	padding-left: var(--spacing-medium);
	font-family: var(--sans-family);
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
}

.sidebar .photo {
	margin-right: 0;
}

.sidebar table {
	width: 100%;
}

.sticky-post,
.sticky {
	background-color: var(--purple-dark);
	color: var(--gray90);
}

.technology ul {
	display: inline-block;
}

.technology li {
	display: inline;
}

.contribution ul {
	display: inline-block;
}

.contribution li {
	display: inline;
}

.sidebar .widget {
	width: 100%;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;
	background-color: var(--aqua2);
	border: 1px solid var(--white);
	color: var(--white);
	line-height: 1.6em;
	margin: 0 0 1em;
	padding: var(--spacing-medium);
}

.sidebar .widget h1 {
	color: var(--white);
	text-shadow: none;
}

.sidebar .widget h1 a,
.sidebar .widget h1 a:link,
.sidebar .widget h1 a:visited {
	color: var(--aqua2);
}

.sidebar .widget h2 {
	color: var(--white);
	font-size: 1.2rem;
	text-shadow: none;
}

.sidebar .widget h2 a,
.sidebar .widget h2 a:link,
.sidebar .widget h2 a:visited {
	color: var(--aqua2);
}

.sidebar .widget h3 {
	color: var(--white);
	text-shadow: none;
}

.sidebar .widget h3 a,
.sidebar .widget h3 a:link,
.sidebar .widget h3 a:visited {
	color: var(--aqua3);
}

.sidebar .widget form {
	border: none;
	padding: 0;
}

.sidebar .widget input[type="text"] {
	width: 100%;
}

#brand {
	color: var(--white);
	text-shadow: 0px 0px 8px var(--gray10);
	background-color: transparent;
	display: block;
	padding: 0 0;
	font-size: 1em;
	line-height: 1;
	text-decoration: none;
	font-family: var(--sans-family);
}

#brand img {
	display: block;
	width: 100px;
}

#masthead {
	background-color: transparent;
	color: var(--white);
	margin-bottom: var(--spacing-medium);
}

#footer {
	clear: both;
}

footer {
	.copyright {
		background-color: var(--blue);
		color: var(--white);
	}
}

#main,
section.main {
	width: 100%;
	max-width: 758px;
	margin-left: auto;
	margin-right: auto;
}

#main .content,
section.main .content {
	margin: var(--spacing-medium) 0;
}

#main .home,
section.main .home {
	background-color: transparent;
	min-height: 358px;
	margin-top: 1em;
}

#sidebar-home .content,
#sidebar-blog .content {
	margin-left: 0;
	margin-right: 0;
}

.copyright {
	text-align: center;
}

nav.social-links {
	display: block;
	margin-top: 1em;
	margin-left: auto;
	margin-right: auto;
}

nav.social-links ul {
	width: 320px;
	text-align: center;
}

nav.social-links li {
	width: auto;
	display: inline-block;
}

nav.social-links a {
	display: inline-block;
	padding: 0;
	background: transparent;
}

nav.social-links a:link,
nav.social-links a:visited {
	background: transparent;
	border: none;
}

nav.social-links a:hover,
nav.social-links a:focus,
nav.social-links a:active {
	background: transparent;
	border: none;
}

#main .calls-to-action {
	color: var(--gray20);
	background-color: var(--yellow-dark);
	border-radius: var(--spacing-medium);

	.content {
		margin: 0;

		p {
			padding: 0;
		}
	}
}

.textwidget p {
	padding: var(--padding-medium);
}

#page {
	width: 100%;
}

.page-content {
	margin: 1em 0;
	clear: both;
}

.map img {
	margin: 1em var(--spacing-medium);
	width: 160px;
	height: auto;
	display: block;
}

.button-cta {
	width: 120px;
	text-decoration: none;
	padding: 1em;
}


.button-light,
a.button-light {
	background-color: var(--aqua-light);
	color: var(--aqua2);
}

.rounded {
	border-radius: 4px;
}

@media screen and (min-width: 320px) and (orientation: portrait) {

	body {
		background-color: var(--body-bg-color);
		color: var(--body-text-color);
		background: url(img/bryant-park-snow-2026-winter-mobile.jpg) no-repeat fixed center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	#main {
		width: 100%;
		margin-left: auto;
		margin-right: auto;
	}

	#footer {
		width: 20rem;
		margin-left: auto;
		margin-right: auto;
	}

	#masthead {
		width: 100vw;
		margin-left: auto;
		margin-right: auto;
	}

	nav li {
		display: block;
	}

	nav li:focus ul,
	nav li:hover ul,
	nav li.is-open ul {
		background-color: var(--aqua7);
	}

	#brand img {
		margin-left: auto;
		margin-right: auto;
	}

	p {
		position: relative;
	}
}

/*
Tablet
*/
@media (min-width: 480px) {

	#masthead {
		width: 32rem;
	}

	nav ul {
		padding: 1em 0 var(--spacing-medium);
		margin-left: auto;
		margin-right: auto;
	}

	nav li {
		display: inline;
		width: 100%;
	}

	nav li:focus,
	nav li:hover,
	nav li.is-open {
		position: relative;
	}

	nav li:focus ul,
	nav li:hover ul,
	nav li.is-open ul {
		position: absolute;
		background-color: var(--aqua7);
	}

	nav a {
		padding: var(--spacing-small);
		width: auto;
	}
}

@media (min-width: 640px) {

	#main {
		width: 85%;
		margin-left: auto;
		margin-right: auto;
	}

	#footer {
		width: 25rem;
		margin-left: auto;
		margin-right: auto;
	}

	#masthead {
		width: 32rem;
		margin-left: auto;
		margin-right: auto;
	}

	td.mobile-hide,
	th.mobile-hide {
		display: table-cell;
	}

	td.tablet-hide,
	th.tablet-hide {
		display: none;
	}
}

/*
Desktop
*/
@media screen and (min-width: 768px) and (orientation: landscape) {

	body {
		background: url(img/bryant-park-snow-2026-winter.jpg) no-repeat fixed center center;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}

	.wrap {
		width: 300px;
		height: 300px;
		position: relative;
		transform-style: preserve-3d;
		transition: 0.5s;
		color: var(--bright-white);
	}

	.wrap .face {
		position: absolute;
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		-ms-backface-visibility: hidden;
		-o-backface-visibility: hidden;
		backface-visibility: hidden;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		color: white;
		line-height: 50px;
		text-align: center;
	}

	.wrap .front {
		background-color: var(--debug-color1);
		z-index: 10;
	}

	.wrap .back {
		transform: rotateY(180deg);
		background-color: var(--debug-color3);
	}

	table {
		overflow-x: scroll;
	}

	td.mobile-hide,
	th.mobile-hide {
		display: table-cell;
	}

	td.tablet-hide,
	th.tablet-hide {
		display: table-cell;
	}

	article {
		padding-top: 1em;
		padding-bottom: 1em;
		margin: 0 0 1em;

		aside {
			float: right;
			margin-left: 1em;
			margin-right: 0;
		}
	}

	.form-info {
		width: 50%;
		float: left;
	}

	.form-message {
		width: 50%;
		float: right;
	}

	input[type=submit] {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
	}

	nav ul {
		margin-left: auto;
		margin-right: auto;
	}

	nav li {
		display: inline;
		width: 100%;
	}

	nav a {
		padding: 0.5em;
		width: auto;
	}

	.map img {
		width: 196px;
		height: auto;
	}

	#main {
		width: 80%;
		margin-left: auto;
		margin-right: auto;
	}

	#footer {
		width: 20rem;
		margin-left: auto;
		margin-right: auto;
	}

	#nav {
		width: 700px;
		margin-left: auto;
	}

	#brand img {
		height: auto;
	}

	#masthead {
		width: 758px;
		margin-left: auto;
		margin-right: auto;
	}

	#masthead:before,
	#masthead:after {
		content: " ";
		display: table;
	}

	#masthead:after {
		clear: both;
	}

	.category-haiku .entry {
		width: 70%;
		margin-left: auto;
		margin-right: auto;
	}

	.category-haiku .entry p {
		font-size: 1.6em;
	}

	.home #main p {
		margin-right: 10px;
	}

	.home #main p.special {
		margin-right: auto;
	}

	.home .main .content {
		margin-left: auto;
		margin-right: auto;
		height: 434px;
	}

	.chart {
		float: left;
		margin-right: 1em;
	}

	.widget {
		width: 100%;
	}

	#main {
		margin: 2em auto 1em;
	}

	#sidebar-home,
	#sidebar-blog {
		width: 29.9%;
		float: right;
	}

	#sidebar-home .content,
	#sidebar-blog .content {
		margin-left: 0;
		margin-right: 0;
	}
}