.sitebg {
	background: linear-gradient(315deg, #3f51b5, #009688, #ff5722, #795548, #4caf50, #9575cd);
	background-size: 1200% 1200%;

	-webkit-animation: sitebg 60s ease infinite;
	-moz-animation: sitebg 60s ease infinite;
	-o-animation: sitebg 60s ease infinite;
	animation: sitebg 60s ease infinite;
}

@-webkit-keyframes sitebg {
    0%{background-position:1% 0%}
    50%{background-position:99% 100%}
    100%{background-position:1% 0%}
}

@-moz-keyframes sitebg {
    0%{background-position:1% 0%}
    50%{background-position:99% 100%}
    100%{background-position:1% 0%}
}

@-o-keyframes sitebg {
    0%{background-position:1% 0%}
    50%{background-position:99% 100%}
    100%{background-position:1% 0%}
}

@keyframes sitebg {
    0%{background-position:1% 0%}
    50%{background-position:99% 100%}
    100%{background-position:1% 0%}
}

.socialrow {
	padding-top: 3em;
}

.ui.button {
	box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.25) !important;
}

.flexcontainer {
	height: 100vh;

	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;
	align-items: center;

	justify-content: center;
	flex-direction: column;
}

.flexcontent {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;
	align-items: center;

	flex-direction: column;
	text-align: center;
}

.title {
	font-size: 400%;
	font-weight: bold;
	color: white;
	text-shadow: 3px 3px 8px rgba(0, 0, 0, 0.5);
}

.subtitle {
	font-size: 200%;
	font-weight: normal;
	color: white;
	text-shadow: 3px 3px 8px rgba(0, 0, 0, 0.5);
}

@media only screen and (max-width: 340px) {
.title {font-size: 250%;}
.subtitle {font-size: 150%;}
}

@media only screen and (min-width: 340px) {
.title {font-size: 300%;}
.subtitle {font-size: 150%;}
}

@media only screen and (min-width: 450px) {
.title {font-size: 400%;}
.subtitle {font-size: 200%;}
} 