html, body {
	margin: 0;
	overflow-x: hidden;
	scrollbar-width: none;
	background-color: #fff;
}


:root {
  --notblack: #3E3E3E;
  --myyellow: #F8B636;
  --isitgrey: #717171;
}

::-webkit-scrollbar {
    display: none;
}

#pass {
  width: 75%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 2px solid #F8B636;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 15px;
}

#butt {
  width: 50%;
  height: 40px;
  background-color: #F8B636;
  color: white;
  padding: 0px 20px;
  margin: 8px 0;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

#butt:hover { 
	background-color: #dba02e;
}

/* The progress container (grey background) */
.progress-container {
  position: fixed;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 8px;
  background: rgba(0, 0, 0, 0);
}

/* The progress bar (scroll indicator) */
.progress-bar {
  height: 4px;
  border-radius: 10px;
  background: var(--myyellow);
  width: 0%;
}

.project-head {
	width: 100vw;
	height: 63vh;
	background-image: url("assets/project_head.jpg");
	background-size: 100vw 475px;
	margin-bottom: 80px;
	color: white;
}

.footer {
	margin-bottom: 0px;
	width: 100vw;
	height: 125px;
	font-family: 'Fira Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: var(--notblack);
	text-align: center;
}

.bold-text {
	color: var(--myyellow);
	font-weight: 500;
}

.nav-bar{
	width: 100vw;
	height: 80px;
	font-family: Inconsolata;
	font-style: normal;
	font-weight: 400;
	font-size: 16.5px;
}

#abhi-nav {
	display: inline-block;
	float: left;
	margin-left: 55px;
	margin-top: 35px;
	color: var(--myyellow); 
}

#nav-link-holder {
	float: right;
	display: inline-block;
	margin-right: 55px;
	margin-top: 35px;
}

.nav-links {
	display: inline;
	padding-left: 50px;
	opacity: 0.7;
	font-size: 15px;
	letter-spacing: 0.5px;
}

.navss {
    color: inherit;
    text-decoration: none;
}

.navss:hover 
{
     color: var(--myyellow); 
     text-decoration:none; 
     cursor:pointer;  
}

.nav-links-selected {
	color: var(--myyellow); 
	opacity: 1;
}

.project-info {
	margin-top: 45px;
}

.info-text {
	width: 37vw;
	display: inline-block;
	float: left;
	margin-left: 55px;
}

.project-name {
	font-family: 'Roboto Slab', serif;
	font-style: normal;
	font-weight: normal;
	font-size: 29px;
	color: var(--myyellow);
}

.project-head-image {
	display: inline-block;
	float: right;
	margin-right: 15vw;
	margin-top: -20px;
}

.project-desc {
	margin-top: 30px;
	font-family: 'Fira Sans', sans-serif;
	font-weight: 300;
	font-size: 16px;
	line-height: 150%;
}

.project-tags {
	margin-top: 40px;
}

.tags {
	vertical-align: top;
	display: inline-block;
	margin-right: 30px;
	width: 100px;
}
.tags:first-of-type {
	width: 120px;
}

.tags:last-of-type {
	margin-right: 0px;
	width: 100px;
}

.tag-header {
	font-family: 'Roboto Slab', serif;
	font-style: normal;
	font-weight: normal;
	color: var(--myyellow);
	font-size: 14px;
	letter-spacing: 1px;
}

.tag-text {
	margin-top: 7px;
	font-family: 'Fira Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	line-height: 150%;
}

.navigator {
	position: absolute;
	width: 11vw;
	height: max-content;
	top: 555px;
	border-right: 1.5px solid rgba(0, 0, 0, .2);
	padding-right: 22px;
	text-align: right;
}

.project-links {
	line-height: 40px;
	height: 40px;
	font-family: 'Roboto Slab', serif;
	font-weight: 300;
	font-size: 13px;
	color: var(--isitgrey);
	letter-spacing: 2px;
	text-align: right;
	cursor: pointer;
}

.project-links-selected {
	color: var(--myyellow);
	font-weight: 600;
}

.section {
	min-height: 80vh;
	margin-left: 18.75vw;
	height: max-content;
	width: max-content;
	margin-bottom: 80px;
	border-bottom: 2px solid rgba(255, 175, 82, .2);
}

.section-head {
	font-family: Fira Sans;
	font-weight: 600;
	font-size: 22px;
	width: max-content;
	color: var(--notblack);
	border-top: 4px solid #FAAF52;
	padding-top: 10px;
	margin-bottom: 60px;
}

.body {
	margin-bottom: 80px;
	width: 65.625vw;
	overflow: auto;	
}

.body-title {
	display: inline-block;
	float: left;
	margin-left: 0px;
	width: auto;
	font-family: 'Roboto Slab', serif;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	color: var(--notblack);
	letter-spacing: 2.5px;
}

.body-content {
	display: inline-block;
	float: right;
	margin-right: 0px;
	width: 50vw;
	font-family: 'Fira Sans', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 150%;
	color: var(--notblack);
}

.feature-image {
	display: inline-block;;
	height: 93px;
	float: left;
	transition-duration: 0.3s;
}

.feature-image:hover {
	transform: scale(1.05);
}

.body-content-full {
	display: block;
	font-family: 'Fira Sans', sans-serif;
	font-weight: 300;
	font-size: 14px;
	line-height: 150%;
}

.img-two {
	display: inline-block;
	overflow: hidden;
	float: left;
	width: 16vw;
	height: 400px;
}

/*.img-two:first-of-type {
	margin-right: 3.75vw;
}*/

.img-two img {
	width: 500px;
	margin-left: -130px;
	margin-top: -50px;
}


.blocks {
	margin-top: 50px;
	width: 64vw;
	height: 400px;
	font-family: 'Fira Sans', sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size: 16px;
	color: var(--notblack);	
}

.body-text-2 {
	display: inline-block;
	float: left;
	width: 16vw;
	text-align: left;
	padding-top: 250px;
}

.column-2 {
	margin-top: 40px;
	display: inline-block;
	float: left;
	width: 23vw;
	text-align: left;
}

.blocks span {
	font-weight: 600;
	font-size: 17px;
}

.body-text-2:first-of-type {
	margin-right: 1vw;
}

.img-full {
	margin-top: 50px;
	margin-bottom: 50px;
}

.img-full img {
	width: 100vw;
	height: auto;
}