@import url('/resources/css/imports/light-theme.css');
@import url('/resources/css/imports/header.css');
@import url('/resources/css/imports/footer.css');

@import url('/resources/css/imports/list.css');
@import url('/resources/css/imports/resume.css');
@import url('/resources/css/imports/home.css');

html {
	font-size: 16px;
    background-color: var(--background-color);
    color: var(--main-color);
}

:root {
    --container-min-width: 10rem;
    --container-max-width: 56rem;
}

#body {
	font-size: 1rem;
}

#container {
    margin: auto;
	width: 85%;
	min-width: var(--container-min-width);
	max-width: var(--container-max-width);
	height: 100%;
	font-family: sans-serif;
    /* background-color: brown; */
}

#content {
	width: 100%;
	min-height: calc(100vh - 13.5rem); /* for footer */
}

.link {
	color: var(--main-color);
}

/* CSS for cards */

#cards {
	width: 96%;
	margin: auto;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	text-align: center;
}

.card {
	min-width: 17.5rem;
	max-width: 6.25rem;
	padding-left: 0.625rem;
	padding-right: 0.625rem;
	padding-bottom: 1rem;
}

.card-header {
	font-weight: bold;
}

.card-body {
	text-align: justify;
}