@import url('https://fonts.googleapis.com/css?family=Rubik:400,700');

body, html{
	margin:0;
	padding:0;
	font-family: 'Rubik', sans-serif;
	line-height: 1.5;
	background-color:#D8E7E8;
	height:100%;
	box-sizing: border-box;
}
nav{
	position:relative;
	background:#fff;
	-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.19);
    -moz-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.19);
    box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.19);
    padding:1rem;
    color:#5C6670;
}
nav .nav-left{
	display:inline-block;
	width:49%;
	vertical-align: middle;
}
nav .nav-right{
	display:inline-block;
	width:49%;
	text-align:right;
	vertical-align: middle;
}
.outer-top{
	background-color:#0099A8;
	background-image: url('img/bottom-right.svg');
	background-size:140px 500px;
	background-repeat: no-repeat;
	background-position:left bottom;
	text-align:center;
	line-height: 1.2;
	padding:0 0 4rem 0;
	position: relative;
}
.clock{
	position:absolute;
	background-image: url('img/group-66.svg');
	background-repeat:no-repeat;
	position:absolute;
	top:50px;
	left:100px;
	width:500px;
	height:600px;
	z-index:1;
}
.outer-top h1{
	font-weight:normal;
	font-size:2.3rem;
	z-index:100;
}
.outer-bottom{
	background-color:#D8E7E8;
	z-index:-1;
}
.container{
	max-width:700px;
	margin:0 auto;
	color:#fff;
	padding:3rem 0;
	box-sizing: border-box;
}
.panel{
	margin:-8rem auto 0 auto;
	background-color:#fff;
	border-radius:10px;
	border:2px solid #1C3E58;
	padding:2rem;
	color:#5C6670;
	width:65%;
	text-align:center;
	position:relative;
	box-sizing: border-box;
	z-index:100;
}
.panel h2{
	margin:0;
	color:#0099A8;
	font-weight: normal;
}
.panel p{
	margin:0 0 1rem 0;
}
.panel form{
	text-align:left;
}
.panel form input{
	padding:0.7rem;
	width:100%;
	box-sizing: border-box;
	font-family: 'Rubik', sans-serif;
	font-size:1rem;
	color:#5C6670;
	border:0;
	background:#F4F9FF;
	border-radius:5px;
}
.panel form button{
	background:#E27C00;
	border:0;
	border-radius:5px;
	color:#fff;
	padding:0.5rem 1rem;
	font-family: 'Rubik', sans-serif;
	font-size:1rem;
	cursor:pointer;
}
.btn{
	background:#E27C00;
	border:0;
	border-radius:5px;
	color:#fff;
	padding:0.5rem 1rem;
	font-family: 'Rubik', sans-serif;
	font-size:1rem;
	text-decoration:none;
}

@media (max-width: 1024px) {
  nav .nav-left {
    width:30%;
  }
  nav .nav-right{
  	width:69%;
  }
  .clock{
  	display:none;
  }
}
@media (max-width: 768px) {
  nav .nav-left {
    width:20%;
  }
  nav .nav-right{
  	width:79%;
  }
}
@media (max-width: 425px) {
  nav .nav-left {
    width:100%;
    text-align:center;
  }
  nav .nav-right{
  	display:none;
  }
  .panel{
  	width:85%;
  }
  .outer-top .container{
  	padding:3rem 1rem 3rem 1rem;
  }
}