* {margin: 0; padding:0; box-sizing: border-box;}

main, nav {display: block;}

html {
	background-image: url("images/pricingmain2.jpg");
	background-repeat: no-repeat;
	background-size: 1200px;
	background-position: 50% 0%;
	z-index: -2;
	
}


main {
	
	padding: 66px 1.4em 0 2.7em;
    font-family: 'Abel', sans-serif;
	color: black;
	background-color: rgb(245, 251, 242);
	background-color: rgba(245, 251, 242, 0.91); 
	position: absolute;
	height: 100%;
	min-height: 800px;
	
	
	
}

h1 {padding-bottom: 0.5em; font-size: 2.4em;}
p {font-weight: bold; padding-bottom: 1.3em;}




.submitform h2 {
	margin-left: 9em;
	font-size: 1.5em;
	padding-bottom: 1em;
}
.submitform input {
	position: relative;
	padding-left: 0.3em;
	height: 2.5em; 
	margin: 0.55em 0;
	font-family: Abel, san-serif;
	font-size: 1em;
	color: black;
	font-weight: bold;
	background-color: rgb(134, 215, 224); 
	background-color: rgba(134, 215, 224, 0.5); 
}
.submitform textarea{
	background-color: rgb(134, 215, 224);
	background-color: rgba(134, 215, 224, 0.5);
	border: 1px solid black;
	padding: 0.6em 0 0 0.3em; 
	height: 9em;
	font-family: Abel, sans-serif;
	font-size: 1em;
	color: black;
	font-weight: bold;
	
}

.submitform textarea::placeholder{
	padding: 0.2em 0 0  0em;
	
	font-family: Abel, sans-serif;
	font-size: 1em;
	color: black;
	font-weight: bold;
}

.submitform input::placeholder{
	padding: 0.6em 0 0  0em;
	
	font-family: Abel, sans-serif;
	font-size: 1em;
	color: black;
	font-weight: bold;
}
.submitform input[type=submit] {
	
        transition: all 0.2s;
		height: auto;
		width: auto;
		display: block;
		
		text-align: center;
		background-color: rgb(134, 215, 224);
	    background-color: rgba(134, 215, 224, 0.6);
		border-radius: 0.3em;
		border: 1px solid black;
		color: black;
		width: 150px;
		font-size: 1.3em;
		grid-area: "button";
		font-weight: bold;
		font-family: 'Abel', sans-serif;
		margin-bottom: 0.4em;
		padding: 0.6em;
		cursor: pointer;
	
}

.submitform button:hover {
	background-color: rgba(222, 228, 222, 0.9);
	cursor: pointer;
}

.error {
    color: #FF0000;
}

.successfailure {
    color: #00FF00;
    font-weight: bold;
}

button {width: 100px}
label {
	position: absolute;
	font-size: 16px;
	color: black;
	left: 3em;
	visibility: hidden;
	
}

input[type="text"]:not(:placeholder-shown) + .formname, input[type="email"]:not(:placeholder-shown) + .formemail, input[type="text"]:not(:placeholder-shown) + .formnumber
{
	
	margin-top: -0.7em;
	margin-right: 0.1em;
	z-index: 100;
	font-weight: bold;
	font-size: 1em;
	visibility: visible;
	transition: all 0.5s;
}



input:focus-within, textarea:focus-within {
		
	outline-color:  #8ee5ee;
	
}

@media screen and (min-width: 700px) {
    html {
        background-size: cover;
    }
	main {
		position: relative;
		display: grid;
		grid-template-columns: 1fr 1fr;
		background-color: unset;
		padding: 0 0 0em 0;	
		
	}

	.container2 {
		background-color: rgba(242, 242, 242, 0.91);
		margin-top: 61px;
		padding: 1.3em 1.3em 0em 1.3em;
		
		min-height: 700px;
	}

	label {
		margin-left: -1.3em;
		grid-column: 2/3;
		visibility: hidden;
		
	}

	input[type="text"]:not(:placeholder-shown) + .formname, input[type="email"]:not(:placeholder-shown) + .formemail, input[type="text"]:not(:placeholder-shown) + .formnumber
	{
		 
		margin-top: -0.7em;
		margin-right: 0.1em;
		z-index: 100;
		font-weight: bold;
		font-size: 1em;
		visibility: visible;
		transition: all 0.5s;
	}

	.submitform button {
	margin-bottom: 0em;	
}

	.submitform textarea {
	margin-bottom: 1em;	
}

	.submitform {
		padding-bottom: 10em;
	}


}

@media screen and (min-height: 760px){
    html {
        background-size: 100vh 100vh;
    }
    
   .container2 {
        height: 98vh;
    }
    

}

@media screen and (min-width: 700px){
    html {background-size: cover;}
    
}