@charset "UTF-8";


/* ********************************** */
/* css/page/contact.css */

#content {
/* 	background: #2f2f2f; */
	padding-top: 40px;
	padding-bottom: 50px;
}


#content .container {
	background: #FFF;
}


/*! Form */
#mail {
	position: relative;
	float: left;
	width: 50%;
	padding: 20px 80px 0 80px;
	background: no-repeat left 20px transparent;
	background-image: url('img/contact-send-email.jpg');
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#mailTitle {
	display: block;
	font-family: 'eurostile-bold', Arial, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	margin-top: 9px;
	margin-bottom: 30px;
}

.mailRow {
	position: relative;
	margin: 10px auto;
}

.mailRowInput {
	padding-bottom: 5px;
	border-bottom: 1px solid #EEE;
}

.mailInput {
	float: right;
	width: 67%;
	border: none;
	margin-left: 10px;
	height: 15px;
	font-family: 'eurostile-regular', Arial, sans-serif;
	font-size: 18px;
	color:#222;
	background:none;
	text-overflow:ellipsis;
	overflow: hidden;
}

.mailLabel {
	color: #bbbbbb;
	font-family: "eurostile-bold";
	font-size: 14px;
}

.mailLabelRequested {
	color: #26348b;
}

.mailLabelTextarea {
	display: block;
	margin-bottom: 5px;
}

.mailTextarea {
	display: block;
	border: 1px solid #EEE;
	padding: 15px 3%;
	width: 94%;
	font: 18px 'eurostile-regular', Arial, sans-serif;
	color:#222;
	height:160px;
	resize: none;
}

.mailLabelCheckbox {
	display: inline;
	color: #222;
	font-size: 10px;
	margin-left: 5px;
	font-family: "eurostile-bold";
}

.mailRowCheckbox {
	margin-top: 10px;
}


.mailRowSubmit {
	text-align: right;
	margin-bottom:20px;
}

#mailSubmit {
	background: none repeat scroll 0 0 #908dc4;
	border: medium none;
	color: #ffffff;
	cursor: pointer;
	font-family: "eurostile-bold",Arial,sans-serif;
	font-size: 14px;
	padding: 15px 20px;
	
}


/*! Alert */
.alertError {
	color: #C00;
}

.alertOK {
	color: #393;
}



/*! Compagnia */
#company {
	position: relative;
	float: right;
	width: 50%;
}

#companyData,
#companyData2 {
	width: 100%;
	padding: 20px 80px 0;
	background: no-repeat left 20px transparent;
	background-image: url('img/contact-company-data_phone.jpg');
	font-size: 18px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#companyData2{
	background-image: url('img/contact-company-data_map.jpg');
}

#companyData.email{
	background-image: url('img/contact-send-email.jpg');
}

.companyDataLabel {
	display: block;
	font-family: 'eurostile-bold', Arial, sans-serif;
	font-size: 14px;
	text-transform: uppercase;
	margin-top:9px;
}

.companyDataValue {
	display: block;
	margin-bottom: 24px;
}

#map_canvas {
	position: relative;
	width: 100%;
	height: 470px;
}

.desc_page_contact{
	font-size: 16px;
	padding-right: 20px;
}
.desc_page_contact p{
	margin-bottom: 20px;
	display: block;
}
.desc_page_contact a{
	color: #26348b;
	font-family: 'eurostile-bold';
	font-weight: normal;
}

@media only screen and (max-width: 1730px) {
	.mailInput {
		width: 64%;
	}
}
@media only screen and (max-width: 1690px) {
	.mailInput {
		width: 62%;
	}
}
@media only screen and (max-width: 1310px) {
	.mailInput {
		width: 58%;
	}
}

@media only screen and (max-width:1250px) {
	#mail {
		padding:20px 30px 0 80px;
	}
	.mailInput {
	  float: right;
	  font-family: "eurostile-regular",Arial,sans-serif;
	  height: 30px;
	  margin-left: 10px;
	  overflow: hidden;
	  text-overflow: ellipsis;
	  width: 100%;
	}
	.mailRow {
		overflow: hidden;
	}
	.mailRowInput {
	  border-bottom: 1px solid #eeeeee;
	  padding-bottom: 0;
	}
	.mailTextarea {
	  height: 123px;
	  padding: 15px 3%;
	  resize: none;
	  width: 100%;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}
}

@media only screen and (max-width:992px) {
	#mail {
	  padding: 20px 20px 0 80px;
	  width: 100%;
	  border-bottom:20px solid #f3f3f3;
	}
	#company {
	  width: 100%;
	}
	.mailInput {
	  font-size: 14px;
	}
	#companyData,
	#companyData2 {
	  font-size: 14px;
	}
	.companyDataValue {
	  margin-bottom: 30px;
	}
	.companyDataLabel {
		margin-top:0;
	}
	#map_canvas {
	  height: 210px;
	  position: relative;
	  width: 100%;
	}
	.desc_page_contact{
		padding-left: 20px;
	}
}
