@charset "utf-8";
body {
    background-position: top center;
	background-image:url("../images/spawn.png");
	background-repeat: no-repeat;
	background-color: #74a386;
	overflow-y: scroll;
}

#ytplayer {
	border-color: red;
	border-width: medium;
	width: 720px;
	height: 405px;
}
.dropdown-img   {
	width: 16px;
	height: 16px;
}
.nav {
	background-color: #4e8764;
	border-radius: 0.25rem;
}

.news-column {
	background-color: lightcyan;
	padding: 20px;
	margin-top: 10px;
}


@media screen and (max-width:767.98px){
	
	.faces {
	text-align: center;

	}
	
	.face {
	display: inline-block;
	width: 50px;

	}
	
	.avatars, .banner {
	display: none;

	}

}

@media screen and (max-width:576px) {
	body {
			background-size: contain;
	}
	#ytplayer {
		width: 95%;
		height: auto;
	}
}

@media screen and (min-width:576px) {
	body { 
		background-size: 540px auto;
	}
	#ytplayer {
		width: 405px;
		height: 227px;
	}
}

@media screen and (min-width:768px) {
	.faces, .logo {
		display: none;
	}
	.avatar {
		height: 80px;
		width: auto;
	}
	
	.banner {
		text-align: center;
		height: 200px;
	}
    
    body {
        background-size: 720px auto;
    }
	#ytplayer {
		width: 646px;
		height: 363.375px;
}
}

@media screen and (min-width:992px){
	.avatar {
		height: 90px;
	}
	body {
		background-size: 960px auto;
	}
	#ytplayer {
		width: 450px;
		height: 253.125px;
	}
}

@media (min-width:1024px){
	#ytplayer {
		width: 406px;
		height: 228.375px;
	}
}

@media screen and (min-width:1200px){
	.avatar {
		height: 100px;
	}
    body {
        background-size: 1140px auto;
    }
	#ytplayer {
		width: 540px;
		height: 303.75px;
	}
}

@media screen and (min-width:1400px) {
	body {
		background-size: 1320px auto;
	}
	#ytplayer {
		width: 586px;
		height: 329.625px;
	}
}

.avatar {
	width: auto;
	display: inline-block;
	margin: 0px -10px;
}

.avatars {
	margin-top: 2px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0px;
	width: 90%;
	text-align: center;
}

.banner img {
	height: 200px;
}

.blog-header {
	line-height: 1;
	border-bottom: 1px solid #e5e5e5;
}

.blog-header-logo {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif;
	font-size: 2.25rem;
}

.blog-header-logo:hover {
	text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif;
}

.display-4 {
	font-size: 2.5rem;
}

@media (min-width: 768px) {
	.display-4 {
		font-size: 3rem;
	}
}


@media (min-width: 768px) {
	.h-md-250 {
		height: 250px;
	}
}

/* Pagination */
.blog-pagination {
	margin-bottom: 4rem;
}

.blog-pagination>.btn {
	border-radius: 2rem;
}

/*
* Blog posts
*/
.blog-post {
	margin-bottom: 1rem;
	background-color: azure;
	padding: 15px;
	border-radius: 0.5rem;
}

.blog-post-title {
	margin-bottom: .25rem;
	font-size: 1.5rem;
}

.blog-post-meta {
	margin-bottom: 1.25rem;
	color: #727272;
}

/*
* Footer
*/
.blog-footer {
	padding: 2.5rem 0;
	color: #727272;
	text-align: center;
	background-color: #f9f9f9;
	border-top: .05rem solid #e5e5e5;
}

.blog-footer p:last-child {
	margin-bottom: 0;
}

.carousel-indicators button.thumbnail {
	width: 100px;
}
.carousel-indicators button.thumbnail:not(.active){
	opacity: .7;
}
.carousel-indicators{
	position: static;
}