@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400&family=Voltaire&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Gothic+A1:wght@100;200;300;400;500;600;700;800;900&display=swap');


:root {
	--color-primary: #6e584e;   /* Dark Blonde */
	--color-secondary: #ecc242; /* Yellow */
	--color-tertiary: #424e5e; /* Blue Shoes */
}

body {
	color: #333;
	overflow: scroll;
}

a {
	color: var(--color-primary);
	/* color: #19888C; */
	text-decoration: none;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
}

a:hover, a:empty, a:focus {
	color: var(--color-secondary);
	/* color: #F2B705;
	/* color: rgb(230, 119, 115); */
	letter-spacing: 1px;
	cursor: pointer;
	transition: all 0.2s ease-in-out;
}

a.linkColor:hover {
	letter-spacing: .3px;
}

p.main a, p.exSubTitle a {
	text-decoration: underline;
}
	p.main a:hover, p.exSubTitle a:hover {
	text-decoration: none;
}

#wrapper {
	display: flex;
	margin: 0 auto;
	background: #fff;
	padding: 36px 36px 36px 0px;
	max-width: 932px;
}

.left-column {
	display: block;
	flex: 0 0 32%;
	max-width: 298px;
	background: #fff;
}

.right-column {
	flex: 1;
	background: #fff;
	/* border: 1px solid #ddd; 
	border-radius: 9px;
	box-shadow: 4px 4px 24px -6px #ddd; */
	transition: all .8s ease;
}

.right-column:hover {
	/* box-shadow: 0px 0px 24px -12px #F2B705; */
	transition: all .5s ease;
}

.content {
	padding: 0 0 0 2em;
}

.footer {
	display: block;
	width: 100%;
	font-family: Roboto, sans-serif;
	color: #aaa;
	text-transform: uppercase;
	text-align: center;
	font-weight: 300;
	font-size: .675em;
	line-height: 1.5em;
	letter-spacing: 1px;
	margin-top: 0px;
	text-size-adjust: none;
}

/* SOCIAL ICONS */
.social-icons {
	display: flex;
	gap: .5rem;
	margin-top: -.25rem;
}

.icon svg {
  height: 1rem;         /* Set consistent height */
  width: auto;          /* Preserve aspect ratio */
  display: block;       /* Prevent extra spacing */
  vertical-align: middle;
  transition: color 0.3s ease, transform 0.3s ease;
  color: #aaa; /* default */
}

.icon:hover svg {
  color: #ff5500; /* highlight color on hover */
  transform: scale(1.1);
}

.icon.instagram svg {
  transform: translateY(0px) scale(0.6);
  transition: color 0.3s ease, transform 0.3s ease;
}

.icon.bandcamp svg {
  transform: translateY(0px) scale(1.05);
  transition: color 0.3s ease, transform 0.3s ease;
}

.icon.soundcloud svg {
  transform: translateY(0px) scale(1.15);
  transition: color 0.3s ease, transform 0.3s ease;
}

.icon.spotify svg {
  transform: translateY(0px) scale(1);
  transition: color 0.3s ease, transform 0.3s ease;
}

.icon.youtube svg {
  transform: translateY(0px) scale(1);
  transition: color 0.3s ease, transform 0.3s ease;
}

.icon-circle {
  width: 1.75rem;
  height: 1.75rem;
  background-color: #eee;     /* Circle color */
  border-radius: 50%;         /* Makes it a circle */
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s ease, background 0.3s ease;
  overflow: hidden;
}

.icon-circle svg {
  width: .875rem;
  height: .875rem;
  fill: #333;  /* SVG icon color */
  transition: fill 0.3s ease;
}

.icon-circle:hover svg {
  fill: white;                /* SVG color on hover */
}


.instagram:hover    { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285AEB 90%);  }
.bandcamp:hover     { background-color: #629AA9; }
.soundcloud:hover   { background-color: #ff5500; }
.spotify:hover   	{ background-color: #1ED760; }
.youtube:hover   	{ background-color: #FF0000; }


/* Starting Display States */
.table-mini {
	display: none;
}
#About {
	display: block;
}
#Updates {
	display: none;
}
#Discography {
	display: none;
}
#ScoredToPicture {
	display: none;
}


/* INIGO ANIMATION */
/*
#Reveal-1, #Reveal-2, #Reveal-3, #Reveal-4, #Reveal-5 {
	height: 0px;
	overflow-y: hidden;
	transition-delay: .25s;
	transition-property: height;
	transition-duration: .8s;
	transition-timing-function: ease;
}

.right-column:hover .fadeName {
	color: #fff;
	transition-delay: 0s;
	transition-property: color;
	transition-duration: .8s;
	transition-timing-function: ease;
}

.fadeName {
	color:#333;
	transition-delay: .25s;
	transition-property: color;
	transition-duration: .8s;
	transition-timing-function: ease;
}

.right-column:hover #Reveal-1 {
	transition-delay: .4s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 32px;	
}

.right-column:hover #Reveal-2 {
	transition-delay: 1.8s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 40px;	
}

.right-column:hover #Reveal-3 {
	transition-delay: 3.3s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 40px;	
}

.right-column:hover #Reveal-4 {
	transition-delay: 5.75s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 40px;	
}

.right-column:hover #Reveal-5 {
	transition-delay: 13s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 40px;	
}

span.myname {
	margin-top:0px;
	font-family: Roboto;
	font-weight: 300;
	font-size: .875em;
	line-height: 1.875em;
	letter-spacing: .4px;
}

.myname span {
	color: #fff;
	transition-delay: 0s;
	transition-property: color;
	transition-duration: .8s;
	transition-timing-function: ease;
}

.right-column:hover .myname-1 {
	color: #333;
	transition-delay: .45s;
	transition-property: color;
	transition-duration: 1s;
	transition-timing-function: ease;
}
.right-column:hover .myname-2 {
	color: #333;
	transition-delay: .7s;
	transition-property: color;
	transition-duration: 1s;
	transition-timing-function: ease;
}
.right-column:hover .myname-3 {
	color: #333;
	transition-delay: .85s;
	transition-property: color;
	transition-duration: 1s;
	transition-timing-function: ease;
}
.right-column:hover .myname-4 {
	color: #333;
	transition-delay: 1.1s;
	transition-property: color;
	transition-duration: 1s;
	transition-timing-function: ease;
}
.right-column:hover .myname-5 {
	color: #333;
	transition-delay: 1.35s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
}

.inigo {
	display: block;
	margin-top:6px;
	font-family: Roboto;
	font-weight: 300;
	font-size: .875em;
	line-height: 1.875em;
	letter-spacing: .4px;
	text-align: justify;
	text-justify: inter-word;
	text-size-adjust: none;
	
}

.inigo span {
	color: #fff;
	transition-delay: 0s;
	transition-property: color;
	transition-duration: .8s;
	transition-timing-function: ease;
}

.right-column:hover .inigo span.im-1a {
	color: #333;
	transition-delay: 2s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-1b {
	color: #333;
	transition-delay: 2.25s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-1c {
	color: #333;
	transition-delay: 2.5s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-1d {
	color: #333;
	transition-delay: 2.75s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-2a {
	color: #333;
	transition-delay: 3.55s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-2b {
	color: #333;
	transition-delay: 3.8s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-2c {
	color: #333;
	transition-delay: 4.1s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-2d {
	color: #333;
	transition-delay: 4.4s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-2e {
	color: #333;
	transition-delay: 4.8s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}

.right-column:hover .inigo span.im-3a {
	color: #333;
	transition-delay: 6s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}

.right-column:hover .inigo span.im-3b {
	color: #333;
	transition-delay: 6.25s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}

.right-column:hover .inigo span.im-3c {
	color: #333;
	transition-delay: 6.65s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}

.right-column:hover .inigo span.im-3d {
	color: #333;
	transition-delay: 6.9s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-3e {
	color: #333;
	transition-delay: 7.05s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}
.right-column:hover .inigo span.im-3f {
	color: #333;
	transition-delay: 7.3s;
	transition-property: color;
	transition-duration: 1.25s;
	transition-timing-function: ease;
	}

.right-column:hover .inigo span.im-4 {
	color: #333;
	transition-delay: 13.3s;
	transition-property: color;
	transition-duration: 1.5s;
	transition-timing-function: ease;
	}
*/
/* END INIGO MONTOYA TEXT */



p.main {
	font-family: Roboto, sans-serif;
	font-weight: 300;
	font-size: .875em;
	line-height: 1.875em;
	letter-spacing: .4px;
	text-align: justify;
	text-justify: inter-word;
	text-size-adjust: none;
}

p.name {
	font-family: Voltaire, sans-serif;
	font-weight: 900;
	font-size: 2.25em;
	margin-top: -14px;
	margin-left: -2px;
	text-transform: uppercase;
	text-size-adjust: none;
}

p.name span.Robert {
	transition: all 0.2s ease-in-out;
}
p.name span.Robert:hover {
	color: var(--color-secondary);
	/* color: #F2B705; */
	/* color: rgb(230, 119, 115); */
	cursor: grab;
	letter-spacing: 1.7px;
}
p.name span.Pirogovsky {
	color: var(--color-primary);
	/* color: #19888C; */
	transition: all 0.2s ease-in-out;
}
p.name span.Pirogovsky:hover {
	color: var(--color-secondary);
	/* color: #F2B705; */
	/* color: rgb(230, 119, 115); */
	cursor: grab;
	letter-spacing: 1.7px;
}
p.name:hover {
	color: color: var(--color-secondary);
	/* color: #19888C; */
	cursor: grab;
}

p.description {
	font-family: Roboto, sans-serif;
	font-weight: 300;
	font-size: .75em;
	line-height: 1.3em;
	letter-spacing: .2px;
	margin-top: 0px;
	text-size-adjust: none;
}

.about-sub {
	font-size: .875em;
	text-decoration: underline;
}

.working-title {
	transition: all 0.2s ease-in-out;
	text-transform: uppercase
}
.working-title:hover {
	/* letter-spacing: .4px;
	cursor: grab; */
	color: color: var(--color-secondary);
	/* color: #F2B705; */
}

.email {
	transition: all 0.2s ease-in-out;
	color: #777;
	font-weight: 100;
	font-family: Roboto, sans-serif;
	font-size: .75em;
	line-height: 1.3em;
	letter-spacing: .2px;
	margin-top: -40px;
	text-size-adjust: none;
	
}
.email:hover {
	font-weight: 300;
	color: color: var(--color-secondary);
	/* color: #19888C; */
}

.table {
	margin: 0 6px 0 0;
}

ul.navigation {
	font-family: Roboto, sans-serif;
	font-weight: 300;
	font-size: .875em;
	line-height: 1.5em;
	list-style-type: none;
	letter-spacing: .3px;
	margin-top: 36px;
	padding: 0 0 0 0;
	text-align: right;
	text-size-adjust: none;
}

	li.video-desktop {
		display: inline;
	}
	li.video-mobile {
		display: none;
	}

.sticky-div {
	position: sticky;
	position: -webkit-sticky;
	top: 16px;
}

p.category {
	font-family: Roboto, sans-serif;
	text-transform: uppercase;
	font-weight: 100;
	font-size: .875em;
	color: #555;
	line-height: 1.5em;
	letter-spacing: 2px;
	text-align: left;
	margin-top: 30px;
	transition: all .8s ease;
	text-size-adjust: none;
}

span.hello, span.profession, span.job-title-a, span.job-title-b, span.job-title-c, span.job-title-d, img.photo {
	transition-delay: .25s;
	transition: all .8s ease;
}

.right-column:hover span.hello {
	font-size: 1.25em;
	font-weight: 500;
	letter-spacing: .3px;
	color: var(--color-secondary);
	/* color: #F2B705; */
	transition: all .5s ease;
	text-size-adjust: none;
}

.right-column:hover img.photo {
	box-shadow: 0px 0px 18px -6px var(--color-secondary);
	border-radius: 9px;
	transition: all .5s ease;
}


img.photo {
	border-radius: 9px;
	float: right;
	max-height: 332px;
	margin: -30px 0px 12px 2.25em;
}

div.fb-video, div.fluid-vid {
	transition: all .8s ease;
}
div.fb-video:hover, div.fluid-vid:hover {
	box-shadow: 0px 0px 18px -6px #F2B705;
	transition: all .5s ease;
}

.update-img {
	width: 100%;
	border-radius: 9px 9px 0 0;
}

.album-img {
	width: 100%;
	border-radius: 4.5px 4.5px 0 0;
}

.quote {
	width: 82%;
	margin: 0 auto;
	font-family: Roboto, sans-serif;
	font-weight: 300;
	color: #999;
	text-align: center;
    font-style: italic;
    font-size: .875em;
    line-height: 1.5em;
	letter-spacing: .02em;
}

/*
.right-column:hover .category {
	font-size: 1.125em;
	font-weight: 500;
	letter-spacing: .3px;
	line-height: 1em;
	color: #19888C;
	transition: all .5s ease;
}

.right-column:hover span.profession {
	font-weight: 500;
	color: #19888C;
	transition: all .5s ease;
	transition-delay: .75s;
}

.right-column:hover span.job-title-a {
	font-weight: 500;
	letter-spacing: .3px;
	color: #19888C;
	transition: all 1s ease;
	transition-delay: 2.35s;
}

.right-column:hover span.job-title-b {
	font-weight: 500;
	letter-spacing: .3px;
	color: #19888C;
	transition: all 1s ease;
	transition-delay: 2.95s;
}

.right-column:hover span.job-title-c {
	font-weight: 500;
	letter-spacing: .3px;
	color: #19888C;
	transition: all 1s ease;
	transition-delay: 3.55s;
}

.right-column:hover span.job-title-d {
	font-weight: 500;
	letter-spacing: .3px;
	color: #19888C;
	transition: all 1s ease;
	transition-delay: 4.15s;
}
*/
.add-wrap {
	width: 100%;
}
.fluid-vid {
    overflow:hidden;
    padding-bottom:56.25%; /*16:9*/
    position:relative;
    height:0;
}
.fluid-vid iframe {
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}

.video-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  align-items: flex-start; /* ensures no stretch */
  padding: 0;
  margin: 0;
}

.video-block {
  display: flex;
  flex-direction: column; /* stack video + caption */
  align-items: center;
  width: 48%;
  box-sizing: border-box;
}

.fluid-vid-4x5 {
  position: relative;
  width: 48%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  box-sizing: border-box;
}

.fluid-vid-4x5 iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.fluid-vid-1x1 {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.fluid-vid-1x1 iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.exTitle {
	font-family: Voltaire, sans-serif;
	font-weight: 300;
	font-size: 1.75em;
	font-style: normal;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .3px;
	line-height: 1.125em;
	color: #444;
	margin-top: -12px;
	margin-bottom: 12px;
	text-size-adjust: none;
}
.exSubTitle {
	font-family: Roboto, sans-serif;
	font-weight: 300;
	font-size: .75em;
	font-style: normal;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .3px;
	line-height: 1.2em;
	color: #888;
	margin-top:6px;
	margin-bottom:0px;
	text-size-adjust: none;
}
.exDescription {
	padding-bottom: 1px;
}

.smallCredit {
	font-size:.75em;
}


/* INSTAGRAM VIDEOS */
.instagram-media {
	max-width: 47.5% !important;
	min-width: 40% !important;
}

#instagram-embed-0 {
	float: left;
}

#instagram-embed-1 {
	float: right;
}
.clear {
	clear: both;
}

/* INSTAGRAM VIDEOS */
.4x5 {
	display: block;
	position: relative !important;
	max-width: 47.5% !important;
	min-width: 40% !important;
}

#4x5-0 {
	float: left;
}

#4x5-1 {
	float: right;
}
.clear {
	clear: both;
}


/* DEVICES */
@media only screen and (max-width: 1126px) {
	#wrapper {
		display: block;
		margin: 0 auto;
		background: #fff;
		padding: 48px 0;
		max-width: 828px;
	}
	
	.social-icons {
		justify-content: center;
		margin: 0 auto;
		padding-top: 0px;
		padding-bottom: 9px;
		gap: .875rem;
  	}
	
	.icon-circle {
		width: 2.25rem;
		height: 2.25rem;
		background-color: #eee;     /* Circle color */
		border-radius: 50%;         /* Makes it a circle */
		display: flex;
		align-items: center;
		justify-content: center;
 		transition: background-color 0.3s ease;
		overflow: hidden;
	}

	.icon-circle svg {
		width: 1.125rem;
		height: 1.125rem;
		transition: fill 0.3s ease;
	}
	
	.left-column {
		display: inline-block;
		width: 100%;
		max-width: 100%;
		text-align: center;
		background: #fff;
	}
	.right-column {
		flex: 1;
	}
	.content {
		padding: 0;
	}
	p.name {
		font-size: 3.33em;
		margin-bottom: .75em;
		text-size-adjust: none;
	}
	p.description {
		font-size: 1.125em;
		line-height: 1.33rem;
		font-weight: 300;
		margin-top: 0px;
		text-size-adjust: none;
	}
	p.email {
		font-size: 1.125em;
		line-height: 1.3em;
		font-weight: 300;
		margin-top: -44px;
		text-size-adjust: none;
	}
	
	.table {
		display: table;
		margin: 0 auto;
	}
	ul.navigation {
		font-size: 1.125em;
		font-weight: 300;
		list-style: none;
		margin-top: 12px;
		margin-left: -14px;
		padding: 0 0;
		text-size-adjust: none;
	}
		li {
			display: inline;
			margin-left: 1em;
		}
		li:first-child {
			display: inline;
			margin-left: 1em;
		}
		li.video-desktop {
			display: none;
		}
		li.video-mobile {
			display: inline;
		}
	
	.right-column {
		display: block;
		padding: 0 2.25em;
		background: #fff;
		border: none;
		box-shadow: none;
	}
	.right-column:hover {
		box-shadow: none;
	}
	p.category {
		font-size: 1.125em;
		font-weight: 100;
		color: #555;
		text-size-adjust: none;
	}
	p.main, span.myname, span.inigo {
		font-size: 1em;
		font-weight: 300;
		text-size-adjust: none;
	}
	p.exTitle {
		font-size: 2.5em;
		font-weight: 600;
	}
	p.exSubTitle {
		font-size: .85em;
		text-size-adjust: none;
		margin-bottom: 0px;
	}
	
	img.photo {
		max-height: 392px;
		margin: 0px 0px 12px 2.25em;
	}
	
	.right-column:hover #Reveal-1 {
	transition-delay: .4s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 42px;	
}

.right-column:hover #Reveal-2 {
	transition-delay: 1.8s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 48px;	
}

.right-column:hover #Reveal-3 {
	transition-delay: 3.3s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 48px;	
}

.right-column:hover #Reveal-4 {
	transition-delay: 5.75s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 48px;	
}

.right-column:hover #Reveal-5 {
	transition-delay: 13s;
	transition-timing-function: ease;
	transition-duration: 1.2s;
	height: 48px;	
}
	
.quote {
	font-size: .925em;
	line-height: 1.625em;
}
}

@media only screen and (max-width: 696px) {
	#wrapper {
		padding: 36px 0;
	}
	
	.social-icons {
		justify-content: center;
		margin: 0 auto;
		padding-top: 0px;
		padding-bottom: 9px;
		gap: 16px;
  	}
	
	.icon-circle {
		width: 40px;
		height: 40px;
		background-color: #eee;     /* Circle color */
		border-radius: 50%;         /* Makes it a circle */
		display: flex;
		align-items: center;
		justify-content: center;
 		transition: background-color 0.3s ease;
		overflow: hidden;
	}

	.icon-circle svg {
		width: 20px;
		height: 20px;
		transition: fill 0.3s ease;
	}
	
	.right-column {
		padding: 0 1.125em;
	}
	.right-column:hover span.fadeName {
		color: #333;
	}
	#Reveal-1, #Reveal-2, #Reveal-3, #Reveal-4, #Reveal-5 {
		display: none;
	}
	img.photo {
		display: block;
		max-height: 360px;
		float: none;
		margin: 0 auto;
	}
	p.name {
		font-size: 3.875em;
		text-size-adjust: none;
	}
	p.description {
		margin-top: 0px;
		font-size: 3.33em;
		text-size-adjust: none;
	}
	div.table {
		display: none;
	}
	div.table-mini {
		display: table;
		margin: -8px auto;
	}
	ul.navigation-mini {
		font-family: Roboto, sans-serif;
		font-weight: 300;
		font-size: 1.2em;
		line-height: 1.5em;
		list-style-type: none;
		letter-spacing: .3px;
		margin-top: 30px;
		padding: 0 0 0 0;
		text-align: center;
		text-size-adjust: none;
	}
	p.category {
		font-size: 1.2em;
		letter-spacing: .5px;
		line-height: 1.5em;
		margin-top: 24px;
		text-size-adjust: none;
	}
	p.main {
		font-size: 1.2em;
		letter-spacing: .5px;
		line-height: 2.25em;
		text-size-adjust: none;
	}
	p.exTitle {
		font-size: 1.2em;
		line-height: 1.325em;
		text-size-adjust: none;
	}
	p.exSubTitle {
		display: block;
		margin-top: -2px;
	}
  	.video-row {
    	flex-direction: column;
    	align-items: center;
  	}
	
	.video-block {
    	width: 100%;
    	max-width: 100%;
  }
  	.fluid-vid-4x5, .fluid-vid-1x1 {
    	width: 100%;             /* take full row width when stacked */
  	}
	
  	.fluid-vid-1x1 iframe, .fluid-vid-1x1 iframe {
    	width: 100%;
  	}
	
	.video-block .exSubTitle {
    	display: none;
  }
}

@media only screen and (max-width: 320px) {
	span.myname {
		color: #333;
	}
	#Reveal-1 {
		display: none;
	}
	p.name {
		font-size: 2.25em;
		margin-bottom: 1.125em;
		text-size-adjust: none;
	}
	span.working-title {
		font-size: .875em;
		text-size-adjust: none;
	}
	span.email {
		font-size: .875em;
		text-size-adjust: none;
	}
	ul.navigation-mini {
		font-family: Roboto, sans-serif;
		font-weight: 300;
		font-size: 1.125em;
		line-height: 1.5em;
		list-style-type: none;
		letter-spacing: .3px;
		margin-top: 30px;
		padding: 0 0 0 0;
		text-align: center;
		text-size-adjust: none;
	}
	li:first-child {
		display: inline;
		margin-left: 0;
	}
	.right-column {
		padding: 0 1em;
	}
	img.photo {
		max-height: 280px;
	}
}

/* ----------- iPhone X ----------- */
/* Portrait [and Landscape] */
@media only screen 
	and (min-device-width: 375px) 
	and (max-device-width: 812px) 
	and (-webkit-min-device-pixel-ratio: 3)
	and (orientation: portrait) { 
	  
	  #wrapper {
		  padding: 72px 0;
		  max-width: 92% !important;
	  }
		
	.social-icons {
		justify-content: center;
		margin: 0 auto;
		padding-top: 0px;
		padding-bottom: 36px;
		gap: 2.25rem;
  	}
	
	.icon-circle {
		width: 6rem;
		height: 6rem;
		background-color: #eee;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
 		transition: background-color 0.3s ease;
		overflow: hidden;
	}

	.icon-circle svg {
		width: 3rem;
		height: 3rem;
		transition: fill 0.3s ease;
	}
		
	  .description {
		  color: #999;
		  font-weight: 100;
		  font-size: 2.5em !important;
		  line-height: 3.5rem !important;
		  text-align: center;
		  margin: 24px 0px 0px 0px;
		  /* margin: 24px 0px -8px 16px; */
	  }
	  .name {
		  font-size: 6em !important;
		  margin: 0 auto !important;
		  padding-bottom: .5rem;
	  }
	  .email {
		  color: #999 !important;
		  font-weight: 100 !important;
		  font-size: 2.5em !important;
		  text-align: center;
		  margin-top: -16px !important;
		  /* margin: -16px 0px 0px 16px !important; */
	  }
	  ul.navigation {
		  font-size: 2.13em;
		  margin: 24px 0;
		  display: table;
	  }
	 	li:first-child {
		 	 margin-left: 0em;
	  	}
	  	li:last-child {
		 	margin-right: 0em;
	  	}
	  
	  	div.table-mini {
			display: none;
			margin: 12px auto;
		}
	  	ul.navigation-mini {
			font-family: Roboto, sans-serif;
			font-weight: 300;
			font-size: 2.75em;
			line-height: 1.5em;
			list-style-type: none;
			letter-spacing: .3px;
			margin-top: 30px;
			padding: 0 0 0 0;
			text-align: center;
			text-size-adjust: none;
	}
	  
	  .right-column {
		  padding: 0;
	  }
	  p.category {
		  font-size: 2.75em;
	  }
	  p.main {
		  font-size: 2.75em;
	  }
	  img.photo {
		  display: block;
		  max-height: 888px;
		  border-radius: 13px;
		  margin: 0 auto;
		  float: none;
	  }
		.update-img {
			border-radius: 13px 13px 0px 0px;
		}
	  div.quote {
		  font-size: 2.5em !important;
		  width: 92% !important;
	  }
	  p.exTitle {
		  font-size: 3.75em;
		  font-weight: 500;
	  }
	  p.exSubTitle {
		  font-size: 1em;
	  }
	  p.smallCredit {
		  font-size: .8em;
	  }
	  .footer {
		  font-size: 2em;
		  margin: 0 0 60px 0;
	  }
}