@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700&display=swap');
.html {
	box-sizing: border-box;
}

*,
*: before,
*: after{
	/*box-sizing: inherit;*/
	box-sizing: border-box;
}

.row:before,
.row:after {
	display: table;
	content: " ";
	clear: both;
}


.one, 
.one-thirds,
.one-fourth,
.one-sixth, 
.three-fourths,

.half{
	width: 100%;
}

@media only screen and (min-width: 800px) {
	.one{
		width: 100%;
	}
	.half{
		width: calc(100% / 2);
	}
	.one-third {
		width: calc(100% / 3);
	}
	.one-fourth {
		width: calc(100% / 4);
	}
	.one-sixth{
		width: calc(100% / 6);
	}

	.three-fourths{
		width: calc(100% / 4 * 3);
	}

	/*.column{
		float: left;
	}*/
}


body{
	margin: 0 auto;
	padding: 0;
	background-image: linear-gradient(to right,#B4DEE5, #F9E5B4);
}

body background-image{
	opacity: 0.5;
}

.container{
	max-width: 1400px;
	height: 200px;
	margin: 0 auto;
	padding: 0 auto;
}


.row{
	margin: 0;
	padding: 0;
	position: relative;
	max-width: 1400px;
	height: 720px;
	display: flex;
    flex-direction: row;
}


.logo{
	/*width: 30%;
	height: auto;*/
	display: inline-block;
	padding-left: 8%;
	padding-top: 5%;
	/*float:  left;*/
	position: absolute;
	z-index: 2;
}

.nav1 {
	color: #31515d;
	font-family: Futura;
	font-weight: medium;
	padding-left: 15%;
	/*padding-right: 8%;*/
	padding-top: 6%;
	text-align: left;
	display: inline-block;
	float:  left;
	position: absolute;
	z-index: 2;
}

.nav1 ul li {
	display: inline-block;
	overflow: hidden;
	list-style: none;
}

.nav1 ul li a {
	text-decoration: none;
	display: inline-block;
	padding: 5px 10px;
	color: #32515C;
}


.nav1 ul li a:hover {
	/*background-color: #FDA028;*/
	color: #FDA028;
}


.nav2 {
	color: #31515d;
	font-family: Futura;
	font-weight: medium;
	/*padding-left: 10%;*/
	padding-right: 20%;
	padding-top: 30%;
	text-align: right;
	display: inline-block;
	float:  right;
	/*position: absolute;
	z-index: 2;*/
}

.nav2 ul li {
	display: inline-block;
	overflow: hidden;
	list-style: none;
}

.nav2 ul li a {
	text-decoration: none;
	display: inline-block;
	padding: 5px 10px;
	color: #32515C;
}


.nav2 ul li a:hover {
	/*background-color: #FDA028;*/
	color: #FDA028;
}


.container2{
	display: inline-block;
	padding-left: 10%;
	padding-top: -50%;
}

.three-fourths {
	width: 70%;
	height: auto;
}

.three-fourths h2{
	color: #31515d;
	font-family: Playfair Display;
	font-weight: bold;
}

.three-fourths p{
	color: #31515d;
	font-family: futura;
	font-weight: thin;
}



.wrapper{
	position: relative;
}

form {
  width: 460px;
  margin: 0;
}

form h1 {
  font-size: 3em;
  font-weight: 300;
  text-align: center;
  color: #2196F3;
}
form h5 {
  text-align: center;
  text-transform: uppercase;
  color: #c6c6c6;
}
form hr.sep {
  background: #2196F3;
  box-shadow: none;
  border: none;
  height: 2px;
  width: 25%;
  margin: 0px auto 45px auto;
}
form .emoji {
  font-size: 1.2em;
}

.group {
  position: relative;
  margin: 45px 0;
}

textarea {
  resize: none;
}

input,
textarea {
  background: none;
  color: #31515d;
  font-size: 18px;
  padding: 10px 10px 10px 5px;
  display: block;
  width: 460px;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #31515d8f;
}
input:focus,
textarea:focus {
  outline: none;
}
input:focus ~ label, input:valid ~ label,
textarea:focus ~ label,
textarea:valid ~ label {
  top: -14px;
  font-size: 12px;
  color: #31515d;
}
input:focus ~ .bar:before,
textarea:focus ~ .bar:before {
  width: 460px;
}


label {
  color: #31515d8f;
  font-size: 16px;
  font-weight: normal;
  position: absolute;
  pointer-events: none;
  left: 5px;
  top: 10px;
  transition: 460ms ease all;
  font-family: futura;
}

.bar {
  position: relative;
  display: block;
  width: 460px;
}
.bar:before {
  content: "";
  height: 2px;
  width: 0;
  bottom: 0px;
  position: absolute;
  background: #FDA028;
  transition: 460ms ease all;
  left: 0%;
}

.btn {
  background: #fff;
  color: #959595;
  border: none;
  padding: 10px 20px;
  border-radius: 25px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  outline: none;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.btn:hover {
  color: #8b8b8b;
  box-shadow: 0 7px 14px rgba(0, 0, 0, 0.18), 0 5px 5px rgba(0, 0, 0, 0.12);
}
.btn.btn-link {
  background: #2196F3;
  color: #d3eafd;
}
.btn.btn-link:hover {
  background: #0d8aee;
  color: #deeffd;
}

.btn.btn-submit {
  background: #31515d;
  color: #F9F6E4;
  font-family: futura;
  position: absolute;
  z-index: 3;
}
.btn.btn-submit:hover {
  background: #FDA028;
  color: #31515d;
}

.btn-box {
  text-align: center;
  /*float: right;*/
  /*margin: 50px 0;*/
  margin-left: 60%;
  margin-bottom: 30%;
  margin-top: 10%;
  padding-top: 10%;
}

.container3{
	color: #31515d;
	padding-right: 20%;
	padding-top: 13%;
	margin-top: 50%;
}


.container3 h3{
	font-family: Playfair Display;
	font-size: 1.5em;
}

.container3 p{
	font-family: futura;
	font-weight: medium;
	font-size: 1em;
}

.follow{
	padding-top: 20%;
}



.footer{
	display: inline-block;
	float: left;
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0 auto;
	position: relative;
	z-index: 1;
}

#colblock{
	background-color: #32515C;
	background-size: cover;
	background-repeat: no-repeat;
	margin: 0 auto;
	padding: 0 auto;
	width: 100%;
	height: auto;
}

.row2 {
	width: 100%;
	height: auto;
}
.logo2{
	display: inline-block;
	padding-left: 6%;
	padding-top: 7%;
	/*padding-bottom: 10%;*/
	float: left;
	position: absolute;
	z-index: 2;
}

.fcontainer1{
	width: 18%;
	display: inline-block;
	align-items: center;
	padding-bottom: 5%;
	padding-right: 5%;
	padding-left: 4%;
}

.fcontainer1 h2{
	font-family: Playfair Display;
	font-weight: bold;
	/*font-size: 0.5em;*/
	color: #B4DEE5;
}

.fcontainer1 p{
	font-family: futura;
	font-weight: medium;
	color: #B4DEE5;
	padding-top: 90%;
	padding-left: 25%;
	font-size: 0.9em;
	width: 70%;
}

.fcontainer2{
	width: 15%;
	display: inline-block;
	vertical-align: top;
	padding-top: 5%;
	padding-left: 4%;
	/*text-align: left;
	align-content: left;*/
}

.fcontainer2 h2{
	font-family: Playfair Display;
	font-weight: bold;
	font-size: 1.5em;
	color: #B4DEE5;
	padding-left: 20%;
}

.fcontainer2 ul li {
	display: block;
	overflow: hidden;
	list-style: none;
	font-family: futura;
	font-weight: medium;
	padding-top: 5%;
	font-size: 0.9em;
}

.fcontainer2 ul li a {
	text-decoration: none;
	display: block;
	/*padding: 5px 10px;*/
	color: #B4DEE5;
}


.fcontainer2 ul li a:hover {
	color: #FDA028;
}


.fcontainer3{
	width: 15%;
	display: inline-block;
	vertical-align: top;
	padding-top: 5%;
}

.fcontainer3 h2{
	font-family: Playfair Display;
	font-weight: bold;
	font-size: 1.5em;
	color: #B4DEE5;
	padding-left: 18%;
}

.fcontainer3 ul li {
	display: block;
	overflow: hidden;
	list-style: none;
	font-family: futura;
	font-weight: medium;
	padding-top: 5%;
	font-size: 0.9em;
}

.fcontainer3 ul li a {
	text-decoration: none;
	display: block;
	/*padding: 5px 10px;*/
	color: #B4DEE5;
}


.fcontainer3 ul li a:hover {
	color: #FDA028;
}


.fcontainer4{
	width: 15%;
	display: inline-block;
	vertical-align: top;
	padding-top: 5%;
}

.fcontainer4 h2{
	font-family: Playfair Display;
	font-weight: bold;
	font-size: 1.5em;
	color: #B4DEE5;
	padding-left: 18%;
}

.fcontainer4 ul li {
	display: block;
	overflow: hidden;
	list-style: none;
	font-family: futura;
	font-weight: thin;
	padding-top: 5%;
	font-size: 0.9em;
}

.fcontainer4 ul li a {
	text-decoration: none;
	display: block;
	/*padding: 5px 10px;*/
	color: #B4DEE5;
}


.fcontainer4 ul li a:hover {
	color: #FDA028;
}


.fcontainer5{
	width: 20%;
	display: inline-block;
	vertical-align: top;
	padding-top: 5%;
}

.fcontainer5 h2{
	font-family: Playfair Display;
	font-weight: bold;
	font-size: 1.5em;
	color: #B4DEE5;
	padding-left: 15%;
}

.fcontainer5 ul li {
	display: block;
	overflow: hidden;
	list-style: none;
	font-family: futura;
	font-weight: medium;
	padding-top: 5%;
	font-size: 0.9em;
}

.fcontainer5 ul li a {
	text-decoration: none;
	display: block;
	/*font-size: 1.5em;*/
	color: #B4DEE5;
}


.fcontainer5 ul li a:hover {
	color: #FDA028;
}

.lastline{
	text-align: center;
	padding-top: 2%;
	padding-bottom: 6%;
}

.lastline h4{
	color: #B4DEE5;
	font-family: futura;
	font-weight: normal;
	font-size: 0.75em;
}

.sosmed a{
	box-sizing: border-box;
	border-radius: 25px;
	color: #32515C;
}

.sosmed a:hover{
	box-sizing: border-box;
	border-radius: 25px;
	color: #FDA028;
}

