/* /r/FriendsAndShit Site CSS */
/* Written by Retroity */
/* LICENSE: WTFPL */

body {
	font-family: -apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen,Ubuntu,Cantarell,fira sans,droid sans,helvetica neue,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol;
	background-image: url("fs-bg.jpg");
	max-width: 50em;
	margin-left: auto;
	margin-right: auto;
	padding: 8px;
}

.header h1 {
  text-align: center;
  font-family: 'Titillium Web', sans-serif;
  font-size: 4.5em;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

@media screen and (max-width: 710px) {
	.header h1 {
		font-size: 4em!important;
	}
}
@media screen and (max-width: 620px) {
	.header h1 {
		font-size: 3.5em!important;
	}
}
@media screen and (max-width: 550px) {
	.header h1 {
		font-size: 3em!important;
	}
}
@media screen and (max-width: 470px) {
	.header h1 {
		font-size: 2.5em!important;
	}
}
@media screen and (max-width: 395px) {
	.header h1 {
		font-size: 2em!important;
	}
}
@media screen and (max-width: 320px) {
	.header h1 {
		font-size: 1.8em!important;
	}
}

.header h1 a {
  transition: color 0.2s;
  text-decoration: none;
  color: #FFFFFF;
}

.header h1 a:hover {
  color: #EEEEEE;
}

.header img {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.container {
	max-width: 100%;
	background-color: #FFFFFF;
	padding: 12px;
	border-radius: 1em;
}

.container h1 {
  text-align: center;
  font-size: 2rem;
}

.container p {
  font-size: 1.2rem; 
}

.content {
  color: #000000;
  margin-top: 6.2em;
}

.content a {
  color: #1976D2;
  text-decoration: none;
}

.content a:hover {
  text-decoration: underline; 
}

.content a:active {
  color: #0D47A1;
}

.content h2 a {
  color: #000000;
}

.content h2 a:active {
  color: #757575;
}

.content li {
  font-size: 1.2em;
}

.section-buttons {
  margin-bottom: 1em;
}

.button {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 8px;
  background-color: Transparent !important;
  text-align: center;
  font-size: 1.3em;
  border-radius: 4px !important;
  transition: background-color 0.2s, color 0.2s;
  margin-bottom: 0px !important;
  width: 40%;
  text-decoration: none!important;
  font-weight: 800;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#button-reddit {
  border: 2px solid #FF4500;
  float: left;
  clear: both;
  color: #000000;
  transition: background-color 0.2s, color 0.2s;
}

#button-reddit:hover {
  background-color: #FF4500!important;
  color: #FFFFFF;
}

/* Discord Button */

#button-discord {
  border: 2px solid #7289DA;
  float: right;
  color: #000000;
  transition: background-color 0.2s, color 0.2s;
}

#button-discord:hover {
  background-color: #7289DA!important;
  color: #FFFFFF;
}

#button-minecraft {
	border: 2px solid #002A00;
	color: #000000;
	transition: background-color 0.2s, color 0.2s;
	width: 100%!important;
	max-width: 100%!important;
}

#button-minecraft:hover {
	background-color: ##002A00;	
}

.comicsans {
  font-family: "Comic Sans MS", cursive, sans-serif;
}

.copyright {
  text-align: center;
  font-weight: bold;
  font-size: 1.4em;
  margin-top: 5px;
}