body,html{
	margin: 0;
	padding: 0;
	/*height: 100%;*/
	font-family: arial,sans-serif;
}
main{
	width: 1fr;
	height: 100vh;
	display: grid;
	grid-template-rows: 50px auto 170px 50px;
	grid-auto-rows: auto; 
	grid-column-gap: 50px;
}

#chs{
	margin-top: 60px;
	padding: 5px;
	height: 170px;
	width: 50%;
	background: #ffffff;
	box-shadow: 1px 0px 5px 0 #bbb;
}
#chs button{
	width: 270px;
	margin-top: 50px;
	height: 45px;
	padding: 5px;
}
#dwnld{
	margin: 60px auto;
	padding-bottom: 5px;
	max-width: 50%;
	background: #ffffff;
	box-shadow: 0px 0px 5px 0 #bbb;
	border-radius: 3px;
	overflow: hidden;	
}
#dwnld p{
	margin:0;
	text-align: left;
	padding: 8px 5px;
	color: #444;
	font-size: 2rem;
	font-weight: bold;
	background: #f1f1f1;
	box-shadow: 0 1px 2px 0 #bbb;
}
#dwnld button{
	margin:30px 0;
	width: 170px;
}

@media only screen and (min-width : 270px) and (max-width : 550px) {
	main{
		grid-template-rows: 50px 420px auto 50px;
	}
	#chs{
		margin-top: 5px;
		height: 170px;
		width: auto;
		box-shadow: unset;
	}
	#chs button{
		width: 270px;
		margin-top: 40px;
	}
	#dwnld{
		max-width: 90%;
	}
}

@media only screen and (min-width : 551px) and (max-width : 1200px) {
	#chs{
		margin-top: 30px;
		height: 170px;
		width: 90%;
	}
	#chs button{
		width: 270px;
		margin-top: 25px;
	}
	#dwnld{
		max-width: 90%;	
	}
}

/*------For height 1280px and width 1500px*/
@media only screen and (min-width : 1500px) and (min-height : 1280px){
	main{
		grid-template-rows: 2% auto 500px 100px;
	}
}