@CHARSET "UTF-8";

.inline_link.ico {
	color: #717b8a!important;
}
.inline_link.ico:hover { 
    background-color: rgba(220,220,220, 0.5);
}
.inline_link.footer:hover { 
    background-color: rgb(90,90,90);
}
.black_background {
	background-color:rgb(51, 51, 51) !important;
	width: 100%;
}
.green_background {
	background-color: #90b2b2;
	width: 100%;
}

.control {
	display: block;
	width: 100%;
	height: 34px;
	padding: 6px 12px;
	margin-bottom: 10px;
	font-size: 1em;
	border: none;
	background-color: rgba(255, 255, 255, 0.1);
	color: rgb(247, 247, 247);
}
.message_control {
	display: block;
	width: 100%;
	height: 100px;
	resize: none;
	padding: 6px 12px;
	border: none;
	background-color: rgba(255, 255, 255, 0.1);
	font-size: 1em;
	color: rgb(247, 247, 247);	
}
label {
	margin-top: 10px;
	font-family: "source sans pro";
	font-style: normal;
	font-weight: 300;
	font-size: 20px;
	color: rgb(247, 247, 247);
}
.footer_title {
	font-family: "source sans pro";
	font-style: normal;
	font-weight: 300;
	color: rgb(247, 247, 247);
	text-align: center;
}
.email_label {
	font-family: "source sans pro";
	font-style: normal;
	font-weight: 300;
	color: rgb(247, 247, 247);
	text-align: center;
	margin: 40px;
}
@media screen and (min-width: 1200px) {
	.email_form {
		flex-grow: 1;	
		width: 900px;
	}
	.footer_title {
		font-size: 32px;
	}
	.email_label {
		font-size: 32px;
		margin: 40px;
		margin-bottom: 40px;
	}
}
@media screen and (min-width: 768px) and (max-width: 1200px){
	.email_form {
		flex-grow: 1;
		width: 75%;
	}
	.footer_title {
		font-size: 30px;
	}
	.email_label {
		font-size: 30px;
		margin-top: 30px;
		margin-bottom: 30px;
	}
}
@media screen and (max-width: 768px){
	.email_form {
		flex-grow: 1;
		width: 85%;
	}
	.footer_title {
		font-size: 28px;
	}
	.email_label {
		font-size: 28px;
		margin: 40px;
		margin-bottom: 20px;
	}
}

.credit, .privacy_statement, .message_response {
	text-align: center;
	color:rgb(247, 247, 247) !important;
	font-size: 17px !important;
	font-weight:300 !important;
}

.message_response {
	display: none;
	font-size: 20px;
	margin-top: 30px;
}

.phone_button {
	position: relative;
	border-radius:30px;
	width: 250px;
	height: 60px;
	margin-top: 40px;
	margin-bottom: 40px;
    background-color: rgb(52, 52, 52);
    display: inline-block;
}	
.phone_button:hover {
	background-color: rgb(39, 38, 38) !important;
}
.phone_button::after {
	position: absolute;
	color: rgb(255, 255, 255);
	font-family: "source sans pro" !important;
	font-style: normal !important;
	font-size: 24px !important;
	font-weight:300 !important;
	line-height: 1em;
	top: 18px;
	left: 80px;
	content: attr(data-phone-no);
	display: block; 
}
.phone_button::before {
	position: absolute;
	left: 30px;
	top: 0px;
	color: rgb(255, 255, 255);
	font-family: 'FontAwesome';
	content: "\f095";
	font-size: 42px;
	}
.phone_button:hover::before {
	animation: shake 0.82s;
	transform: rotateZ(0deg);
}

.email_button {
	position: relative;
	border-radius:30px;
	border: none;
	width: 250px;
	height: 60px;
	margin-top: 40px;
    background-color: rgb(52, 52, 52);
    display: inline-block;
}	
.email_button:hover {
	background-color: rgb(39, 38, 38) !important;
}
.email_button::after {
	position: absolute;
	color: rgb(255, 255, 255);
	font-family: "source sans pro" !important;
	font-style: normal !important;
	font-size: 24px !important;
	font-weight:300 !important;
	line-height: 1em;
	top: 18px;
	left: 100px;
	content: 'Send Email';
	display: block; 
}
.email_button::before {
	position: absolute;
	left: 30px;
	top: 7px;
	color: rgb(255, 255, 255);
	font-family: 'FontAwesome';
	content: "\f003";
	font-size: 42px;
	display: block;
}
.email_button:hover::before {
	animation: disappear 0.8s;
	transform: matrix(1, 0, 0, 1, 0, 0);
}

	
@keyframes disappear {
  10% {
  	transform: matrix(0.9, 0, 0.2, 0.9, 10, -10);
  }

  20% {
  	transform: matrix(0.8, 0, 0.3, 0.8, 15, -15);
  }

  30% {
  	transform: matrix(0.7, 0, 0.4, 0.7, 20, -20);
  }
  
  40% {
  	transform: matrix(0.6, 0, 0.5, 0.6, 25, -25);
  }
  
  50% {
  	transform: matrix(0.5, 0, 0.6, 0.5, 30, -30);
  }

  60% {
  	transform: matrix(0.4, 0, 0.7, 0.4, 35, -35);
  }
  
  70% {
  	transform: matrix(0.3, 0, 0.8, 0.3, 38, -38);
  }

  80% {
  	transform: matrix(0.2, 0, 0.9, 0.2, 40, -40);
  }
  
  90% {
  	transform: matrix(0.1, 0, 1, 0.1, 42, -42);
  }
    
  
  
}

@keyframes shake {
  10%, 90% {
    transform: rotateZ(10deg);
  }
  
  20%, 80% {
    transform: rotateZ(0deg);
  }

  30%, 50%, 70% {
    transform: rotateZ(-10deg);
  }

  40%, 60% {
    transform: rotateZ(0deg);
  }
}


.flex_container_vertical 
{
	display: -webkit-flex;
    display: flex;	
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
   
}