#banner {
    width: 200px;
    height: 200px;            
    position: absolute;
    top: 30px;
    left: 50px;
        	
    border: 0;
	padding: 0;
	margin: 0;
	
	grid-area: banner;
	
	background-image: url("/images/banner.png");
	background-position: center; /* Center the image */
	background-repeat: no-repeat; /* Do not repeat the image */
/**
		background-size: cover; /* Resize the background image to cover the entire container /	
**/		
	background-size: contain;	
	cursor: pointer;
}
#banner:hover {	
	cursor: hand;
}


/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (max-width: 992px) {
	.content {
 		grid-template-columns: 1fr;
/* 		grid-template-rows: min-content min-content min-content min-content min-content; */
		grid-template-areas:
		"topmenu"
		"wordmark"
		"banner"
		"title"
		"left_title"
		"left"
		"right_title"
		"right"
		"second_title"
		"second_left"
		"second_right";
	}
	.wordmark {
		text-align: center;
		padding: 10px 0 0 0;
		grid-area: wordmark;
		/* 	border: 1px solid red; */
	}
	
	#banner {
		display: none;
		margin: 0 0 50px 0;
		/* position: relative; */
		grid-area: banner;
	}
} 
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (max-width: 768px) {
	#banner {
		display: none;
		margin: 0 0 50px 0;
		/* position: relative; */
		grid-area: banner;
	    height: 300px;            		
	}
} 
