#banner1 {
	background: url('../../assets/images/section_gbc.jpg') no-repeat center center;
	background-size: cover;
	min-height: 400px;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-color: #666;
	background-blend-mode: overlay;
	opacity: 0.9; 
}

#banner2 {
	background: url('../../assets/images/section_gbi.jpg') no-repeat center center;
	background-size: cover;
	min-height: 400px;
	color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-color: #666;
	background-blend-mode: overlay;
	opacity: 0.9; 
}

.carousel-item #first-img,
.carousel-item #second-img{
	height: 87vh;
	min-height: 87vh;
	object-fit: cover;  
	object-position: top center;
}

#first-img {
	object-position: top center !important;
}

#second-img {
	object-position: center center !important;
}

.social-box {
	width:70px;
	height:70px;
	background-color:#149ecc;
	display:flex;
	align-items:center;
	justify-content:center;
	border-bottom: 1px #fff solid;
}

.lineUp {
	transform: translateX(-200%);
	opacity: 0;
	animation: slide-in-anim 2.5s ease-out forwards;
}

h5 {
	font-size: 16px !important;
}

@keyframes slide-in-anim {
	20% {
		opacity: 0;
	}
	60% {
		transform: translateX(-45%);
	}
	75% {
		transform: translateX(-52%);
	}
	100% {
		opacity: 1;
		transform: translateX(-50%);
	}
}

	.card-view .item {
		display: inline-block;
		width: 23%;
		margin: 10px 1%;
		vertical-align: top;
	}

	.table-view .item {
		display: block;
		margin-bottom: 10px;
	}

	.item-content {
		padding: 10px;     
		text-align:center;
	}
	@media (max-width: 768px) {
		.card-view .item {
			width: 48%;  
			margin: 10px 1%;
		}
	}

/* Media query for tablets (screen width up to 768px) */
@media screen and (min-width: 481px) and (max-width: 768px) {
    .lineUp {
        font-size: 18px !important;
		text-shadow: 2px 2px #149ecc !important;
    }
	.txt-banner {
		font-size: 18px !important;
		text-shadow: 2px 2px #149ecc !important;
	}	
	#social-banner {
		top: 40% !important;
	}
	.social-box {
		width:50px !important;
		height:50px !important;
	}
	.social-box img {
		width:30px !important;
	}
	h1 {
		font-size: 22px !important;
	}
	h5 {
		font-size: 16px !important;
	}
	#banner1,#banner2 {
		min-height: 250px !important;
	}	
}

/* Media query for mobile phones (screen width up to 480px) */
@media screen and (max-width: 480px) {
    .lineUp {
        font-size: 18px !important;
		text-shadow: 2px 2px #149ecc !important;
    }
	.txt-banner {
		font-size: 18px !important;
		text-shadow: 2px 2px #149ecc !important;
	}
	#social-banner {
		top: 50% !important;
	}
	.carousel-item #first-img, .carousel-item #second-img {
		height: 50vh;
		min-height: 50vh;
	}
	.social-box {
		width:40px !important;
		height:40px !important;
	}
	.social-box img {
		width:25px !important;
	}
	h1 {
		font-size: 20px !important;
	}
	h5 {
		font-size: 14px !important;
	}
	#banner1,#banner2 {
		min-height: 250px !important;
	}
}



