/* Small devices (landscape phones, up to and including 576px) */

/* ///// MOBILE MEDIA QUERIES ////// */
@media screen and (max-width: 700px) {
	@font-face {
		font-family: "AppleGaramond";
		font-style: normal;
		font-weight: normal;

		src: url("AppleGaramond.woff") format("woff"), url("mohave-bold-webfont.woff2") format("woff2");
	}

	@media only screen and (min-width: 200px) and (max-width: 700px) {
		#bgImage {
			width: auto;
			height: 100%;
			top: 0;
		}
	}

	#cover {
		display: none;
	}

	/*//// FONT STYLES ////*/
	h2 {
		font-size: 4rem;
	}

	.home-container .name {
		font-family: "AppleGaramond", serif;
		font-weight: 400;
		color: white;
		font-style: normal;
		font-size: 1.2rem;
		padding-top: 2%;
		text-decoration: none;
	}

	.home-container2 .name {
		font-family: "AppleGaramond", serif;
		font-weight: 400;
		color: white;
		font-style: normal;
		font-size: 1.2rem;
		padding-top: 2%;
		text-decoration: none;
	}

	.home-container .project-name-home {
		font-family: "AppleGaramond", serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1.4rem;
		padding-top: 1%;
		color: white;
	}

	.largebox:hover .name {
		font-style: italic;
	}

	.largebox:hover .project-name-home {
		color: #eb1069;
	}

	.small:hover .project-name-home {
		color: #eb1069;
	}

	.small:hover .name {
		font-style: italic;
	}

	.about-text p {
		font-size: 0.9rem;
		line-height: 1.2rem;
	}

	/*//// END OF FONT STYLES ////*/

	/* DIRECTORY STYLES */

	.directorylist li {
		font-size: 3rem;
	}

	.directorylist li a {
		color: black;
	}

	/*//// HOME PAGE ////*/

	.home-container {
		margin-top: 0px;
	}

	.home-container2 {
		margin-top: 0px;
	}

	/* GRID TYPES - HOME PAGE */
	.largebox-small-small {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr;
		grid-gap: 20px;
		margin-bottom: 4%;
	}
	.small-small-largebox {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr 1fr;
		grid-gap: 20px;
		margin-bottom: 4%;
	}

	.about-title {
		font-family: "AppleGaramond", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 4rem;
	}

	.about-title h2 {
		font-size: 1.6rem;
		line-height: 2rem;
	}

	.about-title h4 {
		font-size: 2.5rem;
		line-height: 3rem;
	}

	.about-text-container {
		width: 90%;
		margin-top: 20px;
	}

	.about-text p {
		font-family: "AppleGaramond", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.3rem;
		line-height: 1.9rem;
		width: 90%;
	}

	.small-small-small-small {
		display: grid;
		grid-template-columns: 1fr;
		gap: 3%;
		padding-bottom: 4%;
	}

	/* END OF GRID TYPES - HOME PAGE */

	.largebox .project-img,
	.small .project-img {
		background-color: rgba(128, 128, 128, 0);
	}

	.largebox,
	.small {
		width: 90%;
		margin: 0 auto;
		padding-bottom: 15px;
		border-left: 0px;
		padding-left: 0px;
	}

	/* END OF HOME PAGE */

	/* NEW PROJECT PAGE MEDIA QUERY */

	/* ------------
 ------------
 ----------- */

	.project-wrapper {
		padding-top: 0px;
		margin-top: 0;
	}

	.project-title-container span {
		font-size: 1.7rem;
		font-weight: 500;
		margin-bottom: 3%;
	}

	.project-text-container {
		display: block;
		justify-content: space-between;
		margin-bottom: 10%;
		margin-top: 7%;
		width: 100%;
	}

	.project-title-container2 {
		margin-bottom: 5%;
		width: 100%;
		/* background: #7ff295; */
	}

	.project-title-container2 span {
		font-size: 1.7rem;
		font-weight: 500;
		margin-bottom: 3%;
	}

	.project-text-container2 {
		display: block;
		justify-content: space-between;
		margin-bottom: 10%;
		margin-top: 7%;
	}

	.project-title-container2 h2 {
		font-family: "AppleGaramond", serif;
		font-weight: 500;
		font-style: normal;
		font-size: 3rem;
		margin-top: 12px;
		margin-bottom: 12px;
		line-height: 3rem;
	}

	.project-links {
		list-style: none;
		padding-left: 0px;
		/* margin-top: 3%; */
		padding: 0;
		margin-bottom: 15%;
		width: 100%;
		text-align: center;
		margin-left: 0px;
	}

	.about-links {
		list-style: none;
		padding-left: 0px;
		/* margin-top: 3%; */
		padding: 0;
		margin-bottom: 15%;
		width: 100%;
		text-align: center;
		margin-left: 0px;
	}

	.project-text-container p {
		font-family: "AppleGaramond", serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.3rem;
		line-height: 1.9rem;
		width: 100%;
	}

	.project-links li a {
		font-family: "AppleGaramond", serif;
		font-weight: 500;
		font-style: normal;
		font-size: 1.4rem;
		line-height: 6rem;
		color: white;
		width: 100%;
	}

	#pfp {
		padding: 10%;
	}

	.two-img-grid {
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr 1fr;
		height: fit-content;
	}

	/* ------------
 ------------
 ----------- */

	/* END OF NEW STUDENT PROJECT PAGES */

	/*//// ABOUT /////*/

	.about-container {
		width: 90%;
		margin: 0 auto;
		/* border: 1px solid black; */
	}

	#top-title-about {
		margin-top: 4%;
		width: 80%;
		/* border: 1px solid black; */
	}
	.about-title h2 {
		font-size: 1.6rem;
		line-height: 2rem;
	}

	.about-text-container {
		width: 100%;
		margin-top: 20px;
	}

	.about-title {
		padding-top: 0;
		width: 90%;
	}

	.about-text p {
		font-family: "AppleGaramond", sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.3rem;
		line-height: 1.9rem;
		width: 100%;
	}

	.more-info {
		display: block;
	}

	.more-info a {
		color: #008389;
	}

	.credits-intro {
		width: 100%;
		text-align: center;
		margin-top: 10%;
		margin-bottom: 20%;
	}

	#credits-intro {
		width: 100%;
		font-size: 1.8rem;
		line-height: 2rem;
	}

	.about-credits {
		width: 90%;
		display: grid;
		grid-template-columns: 1fr;
		grid-gap: 0px;
		/* border: 1px solid black; */
		height: fit-content;
	}
	.about-credit-c1,
	.about-credit-c2 {
		height: fit-content;
		/* border: 1px solid black; */
	}

	.single-credit h4 {
		font-size: 1.5rem;
	}

	.single-credit p {
		font-size: 1.3rem;
	}

	/*//// END OF ABOUT /////*/

	/*//// DIRECTORY ////*/
	.directory-grid {
		display: none;
	}

	.directory-mobile {
		/* display: block; */
		display: flex;
		justify-content: center;
		margin-top: 15%;
		margin-left: 5%;
		margin-bottom: 15%;
		/* border: 1px solid black; */
	}

	.directory-grid-mobile {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: 20px;
		margin-bottom: 15%;
		/* border: 1px solid black; */
	}

	.student-name-2 {
		display: block;
		margin-bottom: 3%;
	}

	.student-name-2 li {
		font-size: 1.3rem;
		line-height: 2rem;
		text-decoration: none;
		/* text-align: center */
	}

	/*/// END OF DIRECTORY ///*/

	/*/// FOOTER ///*/
	footer {
		width: 90%;
	}

	.footer-wrapper {
		width: 100%;
		background-color: #121212;
		margin-top: 0%;
		display: flex;
	}

	.footer-grid {
		width: 100%;
		margin: 0 auto;
		display: flex;
		justify-content: space-evenly;
		flex-wrap: wrap;
		flex: 1;
	}

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

	.logo-text h3 {
		font-size: 1rem;
		text-align: center;
		text-decoration: none;
	}

	.logo-text a,
	a:visited {
		color: rgb(0, 0, 0);
		text-decoration: none;
	}

	.footer-links {
		display: flex;
		flex-direction: row;
		width: fit-content;
		margin: 0 auto;
		margin-top: 3%;
		text-align: right;
	}

	.footer-links ul li {
		font-size: 1.3rem;
		line-height: 2.2rem;
	}

	.footer-animation {
		margin: 0 auto;
		text-align: center;
		/* height: 100px; */
	}

	.footer-animation img {
		height: 80px;
	}

	.credits-wrapper {
		margin-bottom: 15%;
	}

	.credits-container {
		width: 75%;
		margin: 0 auto;
		margin-top: 2%;
		margin-bottom: 6%;
	}

	.credits-container p {
		line-height: 0.8rem;
	}
	/* END OF FOOTER */
}

/*/////////// IPADS/ TABLETS ///////////// */
@media only screen and (min-width: 701px) and (max-width: 1024px) {
	/*//// FONT STYLES ////*/
	.about-text p {
		font-size: 1rem;
		line-height: 1.4rem;
	}

	.student-name-2 li {
		font-size: 11px;
		margin-right: 15px;
		color: black;
	}

	#project-name-footer {
		font-size: 16px;
	}

	/*/////HOME PAGE /////*/
	.center-icon {
		width: 60%;
		margin: 0 auto;
		margin-top: -20px;

		/* border: 1px solid black; */
	}
	.center-icon a {
		font-size: 0.8rem;
	}

	.largebox .project-img {
		background-color: gray;
		height: 250px;
	}

	.small .project-img {
		background-color: gray;
	}

	/*/////// END OF HOME PAGE //////*/

	/* //// PROJECT PAGE MEDIA QUERY ///*/

	/* PROJECT TEXT */

	.project-text-container {
		width: 93%;
		margin: 0 auto;
		display: flex;
		justify-content: space-between;
		align-content: center;
		margin-bottom: 10%;
		margin-top: 0%;
		/* border: 1px solid black; */
	}

	.project-text-container p {
		font-family: "applegaramond", serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.4rem;
		line-height: 2rem;
		width: 100%;
	}

	.project-links {
		list-style: none;
		padding-left: 0px;
		/* margin-top: 3%; */
		padding-right: 0;
		margin-bottom: 5%;
		width: 40%;
	}

	.project-links li a {
		font-family: "AppleGaramond", serif;
		font-weight: 400;
		font-style: normal;
		font-size: 1.5rem;
		line-height: 6rem;
		color: white;
		padding: 20px 30px;
		border: 1px solid white;
		text-decoration: none;
		border-radius: 50px;
		margin-bottom: 30px;
	}

	.project-links a:hover {
		color: black;
		background: white;
		transition: 200ms;
		transition-timing-function: ease-in;
		-webkit-transition: 200ms;
		-webkit-transition-timing-function: ease-in;
	}

	#pfp {
		width: 70%;
		padding-bottom: 4%;
	}

	.project-text-container2 {
		display: block;
		justify-content: space-between;
		margin-bottom: 10%;
		margin-top: 7%;
	}

	.project-title-container2 h2 {
		font-family: "AppleGaramond", serif;
		font-weight: 500;
		font-style: normal;
		font-size: 3rem;
		margin-top: 12px;
		margin-bottom: 12px;
		line-height: 3rem;
	}

	/*//// END OF STUDENT PROJECT PAGES ///*/

	/*/// ABOUT ///*/
	.about-title h2 {
		font-size: 2rem;
		line-height: 2.4rem;
	}

	.about-text p {
		font-size: 1.2rem;
		line-height: 1.8rem;
	}

	.credits-intro {
		margin-bottom: 10%;
		/* border: 1px solid black; */
	}

	#credits-intro {
		font-size: 1.4rem;
		line-height: 2rem;
		width: 87%;
		/* border: 1px solid black; */
	}

	.credits-wrapper {
		/* border: 1px solid black; */
		width: 100%;
	}

	.about-credits {
		width: 90%;
		margin-bottom: 5%;
	}

	.single-credit h4 {
		font-size: 1rem;
	}

	.single-credit p {
		font-size: 1rem;
	}

	/* END OF ABOUT */

	/*/// DIRECTORY ////*/
	.directory-grid {
		display: none;
	}

	.directorylist li a {
		color: black;
	}

	.directory-mobile {
		/* display: block; */
		display: flex;
		justify-content: center;
		width: 90%;
		margin: 0 auto;

		margin-bottom: 10%;
		/* border: 1px solid black; */
	}

	.directory-grid-mobile {
		width: fit-content;
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-gap: 50px;
		margin-top: 10%;

		/* margin-bottom: 10%; */
	}

	.student-name-2 {
		display: block;
		margin-bottom: 3.5%;
		/* border: 1px solid black; */
	}

	.student-name-2 li {
		font-size: 1.3rem;
		/* text-align: center */
	}

	/*////// FOOTER //////*/
	.footer-wrapper {
		height: 180px;
	}

	.footer-links ul li {
		font-size: 1.4rem;
		/* padding-left: 0px; */
		list-style: none;
	}

	.footer-animation img {
		height: 70px;
	}

	.credits-container {
		margin-bottom: 4%;
	}

	/*////// END OF FOOTER //////*/
}

/*///// END OF IPADS/ TABLETS/////// */

/*//// XL FOR (EXTRA) LARGE /////*/

/*/////// LARGE DESKTOP QUERIES////////*/

@media screen and (min-width: 1350px) {
	/*//// DIRECTORY////*/
	.student-name-2 li a {
		font-size: 20px;
		color: white;
	}

	#project-name-footer a {
		font-size: 18px;
	}
}

@media screen and (min-width: 1520px) {
	/*//// END OF HOME PAGE////*/

	/*//// DIRECTORY ////*/
	.student-name-2 li a {
		font-size: 22px;
		line-height: 2rem;
	}

	#project-name-footer a {
		font-size: 20px;
	}

	/*//// END OF DIRECTORY////*/
}

@media screen and (min-width: 1550px) and (max-width: 1650px) {
	/*//// HOME PAGE////*/
	#desktop-nav li {
		padding-right: 2.5rem;
	}
	#nav-title {
		font-size: 1.3rem;
	}
	/*// END OF NAV //*/

	.largebox-small-small,
	.small-small-largebox,
	.small-small-small-small {
		grid-gap: 30px;
	}

	.largebox .project-img {
		height: 40vh;
	}

	/*//// END OF HOME PAGE////*/

	/*//// PROJECT PAGES////*/
	.project-title-container h2 {
		font-size: 6rem;
	}
	.project-title-container span {
		font-size: 1.7rem;
	}

	.previous-project,
	.next-project {
		border: white solid 1px;
		border-radius: 50%;
		width: 80px;
		height: 80px;
		transition: 0.2s;
		display: flex;
	}

	.previous-project img {
		height: 40px;
		padding-left: 18px;
		padding-top: 3px;
	}

	.next-project img {
		height: 40px;
		padding-left: 18px;
		padding-bottom: 2px;
	}

	.project-links li a {
		font-size: 1.4rem;
		line-height: 7rem;
		padding: 30px 40px;
	}

	.project-text-container p {
		font-size: 1.5rem;
		line-height: 2.7rem;
	}

	/*//// END OF PROJECT PAGES////*/

	/*//// ABOUT PAGE ////*/
	.about-title h2 {
		font-size: 3.5rem;
		line-height: 4.3rem;
	}
	.about-text p {
		font-size: 1.9rem;
		line-height: 3rem;
	}

	#credits-intro {
		font-size: 2.4rem;
		line-height: 3rem;
	}

	.credits-wrapper {
		margin-bottom: 9%;
	}

	.about-credits h4 {
		font-size: 1.4rem;
	}

	.about-credits p {
		font-size: 1.2rem;
		line-height: 1.8rem;
	}
	/*//// END OF ABOUT PAGE ////*/

	/*////  FOOTER ////*/
	.footer-wrapper {
		height: 250px;
	}

	.logo-text {
		width: 85%;
	}
	.footer-links ul li a {
		font-size: 1rem;
		line-height: 2.3rem;
		float: righ;
	}
	.credits-container p {
		font-size: 0.7rem;
	}

	/*//// END OF FOOTER ////*/
}

@media (min-width: 1900px) {
	/*//// FONT STYLES ////*/

	/*//// HOME PAGE////*/

	/*//// END OF HOME PAGE////*/
}