@import url(http://fonts.googleapis.com/css?family=Roboto+Slab);


* {


    /* With these codes padding and border does not increase it's width and gives intuitive style.*/


  


	-webkit-box-sizing: border-box;   


	-moz-box-sizing: border-box;
	
	box-sizing: border-box;


}


body {


	margin:0;


	padding:0;


	font-family: 'Roboto Slab', serif;  


}


div#envelope{


	width: 55%;


	margin: 10px 30% 10px 25%;


	padding:10px 0;


	border: 2px solid gray;


	border-radius:10px;


} 	


form{


	width:92%;


	margin:4% 4%;


}  


header{


	background-color: #4180C5;


	text-align: center;


	padding-top: 12px;


	padding-bottom: 8px;


	margin-top: -11px;


	margin-bottom: -8px;


	border-radius: 10px 10px 0 0;


	color: aliceblue;


} 





/* Makes responsive fields.Sets size and field alignment.*/


input[type=text], select{


	margin-bottom: 2px;


	margin-top: 2px;


	width:100%;


	padding: 4px;


	border-radius:5px;


	border:1px solid #4180C5;


}


input[type=submit], [type=button]
{
	margin-top: 2px;
	margin-bottom: 2px;
	width:100%;
	padding: 10px;
	border-radius:5px;
	border:1px solid #4180C5;
	background-color: #4180C5;
	color: aliceblue;
	font-size:15px;
	cursor:pointer;
}

input[type=button]
{
	margin-top: 2px;
	margin-bottom: 2px;
	width:100%;
	padding: 10px;
	border-radius:5px;
	border:1px solid #4180C5;
	background-color: #4180C5;
	color: aliceblue;
	font-size:15px;
	cursor:pointer;
}

#submit:hover


{


 background-color: black;


}


textarea{


	width:100%;


	padding: 2px;


	margin-top: 2px;


    border:1px solid #4180C5;


	border-radius:5px; 


	margin-bottom: 2px;


	resize:none;


  } 


input[type=text]:focus,textarea:focus {


	border-color: #4697e4;


}