

/*  CONTACT PAGE  ============================================================================= */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500&display=swap');



/* NEW CONTACT FORM */
.custom-form {
	float: left;
	width: 100%;
	position: relative;
}
.custom-form textarea,
.custom-form input[type="text"],
.custom-form input[type=email],
.custom-form input[type=password] {
	float: left;
	border: none;
	border: 1px solid #e4e4e4;
	background: #fff;
	width: 100%;
	padding: 20px 30px;
	color: #000;
	font-size: 12px;
	-webkit-appearance: none;
}
.custom-form input::-webkit-input-placeholder,
.custom-form textarea::-webkit-input-placeholder  {
	color: #c4c4c4;
	font-weight: 600;
	font-size: 10px;
	position: relative;
	font-family:Arial;
	text-transform:none;
	letter-spacing:1px;
}
.custom-form input:-moz-placeholder,
.custom-form textarea:-moz-placeholder {
	color: #c4c4c4;
	font-weight: 600;
	font-size: 10px;
	position: relative;
	font-family:Arial;
	text-transform:none;
	letter-spacing:2px;
}
.custom-form textarea {
	height: 200px;
	resize: none;
	padding: 25px 30px;
	-webkit-appearance: none;
}
.custom-form input {
	margin-bottom: 20px;
}
.custom-form button {
	padding: 0   25px;
	outline: none;
	cursor: pointer;
	background:#fff;
	-webkit-appearance: none;
	height:44px;
	line-height:44px;
	float:left;
	position:relative;
	color:#c4c4c4;
	font-size:11px;
	font-weight:700;
	margin:25px 0 15px;
	border: 1px solid #c4c4c4;
	border-radius:5px;
	-webkit-transition:all 0.5s ease;
    transition:all 0.5s ease;
	text-transform:uppercase;
}

.custom-form button:hover {
    border-color:#000 !important;
	color: #000 !important;
    text-decoration: none; 
}
#message {
	text-align:left;
	float:left;
	width:100%;
	padding-bottom:20px;
	color:#222;
}
#message h3 {
	font-size:16px;
	padding-bottom:10px;
}

#success_message {
	text-align: left;
	font-size:15px;
	line-height:23px;
	color:#000;
	text-transform: none;
}

#error_message {
	text-align: left;
	font-size:15px;
	line-height:23px;
	color:red;
	text-transform:none;
}




#map_section 			{margin:30px 0 30px 0; max-height:250px; overflow:hidden;}
#map-canvas 			{width:100%; height:250px;}
#map-canvas img 		{max-width: none; max-height:none;}

.contact 				{background-color:#fff; padding:30px; border: 1px solid #eee;
-webkit-box-shadow: 2px 2px 2px 0px #ccc;  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
-moz-box-shadow:    2px 2px 2px 0px #ccc;  /* Firefox 3.5 - 3.6 */
box-shadow:         2px 2px 2px 0px #ccc;  /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */}}
#contact 				{/*position: relative;*/}

.contact h1 			{font-family: 'Montserrat', sans-serif; font-size:30px; font-weight:300;color:#666; text-shadow:1px 1px 1px #fff; margin-top:0px; text-align:left;}
.contact hr 			{margin:-10px 0 30px 0; border: 0; border-top: 1px solid #eeeeee;}

.contact_info 			{margin-top:10px}
.contact_info .title 	{margin-left:-33px; text-transform:uppercase; color:#777;}

.contact_info p 		{padding-left:33px; margin-bottom:25px; background-position:left top; background-repeat:no-repeat; font-size:15px;}
.contact_info a 		{color: #30B4C5 !important; text-decoration:none;}
.contact_info a:hover 	{color: #555 !important; text-decoration:underline; -webkit-transition:all 0.4s ease; transition:all 0.4s ease;}

.formTitle				{font-family: 'Open Sans', sans-serif; color:#30B4C5; font-size:20px; height:15px; margin-top:17px;}
.formSubtitle			{font-family: 'Open Sans', sans-serif; color:#555; font-size:14px; height:10px;}

.contact_info p.i1 		{color:#30B4C5;}
.contact_info p.i1 span {margin-left:-30px; color:#555;}
.contact_info p.i2 		{margin-left:-30px; color:#555;}
.contact_info p.i3 		{margin-left:-30px; color:#555;}
.contact_info p.i4 		{background-image:url(../img/icons/social-facebook.png);}
.contact_info p.i5 		{background-image:url(../img/icons/social-linkedin.png);}
.contact_info p.i6 		{background-image:url(../img/icons/social-twitter.png);}

@media only screen and (max-width: 979px) {
.contact_info p 		{margin-bottom:10px;}
.formTitle				{margin-top:30px;}
}
@media only screen and (max-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
.contact_info p.i4 		{background-image:url(../img/icons/social-facebook@2x.png); background-size: 13px 13px; background-repeat: no-repeat; margin-left:1px;}
.contact_info p.i5 		{background-image:url(../img/icons/social-linkedin@2x.png); background-size: 13px 13px; background-repeat: no-repeat; margin-left:1px;}
.contact_info p.i6 		{background-image:url(../img/icons/social-twitter@2x.png); background-size: 13px 13px; background-repeat: no-repeat; margin-left:1px;}
}

@media only screen and (min-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
.contact_info p.i4 		{background-image:url(../img/icons/social-facebook@2x.png); background-size: 20px 20px; background-repeat: no-repeat; margin-left:1px;}
.contact_info p.i5 		{background-image:url(../img/icons/social-linkedin@2x.png); background-size: 20px 20px; background-repeat: no-repeat; margin-left:1px;}
.contact_info p.i6 		{background-image:url(../img/icons/social-twitter@2x.png); background-size: 20px 20px; background-repeat: no-repeat; margin-left:1px;}
}


form input {
	background: #fff !important;
	width: 100%;
	margin-top: 0;
	margin-bottom: 10px !important;
	padding: 10px 29px 10px 17px !important;
	border:1px #c4c4c4 solid !important;
	outline:none !important;
	border-radius:4px !important;
	-webkit-border-radius:4px !important;
	box-shadow:none !important;
	font-size:13px !important;
	color:#adadad !important;
	font-family:Arial;
	line-height:20px;
}

form textarea {
	background: #fff !important;
	width: 100%;
	height: 84px !important;
	margin-top: 0;
	margin-bottom: 10px !important;
	padding: 8px 29px 8px 17px !important;
	resize: none;
	border:none !important;
	border:1px #c4c4c4 solid !important;
	outline:none !important;
	border-radius:4px !important;
	-webkit-border-radius:4px !important;
	box-shadow:none !important;
	font-size:13px !important;
	color:#adadad !important;
	font-family:Arial;
	resize:none;
}

form input:hover,
textarea:hover {
	border:1px #222 solid !important;
}

input:focus, textarea:focus{
	border:1px #222 solid !important;
}

/*******************form valid style***************************/
.notification_error,
.notification_ok {
    border-radius: 5px;
    margin: 2px 0 13px 0;
    padding: 12px 10px 12px 35px;
	position:relative;
	font-size:13px;
	width:75%; 
	margin-top:-5px; 
	padding-top:6px; 
	padding-left:40px;
}
.notification_ok {
    border: 1px #038BD4 solid;
    color: #038BD4;
	background:#D0E3EA;
}
.notification_error {
    color: #C93119;
	background:#FFCFCF;
}
.notification_error:before,
.notification_ok:before {
    content: ''; 
	width: 16px;
	height: 16px;
	position: absolute;
	left:11px;
	top:13px;		
	background-position:0 0;
	background-repeat:no-repeat;
}

.notification_error:before {background-image:url(../img/icons/error.png);}
.notification_ok:before {background-image:url(../img/icons/info.png);}

input.send_btn {
	cursor: pointer;
	background: #fff !important;
	color: #c4c4c4 !important;
	margin: 0 6px 10px 0 !important;
	display: inline-block;
	padding: 0 15px !important;
	height:40px;
	line-height:40px;
	font-size: 12px !important;
	font-weight: 400 !important;
	width: auto !important;
	font-family: 'Open Sans', sans-serif;
	vertical-align:top;
	-webkit-transition:all 0.5s ease;
    transition:all 0.5s ease;
	text-transform:uppercase;
	border-color:#c4c4c4 !important;
}

input.send_btn:hover {
    border-color:#000 !important;
	color: #000 !important;
    text-decoration: none; 
}
input.clear_btn {
	cursor: pointer;
	background: #fff !important;
	color: #666666 !important;
	margin: 0 6px 10px 0 !important;
	display: inline-block;
	padding: 0 15px !important;
	height:40px;
	line-height:40px;
	font-size: 12px !important;
	font-weight: 400 !important;
	width: auto !important;
	font-family: 'Open Sans', sans-serif;
	vertical-align:top;
	-webkit-transition:all 0.5s ease;
    transition:all 0.5s ease;
	text-transform:uppercase;
	border-color:#67635d !important;
}
input.clear_btn:hover {
    border-color:#ff9000 !important;
	color: #ff9000 !important;
    text-decoration: none; 
}
.required {
	background-image: url(../img/icons/required.png) !important;
	background-position:right top !important;
	background-repeat:no-repeat !important;
}

#note {margin-top:10px;}

@media only screen and (max-width: 400px) {
.contact				{padding-left:10px; padding-right:10px;}

.contact h1 			{font-size:20px;}
.contact hr 			{margin:-10px 0 20px 0;}
#map_section 			{margin:0px 0 10px 0;}


.contact_form p 		{font-size:12px}

.contact .title 		{font-size:13px;}

.contact .formTitle		{font-size:20px;}
.contact .formSubtitle	{padding-bottom:25px;}

form input 				{padding: 8px 29px 8px 5px !important; font-size:12px !important;}
form textarea 			{padding: 8px 29px 8px 5px !important; font-size:12px !important;}
input.send_btn 			{font-size: 12px !important;}
}

