body {
	background-color: #131313;
	margin: 0px;
}

p, a {
	/*font-family: 'Playfair Display', serif;*/
	color: #000000;
}

p, a, li {
	font-size: 16px;
}

a {
	-o-transition: color 0.3s linear;
	-ms-transition: color 0.3s linear;
	-moz-transition: color 0.3s linear;
	-webkit-transition: color 0.3s linear;
	transition: color 0.3s linear;
}

a:hover, a:active, a:focus {
	color: #000000;
	-o-transition: color 0.3s linear;
	-ms-transition: color 0.3s linear;
	-moz-transition: color 0.3s linear;
	-webkit-transition: color 0.3s linear;
	transition: color 0.3s linear;
}

ol {
	padding: 0px;
}

ul {
	list-style: none;
	margin: 0px;
	max-width: 400px;
	margin-top: 15px;
}

li {
	margin: 15px 0px;
}

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

.hide {
	display: none;
}

.font-bold {
	font-weight: bold;
}

.font-italic {
	font-style: italic;
}

.collapse {
	max-height: 0px;
	-o-transition: max-height 0.3s linear;
	-ms-transition: max-height 0.3s linear;
	-moz-transition: max-height 0.3s linear;
	-webkit-transition: max-height 0.3s linear;
	transition: max-height 0.3s linear;
	overflow: hidden;
	padding: 0px 10px;
}

.collapse p, .collapse a, .collapse li {
	font-size: 14px;
	font-family: initial;
}

.collapse.expand {
	-o-transition: max-height 0.3s linear;
	-ms-transition: max-height 0.3s linear;
	-moz-transition: max-height 0.3s linear;
	-webkit-transition: max-height 0.3s linear;
	transition: max-height 0.3s linear;
	overflow-y: scroll;
}

.collapse .collapse-container {
	text-decoration: none;
	position: absolute;
	top: 0px;
	right: 0px;
	font-size: 10px;
	cursor: pointer;
}

#me .content {
	height: 100vh;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;
	align-items: center;
}

#me .img-container, #me .text-container {
	display: inline-block;
	float: left;
	padding: 30px;
}

#me .img-container {
	width: 40%;
}

#me .text-container {
	width: 60%;
	background-color: #fffcf4;
	height: 100%;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;
	align-items: center;
}

#me img.saurabhkt {
	width: 100%;
	height: auto;
	max-width: 225px;
}

#workList .dingbat {
	font-size: 10px;
}

#workList, #spotifyTutorial {
	position: relative;
}

#workList.collapse.expand {
	max-height: 340px;
}

#spotifyTutorial.collapse.expand {
	max-height: 300px;
}

#me .social-icon, #me .social-icon:hover, #me .social-icon:active, #me .social-icon:focus {
	text-decoration: none;
	margin-right: 30px;
}

.spotify-saurabhkt a div.img {
	background-image: url("https://profile-images.scdn.co/images/userprofile/default/c118865a50d19c542c7b682e09e108677b097f7d");
}

footer {
	height: 20px;
	text-align: center;
	background-color: #131313;
}

footer p {
	color: #fffcf4;
	font-size: 12px;
}

/*#slowthai {
	width: 100%;
	max-width: 1200px;
	height: 
	margin: 0 auto;
}*/

@media (max-width: 767px) {
	#me .content, #me .text-container {
		display: block;
		float: none;
		text-align: center;
		margin: 0 auto;
		width: auto;
	}

	#me .img-container {
		display: block;
		width: auto;
		float: none;
		background-color: #131313;
		padding: 20px;
	}

	#me img.saurabhkt {
		max-width: 112px;
	}

	#workList.collapse.expand, #spotifyTutorial.collapse.expand {
		max-height: 1000px;
	}

	#me .content {
		height: 100%;
	}

	#workList, #spotifyTutorial {
		text-align: left;
	}

	body {
		background-color: #fffcf4;
	}

}