@media only screen and (min-width: 1040px) {
	.noShowOnFooter {
		display: none;
	}
}
@media only screen and (max-width: 1040px) {
	body {
		margin: 0;
	}

	.noshow {
		display: none;
	}
	.item-sidebar {
		grid-area: sidebar;
		background-color: #12b2e2;
		position: sticky;
		text-align: center;
		font-size: 1rem;
		top: 0;
		height: 17vh;
		width: 100vw;
		z-index: 100;
		border-bottom: 1px solid black;
		background-image: url("https://www.transparenttextures.com/patterns/ecailles.png");
	}
	.inner {
		margin-top: 2rem;
		height: 40px;
		width: auto;
		background-color: #12b2e2;
	}
	.nav-list {
		margin-top: 1.25rem;
	}

	h1 {
		font-size: 1.3rem;
	}
	h3 {
		font-size: 1rem;
	}
	p,
	li {
		font-size: 0.8rem;
	}
	.name {
		/* margin-top: 1rem; */
		font-size: 2rem;
		text-shadow: 3px 3px 4px #1f8ec1;
		letter-spacing: 0.8rem;
		color: black;
		margin: 2px 0;
		background-image: url("https://www.transparenttextures.com/patterns/ecailles.png");
	}
	.address {
		display: none;
		font-family: Roboto;
		color: black;
		font-weight: lighter;
		font-size: 0.8rem;
	}

	.sb {
		padding: none;
	}

	.item-intro {
		/* padding-top: 30%; */
		grid-area: intro;
		font-size: 0.6rem;
		font-style: italic;
		background-color: black;
		padding-left: 5%;
		padding-right: 5%;
		padding-bottom: 5%;
		padding-top: 5%;
		line-height: 2;
		letter-spacing: 2px;
		color: #4cc9f0;
		font-weight: normal;
	}

	.main,
	.main,
	.tech,
	.proj,
	.footer {
		padding: 0;
		margin: 0;
		overflow: hidden;
		height: 100%;
	}

	a {
		font-size: 1.1rem;
		font-weight: normal;
		/* line-height: 1.2; */
		text-decoration: none;
		color: white;
		margin: 20 auto 0;
		/* font-family: Roboto; */
	}

	a:hover {
		color: black;
	}

	.navList {
		display: flex;
		width: 80vw;
		/* margin-left: 1rem */

		margin: 0 auto;
		flex-wrap: wrap;
		justify-content: space-around;
		align-content: space-around;
		color: white;
		/* font-size: .8rem; */
		font-weight: none;
		line-height: 1.7;
	}
	.inner-media {
		margin-top: 0.5rem;
		height: 5px;
		width: auto;
		background-color: #12b2e2;
		background-image: url("https://www.transparenttextures.com/patterns/ecailles.png");
	}

	.linkedin {
		width: 30px;
		height: 30px;
		margin-top: 0.9rem;
	}

	.git {
		width: 30px;
		height: 30px;
		padding-bottom: 1.45px;
		margin-left: 1.5rem;
	}
	.faLeft {
		margin-right: 15px;
	}
	.faRight {
		margin-left: 15px;
	}

	.footer {
		font-size: 0.6rem;
		padding: 0;
		margin: 0;
		height: 100%;
		background-color: black;
		color: #4cc9f0;
		text-align: center;
	}

	.container {
		overflow: scroll;
		height: 100vh;
		width: 100vw;
		display: grid;
		background-color: black;
		grid-template-columns: auto;
		grid-template-rows: auto;
		grid-template-areas:
			"sidebar"
			"intro"
			"main"
			"tech"
			" edu"
			"proj"
			"footer";
	}
}

@media only screen and (max-width: 1040px) and (orientation: portrait) {
	.media-portraitNoShow {
		display: none;
	}
	.faLeft {
		margin-right: 15px;
	}
	.faRight {
		margin-left: 15px;
	}
}

/* Style the coupon birds div to blend with layout */
#coupon-birds-embed-div {
	background-color: black !important;
}

@media only screen and (max-width: 1040px) and (orientation: landscape) {
	.item-sidebar {
		grid-area: sidebar;
		background-color: #12b2e2;
		position: sticky;
		text-align: center;
		font-size: 0.9rem;
		top: 0;
		height: 17vh;
		width: 100vw;
		z-index: 100;
		border-bottom: 1px solid black;
		background-image: url("https://www.transparenttextures.com/patterns/ecailles.png");
	}
	.inner {
		margin-top: 1rem;
		/* height: 40px; */
		width: auto;
		background-color: #12b2e2;
	}
	.linkedin {
		margin-top: 0.9rem;
	}
	.media-noshow {
		display: visible;
	}

	.faLeft {
		margin-right: 15px;
	}
	.faRight {
		margin-left: 15px;
	}
	i {
		margin-left: 50px;
		margin-right: 50px;
		margin-top: 5px;
	}
	h2 {
		padding-bottom: 2px;
	}
	.media-portraitNoShow {
		display: none;
	}
	.footer {
		padding-bottom: 10px;
	}

	.inner {
		margin-top: none;
	}
	.navlist {
		margin-left: 75%;
		width: 20vw;
	}
}
