@import url('https://fonts.googleapis.com/css?family=Rubik&display=swap');

body, html{
	height: 100%;
	background: url(bg.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.nav{
	padding: 20px 5%;
}

.nav a{
	color: #fff;
	text-decoration: none;
	padding: 10px 20px;
	font-family: "Rubik";
	font-size: 19px;
	border: 2px solid #fff;
	display: inline-block;
}

.nav .social{
	float: right;
}

.social a:hover{
	background: #fff;
	color: rgba(0,155,0,.9);
}

.box{
	background: rgba(0,0,0,.5);
	width: 280px;
	margin: 100px auto;
	padding: 20px;
}

.box h2,h3{
	color: #fff;
	font-family: "Rubik";
	font-size: 23px;
	letter-spacing: 1px;
	text-align: center;
}

.box h3{
	font-size: 18px;
	margin: 0;
}

.box input{
	width: 90%;
	padding-left: 10%;
	height: 35px;
	border: 2px solid #fff;
	margin-top: 30px;
	outline: none;
	color: rgba(0,155,0,.8);
	font-family: "Rubik";
	letter-spacing: 1px;
	font-size: 15px;
}

.box button{
	width: 100%;
	height: 45px;
	margin-top: 30px;
	outline: none;
	color: #fff;
	font-family: "Rubik";
	letter-spacing: 1px;
	font-size: 17px;
	background: rgba(0,155,0,.8);
	border: none;
}