@font-face {
  font-family: sometimes-times-regular;
  src: url('./fonts/Sometimes Times.woff2') format('woff2'),
    url('./fonts/Sometimes Times.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: sometimes-times-italic;
  src: url('./fonts/Sometimes Times Italic.woff2') format('woff2'),
    url('./fonts/Sometimes Times Italic.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}



/**********************/
/******* Misc. ********/
/**********************/

body {
	font-family: 'Inter', sans-serif;
	font-size:1rem;
	line-height:1.5;
	color: #2e2e2f;
	background-color: #fff;
	margin: 0px;
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

h1 {
	font-size:1rem;
	line-height:1;
	font-weight:400;
	margin: 0px;
}

h2 {
	font-size:1rem;
	line-height:1;
	font-weight:300;
	margin: 0px;
}

h3 {
	font-weight:300;
	margin: 0px;
}

h4{
	font-size:0.7rem;
	line-height:1.2;
	font-weight:300;
	color: #b4b5b5;
	
	
	
}

a {
	cursor: pointer;
	font-size:1rem;
	line-height:1;
	font-weight:300;
}

a, a:hover {
	text-decoration: none;
	color:#2e2e2f;
}

.link-effect {
	border-bottom: solid 0px transparent;
	transition: border 0.25s ease;
}

.link-effect:hover {
	border-bottom: solid 2px #555;
}

/**********************/
/******* Header ******/
/**********************/

.header {
	position: fixed;
	top: 0px;
	display: flex;
	justify-content: space-between;
}

.header--site-title {
	font-weight:400;
}

.header--nav {
	width: 100px;
	text-align: right;
}


/**********************/
/******* Content ******/
/**********************/

.content-section--with-transition {
	opacity: 0;
    transition: opacity .25s ease-in;
}

.content-section--visible {
	opacity: 1;
}

.content-section--centered {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}


/**********************/
/******* Footer *******/
/**********************/

.footer {
	position: fixed;
    bottom: 0px;
}

.footer--social-menu {
	margin: 0px;
	padding: 0px;
}

.footer--social-menu-item{
	display:inline;
	margin-right: 25px;
	font-size:1rem;
}






/* ------------------ */
/* ------mobile------ */
/* ------------------ */

@media only screen and (max-width: 550px) {
	body {
		/* background-color: #ffebeb; */
		padding: 0 20px;
	}

	.header {
		padding-top: 30px;
		margin-bottom: 70px;
		flex-direction: column
	}

	.header--page-title {
		margin-top: 8px;
	}

	.header--nav {
		position: absolute;
		right: 0px;
		bottom: 0px;
	}

	.content-section {
		margin: 140px 0 84px 0;
	}

	.footer {
		margin: 30px 0 30px 0;
	}

	.calc-margin-width {
        width: calc(100% - 40px);
	}
	
	.hide-mobile {
        display: none;
    }
}

/* ------------------ */
/* ------tablet------ */
/* ------------------ */

@media only screen and (min-width: 551px) and (max-width: 800px) {
	body {
		/* background-color: #f1f1ff; */
		padding: 0 35px;
	}

	.header {
		padding-top: 40px;
		margin-bottom: 120px;
	}

	.header--page-title {
		width: 50%;
	}

	.content-section {
		margin: 176px 0px 104px 0px;
	}

	.footer {
		margin: 40px 0 40px 0;
	}

	.calc-margin-width {
        width: calc(100% - 70px);
	}
	
	.hide-tablet {
        display: none;
    }
}


/* ------------------ */
/* ------desktop----- */
/* ------------------ */

@media only screen and (min-width: 801px) {
	body {
		/* background-color: #e4ffe4; */
		padding: 0 70px;
	}

	.header {
		padding-top: 40px;
		margin-bottom: 40px;
	}

	.header--page-title {
		width: 50%;
	}

	.content-section--centered {
		justify-content: center;
	}
	
	.content-section {
		margin: 96px 0px 104px 0px;
	}

	.footer {
		margin: 40px 0 40px 0;
	}

	.calc-margin-width {
        width: calc(100% - 140px);
	}
	
	.hide-desktop {
        display: none;
    }
}