body{
	font-size: 26px;
	background-color: #0d98ba; /* For browsers that do not support gradients */
	background-image: linear-gradient(#0d42cf, #0d98ba, #0dcf86);
}
h1{
	color:rgb(235 235 235);
	font-size:50px;
}
h2{
	font-size: 31px;
}
a{
	color: rgb(251, 98, 124);
}
.headin{
	text-align: right;
	padding-right: 120px;
}

@media only screen and (max-width: 700px) {
	body{
	font-size: 20px;
	}
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 20vh 10vh 57vh 11vh 57vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 70%;
	}
	.gridP{
    padding-right: 30px;
    text-align: center;
	}
	.gridR{
		padding-right: 20px;
		text-align: left;
	}
}
@media only screen and (max-width: 600px) {
	body{
	font-size: 18px;
	}
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 20vh 10vh 70vh 11vh 70vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 70%;
	}
	.gridP{
    padding-right: 30px;
    text-align: center;
	}
	.gridR{
		padding-right: 20px;
		text-align: left;
	}
}
@media only screen and (min-width: 700px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 20vh 11vh 91vh 11vh 100vh;  
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 85%;
	}
}
@media only screen and (min-width: 750px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 17vh 11vh 84vh 10vh 90vh;  
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 85%;
	}
}
@media only screen and (min-width: 800px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 14vh 11vh 73vh 10vh 75vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 75%;
	}
}
@media only screen and (min-width: 900px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 12vh 11vh 65vh 10vh 65vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 65%;
	}
}
@media only screen and (min-width: 1000px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 12vh 11vh 55vh 10vh 60vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 60%;
	}
}
@media only screen and (min-width: 1100px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 12vh 11vh 55vh 10vh 55vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 52%;
	}
}
@media only screen and (min-width: 1200px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 12vh 11vh 50vh 10vh 50vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 45%;
	}
}
@media only screen and (min-width: 1300px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 12vh 11vh 48vh 10vh 50vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 40%;
	}
}
@media only screen and (min-width: 1400px) {
	.grid-items{
		display: grid;
		grid-template-columns: 3fr 2fr ;
		grid-template-rows: 12vh 12vh 45vh 13vh 45vh; 
		padding: 10px;
	}
	.center{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 36%;
	}
}

.gridP{
    padding-right: 60px;
    text-align: center;
}
.gridR{
    padding-right: 30px;
    text-align: left;
}
.gridL{
    padding-right: 30px;
}
.sub-headin{
	font-size: 1.1em;
}
.off{
	transform: translate(10px,20px);
}
.pRight{
	padding-right: 50px;
}