html {
	height: 100%;
	margin: 0px;
	padding: 0px;

	font-style:normal;
      	font-variant:normal;
}

body {
	height: 100%;
	
	margin: 0px;
	padding: 0px 0px 100px 0px;

	background-color: #f6edf1;
	
	font-family: "Inter", helvetica, arial, sans-serif;
	font-size: 1em;
	font-weight: 300;
	text-align: left;
	color: #51355A;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

iframe {
	margin-top: 15px !important;
}

::selection {
  background: #5ce4c9;
}

::-moz-selection {
  background: #5ce4c9; 
}

.kudos {
	color: #787878;
	font-style: italic;
}

ul.socialLinks {
	padding: 0px;
	margin: 0px;
	margin-left: -10px;
}

.socialLinks li {
	list-style: none;
	display: inline-block;
	padding: 5px 10px;
	border-radius: 8px;
	font-size: 16px;
	margin-bottom: 0px;
} 

.socialLinks li:hover {
	text-decoration: underline;
}

a, a:active, a:visited {
	text-decoration: none;
	color: inherit;
}

a:hover {
	text-decoration: underline;
/*	color: #666;*/
}

.socialLinks li a:hover {
	text-decoration: none;
}

p {
	line-height: 26px;
}

h1 {
	font-weight: 300;
	font-size: 16px;
}

h1 span {
	font-family: Manrope;
	font-weight: 800;
	margin-right: 20px;
	font-size: 18px; 
}

h1 span a:hover {
	color: #51355A;
}

h1 a {
	color: inherit;
} 

h1 a:hover {
	text-decoration: none;
	opacity: 90%;
}

h2 {
	font-weight: 300;
	font-size: 0.8em;
	margin-bottom: 30px;
	text-transform: uppercase;
}

.introLink {
	color: #0C5EFF;
}

.container {
	width: 100%;
	height: 100%;
	margin: 0px;
	padding: 0px;

	position: absolute;

	z-index: 2;
	
}

.header {
	width: 100%;
	margin: auto;
	position: fixed;
	margin-top: 0px;
}

.content840 {
	max-width: 840px;
	padding: 20px 0px 20px 0px;
	margin: auto;
	text-align: left;
	min-height: 27px
}

.content1000 {
	max-width: 1240px;
	padding: 20px 0px 20px 0px;
	margin: auto;
	text-align: left;
	min-height: 27px;
	display: flex;

}

.work .content840, .work .content1000 {
	padding-bottom: 0px;
}

.intro {
	padding-bottom: 0px;
	position: fixed;
	width: 100%;
	z-index: 90;
	transition: all 0.1s linear;
	/*color: #ed335b;*/
	/*background-image: linear-gradient(to bottom, rgba(246,237,241,1), rgba(246,237,241,0));*/
}

.twitch {
  margin: 80px 0px 0px 0px;
  background-color: #ffffff;
  padding: 0 20px;
  font-family: Manrope, sans-serif;
  font-size: 16px;
  font-weight: 400;
}

.twitch .content840, .twitch .content1000 {
	padding: 0px 0px 60px 0px;
}

.twitch .details {
	max-width: 500px;
	background-color: #fff;
	padding-top: 30px;

}

.twitch .details h3 {
	font-size: 24px;
	font-weight: 600;
	margin: 0;
	padding: 0;
}

.listenLinks {
	display: flex;
	flex-direction: row;
}

.listenLinks a:first-child {
	margin-right: 16px;
}

.active {
	background-color: #ffffff;
}


.intro .content840 h1, .intro .content1000 h1 {
	margin-top: 0px;
	float: left;
}

.caseStudy {
	padding-top: 100px;
}

.blurb {
	/*background: linear-gradient(180deg, rgba(255,218,218,1) 0%, rgba(246,237,241,1) 100%);*/
}

.blurb h1 {
	font-family: Manrope, sans-serif;
	font-size: 78px;
	font-weight: 600;
}

.blurb p {
	font-family: Manrope, sans-serif;
	font-weight: 400;
	font-size: 20px;
	max-width: 640px;
}

.blurb a {
	color: #ed335b;
}

.blurb a:hover {
	text-decoration: underline;
}

/*.blurb span {
	padding: 4px 8px 4px 8px;
	margin: -4px -8px -4px -8px;
	background-color: #f6edf1;
	z-index: -1;
}

.blurb span:hover {
	padding: 4px 8px 4px 8px;
	background-color: #ed335b;
	color: #eeeeee;
	position: relative;
}*/

.sectionTitle {
	/*margin-bottom: -20px;*/
	opacity: 0.6;
}

.project {
	/*margin-right: 20px;*/
	margin-bottom: 100px;
	position: relative;
	clear: both;
	padding: 20px;
	/*margin-left: -20px;*/
}

.project:hover {
	/*background-color: #fbfbfb;*/
}

.noMarginBottom {
	margin-bottom: 0px;
} 

#projectPreview{
    position: absolute;
	float: left;
	/*background-color: #333333;*/
	width: 300px;
	height: 300px;
	z-index: -1;
	opacity: 1;
}

.comingSoon  {
	color: #999999;
	font-size: 13px;
}

.project .image {
	width: 356px;
	height: 200px;

	background-color: rgba(255,255,255,0.5);
	border-radius: 8px;

	margin-right: 20px;

	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;

	display: inline-block;
}

.project .image .highlight {
	width: 100%;
	height: 100%;
	opacity: 0;
	background-color: rgba(0,0,0,0.5);
	transition: opacity 0.5s;
	border-radius: 8px;
	color: #ffffff;
	position: relative;
	display: flex;
	align-items: center;
}

.project .image .highlight span {
	position: absolute;
	/*top: 87px;*/
	width: 100%;
	text-align: center;
}

.project .image .highlight:hover {
	width: 100%;
	height: 100%;
	opacity: 1;
}

.project .image:hover {
	cursor: pointer;
}

.project .copy {
	width: 100%;
	max-width: 300px;
	display: inline-block;
	vertical-align: top;
	margin-right: 30px;
}

.project .copy ul {
	padding: 0px;
	margin: 10px 0 5px -5px;
}

.project .copy li {
	list-style: none;
	display: inline-block;
	padding: 3px 10px;
	background-color: #f8f8f8;
	color: #999;
	border-radius: 2px;
	margin-right: 5px;
	font-size: 12px;
	margin-bottom: 5px;
}

.project .copy h3 {
	margin: -5px 0px 5px 0px;
	font-family: Manrope;
	font-weight: 600;
	font-size: 20px;
}

.project .copy p {
	margin: 0px;
	margin-bottom: 10px;
}

.project .copy a {
	margin: 0px;
}

video {
	border-radius: 8px;
	border:  1px solid rgba(81, 53, 90, 0.1);
	width: 100%;
	max-width: 900px;
}

.cv {
	padding: 64px 0px 100px 0px;
}

.cvTitle {
	margin-bottom: 20px;
}

.cv h2 {
	display: inline-block;
	margin-right: 15px;
	margin-top: 0px;
}

.downloadLink {
	display: inline-flex;
}

.downloadLink a {
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    padding: 10px 20px;
    border-radius: 8px;
    background-color: rgba(255,255,255,0.7);
    transition: background-color 0.25s;
    color: #51355A;
    font-size: 14px;
    line-height: 1;
    box-sizing: border-box;
    border: 2px solid #51355A;
    font-family: 'Manrope';
    font-weight: 600;
}

.downloadLink a:hover {
	background-color: #51355A;
	text-decoration: none;
	color: #ffffff;
}

.viewCasestudyLink a {
	display: inline-flex;
	vertical-align: middle;
	align-items: center;

	padding: 10px 0px 20px 0px;

	color: #ed335b;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
}

.viewCasestudyLink a:hover {
	text-decoration: none;
	color: #b71034;
}

.material-icons {
	font-size: 19px;
	padding-left: 8px;
}


table {
} 


td {
	vertical-align: top;
	text-align: left;
	padding-bottom: 10px;
	padding-top: 10px;
}

td a, td a:visited{
	color: #ed335b;
}

td a:hover {
	text-decoration: none;
	color: #b71034;
}



th {
	font-family: Manrope;
	font-weight: 600;
	vertical-align: top;
	text-align: right;
	padding-right: 30px;
	padding-bottom: 10px;
	padding-top: 10px;
}

.company {
	color: rgba(0,0,0,0.5);
	font-weight: 300;
}

.date {
	width: 120px;
	padding-right: 25px;
}

.title {
	/*width: 350px;*/
}

.languages {
	/*width: 470px;*/
}

li {
	margin-bottom: 10px;
}

.footer {
	font-size: 12px;
	color: #51355A;
}