@font-face {
	font-family: 'KeepCalm';
	src: url('fonts/KeepCalm-Medium.ttf') format('truetype');
}

#main-title {
	text-align: center;
	padding: 40px 0px 40px 0px;
}

html {
	height: 100vh;
}

body {
	background: linear-gradient(#ffb886, #FF90ED);
	background-attachment: fixed;
	font-family: Helvetica, sans-serif;
	padding: 40px;
	text-align: center;
}

.main-container {
    display: initial;
}

#menu {
	position: absolute;
	top: 0px;
	right: 0px;
	padding: 10px 10px 0px 0px;
	font-family: KeepCalm, sans-serif;
	color: #2e2e30;
}

#menu a:link {
	color:#2e2e30;
}
#menu a:visited {
	text-decoration: none;
	color: #2e2e30;
}
#menu a:hover {
	text-decoration: none;
	color: #2e2e30;
	cursor: pointer;
}
#menu a:active {
	text-decoration: none;
	color: #2e2e30;
}

#credit {
    top: -6px;
    display: inline;
    position: relative;
    padding: 0px 2px 0px 0px;
    font-size: 12px;
}

.bmc-button {
	position: relative;
    top: -2px;
}

#donuts {
	text-align: center;
}

.jscroll-added {
	display: inline;
}

.donut {
	display: inline;
}

@media only screen and (max-width: 900px) {
    #main-title img {
		width: 400px;
		height: 117px;
	}
}

@media only screen and (max-width: 600px) {
    #main-title img {
		width: 300px;
		height: 88px;
	}
}

@media only screen and (max-width: 400px) {
    body {
		margin: 0px;
		padding: 30px 0px 0px 0px;
	}
}