/* SETUP */

	@-ms-viewport {	width: device-width; }
	
	* {	margin: 0; }

	@media screen and (max-width: 480px) {

		html, body { min-width: 320px; }
		.about-text p { max-width: 80%!important; align-self: center!important; }

	}
	
	:root {
		--light: #FDFDFB;
		--accentgreen: #81AFAF;
		--accentblue: #9EB2C7;
		--accentteal: #495C6A;
		--dark: #444849;
	}

	body {
		background: var(--light, #FDFDFB);
		color: var(--dark, #444849);
		font-family: "Merriweather", serif;
		font-size: 1rem;
		font-weight: 400;
		line-height: 1.5;
		-ms-overflow-style: scrollbar;
	}

	body.is-loading *, body.is-loading *:before, body.is-loading *:after {
			-moz-animation: none !important;
			-webkit-animation: none !important;
			-ms-animation: none !important;
			animation: none !important;
			-moz-transition: none !important;
			-webkit-transition:	 none !important;
			-ms-transition: none !important;
			transition: none !important;
	}
	
	.overlay {
		background-image: linear-gradient(rgba(253, 253, 251, 1), rgba(253, 253, 253, .7));
	}
	
	.container {
		padding-left: 0;
		padding-right: 0;
	}
	
	h2, h3, h4, h5 {
		font-family: "Lato", sans-serif;
		font-weight: 900;
		color: var(--accentblue, #9EB2C7);
	}
	
	h1 {
		font-family: "Merriweather", serif;
		font-weight: 700;
		color: var(--accentteal, #495C6A);
	}
	
	ul { 
		list-style: circle;
	}
	
	a, a:visited {
		color: var(--dark, #444849);
		text-decoration: none;
	}
	
	a:hover {
		color: var(--accentgreen, #81AFAF);
		transition: color 0.3s ease 0s;
	}
	a:active {
		color: var(--accentteal, #495c6a);
	}
	
	.btn:focus {
		outline: none;
		box-shadow: none;
	}
	
	.divider { width: 30%; max-width: 600px; margin: auto; }

/* LOADER */
	
	.loader {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 50000;
		width: 100%;
		height: 100%;
		background: var(--accentteal, #495C6A);
	}
	
	.loading-img {
		z-index: 50001;
		max-width: 50vw;
		max-height: 50vh;
	}
	
	.hide { display: none!important ; }

/* MAIN */

/* NAVBAR */

	.navbar {
		padding: 0.5rem;
		background-color: var(--light, #FDFDFB);
	}
	
	.nav-link, .nav-link:visited {
		color: var(--dark, #444849);
		font-family: "Lato", sans-serif;
	}
	
	.nav-link:hover {
		color: var(--accentteal, #495c6a);
		transition: 0.3s;
		
	}
	
	.nav-link:active {
		color: var(--accentteal, #495c6a);
	}
	
	.navbar-nav a:after {    
		background: none repeat scroll 0 0 transparent;
		bottom: 0;
		content: "";
		display: block;
		height: 0.8px;
		margin: auto;
		position: relative;
		background: var(--accentgreen, #81AFAF);
		transition: width 0.3s ease 0s;
		width: 0;
	}
	
	.navbar-nav a:hover:after { width: 50%; }
	
	.navbar button:hover {
		animation: pulse 1s linear 0 infinite;
		-webkit-animation: pulse 1s infinite;
	}
	@keyframes pulse {
		0% { transform: scale(1) }
		50% { transform: scale(1.1) }
		100% { transform: scale(1) }
	}

/* PROFILE */
	
	.profile {
		margin-top: 94px;
		margin-left: auto;
		margin-right: auto;
		padding: 1rem;
		/* max-width: 800px; */
		background: var(--accentteal, #495c6a);
	}
	
	.profile > div:nth-child(1) {
		flex-basis: 35%;
		min-width: 200px;
		align-items: center;
		
	}
	.profile img {
		max-width: 100%;
		max-height: 24rem;
	}
	
	.profile_text {
		padding: 1rem;
		color: #fff;
	}
	.profile_text h1 { color: #fff; }
	
	.profile_text .divider { margin-top: 0.5em; }
	
	.profile_text ul {
		font-size: 0.8rem;
	}

	.interests { margin-top: 0.5rem; gap: 0.5rem; }
	.interests div {
		font-size: 0.8rem;
		font-family: "Lato", sans-serif;
		text-align: center;
		padding: 0.2rem 1rem;
		margin-bottom: 0.5rem;
		border-radius: 1rem;
	}
	.interests div:nth-child(odd) {
		background: var(--accentgreen, #81AFAF);
	}
	.interests div:nth-child(even) {
		background: var(--accentblue, #9EB2C7);
	}
	.interests div:nth-child(odd):hover {
		background: #91BFBF;
		transition: background-color 0.3s ease 0s;
	}
	.interests div:nth-child(even):hover {
		background: #B0C1D4;
		transition: background-color 0.3s ease 0s;
	}

/* ABOUT */

	#About { /* max-width: 800px; */ margin: auto; }
	#About h3 { text-align: center; }

	.about {
		flex-grow: 1;
		flex-basis: 400px;
		max-width: 660px;
		margin-top: 2rem;
	}
	
	.about-title {
		padding: 2rem 2rem 0.5rem 2rem;
		width: 40%;
		min-width: 12rem;
		margin: auto;
		background: linear-gradient(rgba(253, 253, 251, 1), rgba(253, 253, 253, 0));
	}
	
	.about-text p {
		margin: 2rem;
		padding: 2rem;
		max-width: 60%;
		z-index: 0;
	}
	.about-text p:nth-of-type(odd) {
		background: rgba(176, 214, 214, 0.6);
		align-self: flex-start;
	}
	.about-text p:nth-of-type(even) {
		background: rgba(184, 202, 222, 0.6);
		align-self: flex-end;
	}
	.about-text div {
		width: 1px;
		background: #495C6A;
		align-self: center;
		margin-top: -2rem;
		margin-bottom: -2rem;
		height: 4rem;
	}
	
	#Contact {
		flex-grow: 1;
		flex-basis: 400px;
		max-width: 500px;
		padding: 2rem 2rem 3rem 2rem;
		margin-top: 2rem;
		background-image: linear-gradient(rgba(253, 253, 251, 1), rgba(253, 253, 253, 0));
	}
	
	#map img { width: 100%; max-width: 25rem; }
	#map:hover { transform: scale(1.02); transition: transform 0.3s ease 0s; }
	#map div { margin-top: 0.5rem; font-family: "Lato", serif; font-size: 0.8rem; }
	#map div:hover { color: #81AFAF; transition: color 0.3s ease 0s; }

/* FOOTER */
	
	#Footer {
		background: var(--accentteal, #495C6A);
		color: var(--light, #FDFDFB);
		padding: 1rem;
		font-size: 0.7rem;
		margin-top: 2rem;
	}
	
	.divider { margin-top: 0.5rem; margin-bottom: 1rem; height: 1px; width: 50px; background: var(--accentgreen, #81AFAF); }
	.credit { margin: auto; }