/* Big tablet*/
@media screen and (max-width: 1200px) {
	html, body { font-size: 18px; }
	
	.basic-button {
		width: 140px;
		height: 40px;
		border-radius: 20px;
	}
	.intro-container { padding-top: 6%; }
	.project-container { padding: 2% 2%; }
	.tech-list { width: 100%; }
	.progress-bar, .progress-filled { height: 13px; }
}


/* Small Tablets to Big Tablets */
@media screen and (max-width: 1023px) {
	html, body { font-size: 16px; }
	h2 { font-size: 120%; }
	h3 { font-size: 110%; }
	section { padding: 20px 0; }
	
	.row { width: 95vw; }
	.basic-button {
		width: 130px;
		height: 36px;
		border-radius: 18px;
	}
	.intro-container { padding-top: 60px; }
	.img-text-container { 
		width: 33%;
		padding: 1% 1%;
		margin: 0.5% 1%;
	}
	.about-img {
		width: 10vw;
		height: 10vw;
		padding: 10px; }
	.about-text-box { width: 95%; }
	.about-text-box h3 { margin-top: 20px; }	
	.tech-container { width: 90%; }
	.tech-desc-box-expanded { height: 70px; }
	.progress-bar, .progress-filled { height: 12px; }
}


/* Small Phones to Small Tablets */
@media only screen and (max-width: 767px) {
	html, body { font-size: 15px; }
	section { padding: 15px 0px; }
	
	.main-nav  { padding: 10px; }
	.main-nav li a { padding: 8px 20px; }
	.basic-button {
		width: 110px;
		height: 30px;
		border-radius: 15px;
	}
	.parent-container {
		display: block;
		align-items: center;
		padding: 0;
	}
	.intro-container { max-width: 100vw; }
	.img-text-container { 
		justify-content: center; 
		align-items: center;
		flex-direction: row;
		width: 95%;
		padding: 1% 5%;
		margin: 2% auto;
	}
	.about-img { padding: 5px; }
	.about-text-box { 
		width: 80%; 
		margin-left: 6%;
		margin-top: 2%;
	}
	.about-text-box h3 { 
		margin: auto; 
		text-align: left;
	}
	.simple-text li {
		padding-top: 2px;
		padding-left: 10px;
	}	
	.portfolio-content { display: Block; }
	.project-container {
		justify-content: flex-start; 
		flex-direction: column;
		width: 90%;
		padding: 3% 1%;
		margin: 2% auto;
	}
	.media-box { width: 90%; }
	.project-text-box {
		width: 90%;
		margin-top: 5%;
	}
	.project-text-box h3 { text-align: center; }
	.tech-desc-container { padding: 1% 2%;}
	.tech-desc-box-expanded { height: 70px; }
	.tech-list li { width: 33%; }
}

/* Small Phones */
@media only screen and (max-width: 480px) {
	html, body { font-size: 15px; }
	section { padding: 15px 0px; }
	h2 { font-size: 110%; }
	h3 { font-size: 100%; }
	
	nav { width: unset; }
	.main-nav { display: none; }
	.mobile-nav-icon { display: block; }
	.main-nav ul{ 
		text-align: left;
		padding-top: 50px;
		height: 100vh;
	}
	.main-nav li{ display: block; }
	.main-nav li a:link,
	.main-nav li a:visited,
	.main-nav li a:active { 
		display: block;
		text-align: left;
		border:	0;
		padding: 20px 20px;
		border-bottom: 1px solid #aaa;
	}
	.intro-container {
		justify-content: flex-start; 
		flex-direction: column; 
		margin-bottom: 2%;
		padding-top: 5%;
	}
	.img-text-container { 
		justify-content: flex-start; 
		flex-direction: column;
		width: 90%;
		padding: 1%;
		margin-top: 3%;
	}
	.about-text-box { 
		width: 90%; 
		margin: auto;
		margin-top: 2%;
	}
	.about-text-box h3 { text-align: center; }
	.portfolio-content { display: block; }
	.project-container { width: 90%; }
	.tech-desc-container { 
		display: flex; 
		justify-content: center;
		align-items: center;
	}
	.tech-desc-container h3 { width: 60%; }
	.tech-list li { width: 50%; }
	.tech-desc-box-expanded { height: 70px; }
	.progress-bar, .progress-filled { height: 9px; }
	
	.desc-text { padding: 8px 4px; }
}