

body {
	font-family: sans-serif;
	margin: 0;
	padding: 0;
	background-color: #f4f4f4;
}
header {
            background-image: url("./images/home-test.png"); /* Replace with your band image */
            background-size: cover;
            background-position: 50% 0%;
            height: 425px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
            color: black;
            
        }
h1 {
	margin: 0;
}
.event-container {
	
}

event-flex
{
	display: flex;
	
	flex-direction: column;
}

.event {
	display: flex;
	
	flex-direction: row;
/*
	width: calc(50% - 20px); 
*/
	
	text-align: center;
	
/*
	max-width: 1280px;
*/
	margin: 20px auto;
	padding: 20px;
	background-color: white;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	display: block;
	flex-wrap: wrap;
	justify-content: space-around;
}
.poster {
	display: block;
	width: 95%;
	max-width: 100%;
	
	height: auto;
	margin-bottom: 10px;
	border-radius: 5px;
	margin: 20px;
}
.event-details {
	font-size: 16px;
	flex: 1 1 50%;
	text-align: left;
	padding: 20px;
}
.event-date {
	font-weight: bold;
	
}



a {
	text-decoration: none;
	color: #333;
}
a:hover {
	text-decoration: underline;
}

.event-card-date > h2
{
	text-align: left;
	margin: 0px;
}



#upcoming-title
{
	text-align: left;
/*
	color: black; 
*/
/*
	margin-top: 100px;
*/
}
#block-spons{
	display: block;
	height: 15%;
	background-color: white;
}



#sec-sponsors{	
	background-color: white;
	
}

#block-spons block-container{
	margin-top: 0px;
}

#sec-sponsors .text-p{
	color: black;
	padding-top: 8px;
	margin-top: 0px;
}

sponsor-box{
	display: flex;
	width: 100%;
	height: auto;
	padding: 4px;
	padding-bottom: 8px;
}

/*
sponsor-box .mylinks{
	text-decoration: none;
	
	color: white;
	padding: 3px;
	border: 1px solid #DC9D5D;
	border-radius: 5px;
}
*/

sponsor-box .sponsor-logo{
	display: block;
	width: 23.606%;
	margin: 0;
	top: 50%;
	position: relative;
	height: auto;
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.sponsor-title{
	display: block;
	margin: auto;
	padding-left: 8px;
	
	width: 76.3963%;
	height: auto;
	
}

.sponsor-title img{
	width: 100%;
}

sponsor-box a img{
	width: 100%;
	
}

.sponsor-phone{
	display: block;
	margin: auto;
	width: 200px;
	text-decoration: none;
	text-align: right;
	font-size: 10px;
	font-weight: bold;
	color: black;
}

@media screen and (min-width: 760px)  
{
	#sec-sponsors flex-container{
		justify-content: center;	
	}
	
	
	
	sponsor-box{
		display: flex;
		flex-wrap: wrap;
		margin: 8px;
		width: 30%;
		height: 60px;
		 align-content: stretch;
/*
		padding: 4px;
*/
	}
	
	sponsor-box .sponsor-logo{
		position: static;
		height: 100%;
		width: auto;
		transform: translateY(0);
		
	}
	
	sponsor-box a img{
		height: 100%;
		width: auto;
	}
	
	.sponsor-title{
		width: 69%;
		height: auto;
		
	}
	#sec-sponsors .text-p{
		margin-bottom: 0px;
		font-size: 12px;
		padding-top: 2px;
	}
	
	.sponsor-phone{
		font-weight: bold;
		display: block;
		font-size: 10px;
		width: 60%;
		position: relative;
		text-align: left;
		top: -24%;
		left: 22%;
	}
	
	event-flex
	{
		
		
		flex-direction: row;
	}

	
	.poster {
		
		width: 50%;
		
	}
	.event-details {
		font-size: 16px;
		flex: 1 1 50%;
		text-align: left;
		padding: 20px;
	}
	.event-date {
		font-weight: bold;
		
	}


}

@media screen and (min-width: 1280px)  { /* smartphones, portrait iPhone, portrait 480x320 phones (Android) */
	
	
	#block-spons{
		height: 110px;
	}
	
	#sec-sponsors{
		height: 100%;
	}
	
	#sec-sponsors .text-p{
		font-size: 14px;
		padding-top: 4px
	}
	
	.sponsor-title img{
		width: 90%;
	}
	
	#sec-sponsors flex-container{
		height: 80%;
		justify-content: center;
  
	}
	
	sponsor-box{
		width: 25%;
		height: 52%;
		padding-bottom: 16px;
	}
	
	
	
	.sponsor-phone{
		font-weight: bold;
		display: block;
		font-size: 14px;
		width: 60%;
		position: relative;
		text-align: left;
		top: -10%;
		left: 13%;
	}
}
