/* Contact Template */
img{max-width: 100%; }
.contactHeader {
  /* min-height: 300px; */
   background-color: #aab5c5;
    margin-bottom: 100px; }
    h1.pageTitle {
    	font-family: Raleway-ExtraBold;
    	font-size: 46px;
    	/* font-weight: 800; */
    	line-height: 1.17;
    	color: #222d39;
    }
.contactHeader .text {
	padding: 70px 68px;
	background-image: url('../images/contactHeader1x.png');
	background-position: left top;
	background-repeat: no-repeat;
}
.contactHeader .pageText {
	font-family: 'HelveticaNeue';
	font-size: 18px;
	line-height: 1.45;
	color: #ffffff;
}
.numberSection .numText h3 {
	font-family: Raleway-ExtraBold;
	font-size: 30px;
	/* font-weight: 800; */
	line-height: 1.17;
	text-align: left;
	color: #222d39;
	margin-bottom: 17px;
}
.numberSection .numText p{
  font-family: 'Poppins';
  font-size: 20px;
  line-height: 1.45;
  color: #aab5c5;
}
.numberSection .numText p i{ font-size: 18px; color: #008cff; margin-right: 10px; }
.contactContent .letfContent {
    max-width: 675px;
    float: left;
}
.rightContent {
    max-width: 320px;
    float: right;
}
.contactContent .letfContent .numberSection {
	border-radius: 5px;
	border: solid 1px #ededed;
	padding: 15px 50px;
	display: flex;
	display: -webkit-flex;
	display: -ms-flex;
  margin-bottom: 5%;
}
.contactContent .numberSection .img{ max-width: 131.2px; }
.maxContent {
	max-width: 1000px;
	margin: 0 auto;
}
.contactContent .numberSection .numText { margin-left: 83.4px; margin-top: 31.7px; }
.hLine {
	font-family: Poppins;
	font-size: 24px;
	line-height: 1.67;
	text-align: center;
	color: #aab5c5;
  margin-bottom: 4%;
}
.hLine::before {
	content: "";
	border-bottom: 1px solid #d4d6d9;
	display: block;
	position: relative;
	top: 23px;
	width: 100%;
}
.hLine p {
	display: inline-block;
	background: #fff;
	padding: 0 12px;
	z-index: 9;
	margin: 0;
	position: relative;
}
.formSection-title {
	font-family: Raleway-ExtraBold;
	font-size: 32px;
	line-height: 1.17;
	text-align: center;
	color: #008cff;
	margin-top: 6%;
}
.formSection-title:first-child {
  margin-top: 0;
}
.formSection-title + formSection-text {
	margin-top: 6%;
}

.formSection-text {
	font-family: Poppins;
  font-size: 18px;
  color: #888;
	margin-bottom: 4%;
}
.wpcf7-form-control-wrap input , .wpcf7-form-control-wrap textarea {
  border-radius: 5px;
  border: solid 1px #f0f2f6;
  background-color: #f9fafb;
  padding: 12px 40px 12px 40px;
}
.wpcf7-form-control-wrap input::-moz-placeholder , .wpcf7-form-control-wrap input::placeholder ,
.wpcf7-form-control-wrap textarea::-moz-placeholder , .wpcf7-form-control-wrap textarea::placeholder {
  font-family: Poppins;
  font-size: 14px;
  text-align: left;
  color: #aab5c5;
}
.wpcf7-form-control.wpcf7-submit {
	background-color: #ff7655;
	font-family: poppinsmedium;
	font-size: 16px;
	line-height: 1.19;
	text-align: center;
	color: #ffffff;
	padding: 15px 70px 15px 55px;
	border: 1px solid #ff7655;
	transition: all .3s ease;
}
.contact-icon-inner {
	position: absolute;
	top: 19px;
	display: block;
	z-index: 99;
	margin-left: 25px;
	color: #008cff;
	font-size: 12px;
}
.contact-icon {
	position: relative;
	margin-bottom: 25px;
}
.contact-required .wpcf7-form-control-wrap::after {
	content: "\A";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #008cff;
	top: 20px;
	position: absolute;
	right: 28px;
}
div.wpcf7 .ajax-loader {
	display: none;
}
.wpcf7-form-control-wrap {
	display: block;
}
.contact-btn {
	margin-top: 40px;
	text-align: center;
	position: relative;
	display: inline-block;
}
.wpcf7-form {
	text-align: center;
}
.contact-btn .fas.fa-chevron-right {
	position: absolute;
	top: 19px;
	right: 50px;
	font-size: 14px;
	color: #fff;
}
.page-template-contactExpert .footer-above {
	display: none;
}
.contact-btn input:hover, .contact-btn input:active, .contact-btn input:focus ,
.contact-btn:hover .fas.fa-chevron-right , .contact-btn:active  .fas.fa-chevron-right, .contact-btn:focus  .fas.fa-chevron-right{
	color: #ff7655;
	background: transparent;
}

/* ----------------- OM CUSTOMIZATIONS ----------------- */
.side-section {
  border-radius: 5px;
  border: solid 1px #ededed;
  padding: 5px 25px 15px;
  margin-bottom: 5vh;

  font-family: Poppins;
  font-size: 18px;
  color: #888;
  text-align: center;
}
.side-section .side-section-text {
  margin-bottom: 5px;
  margin-top: 10px;
}
.side-section .side-section-text:first-child {
  margin-top: 20px;
}

.side-section a.link-button {
  font-family: Raleway-ExtraBold;
  font-size: 16px;
  line-height: 1.19;
  text-align: center;
  color: #ffffff;
  background-color: #008cff;
  padding: 16px 25px 16px 25px;
  display: inline-block;
  border-radius: 5px;
  border: 1px solid #008cff;
  transition: all 0.4s ease;
  margin-top: 10px;
}
.side-section a.link-button::after {
    content: '\276F';
    margin-left: 10px;
	margin-left: 10px;
}
.side-section a.link-button:hover,
.side-section a.link-button:active,
.side-section a.link-button:focus {
	color: #008cff;
	background: transparent;
}
.side-section a.link-button.secondary {
  margin-top: 0;
  color: #3e4854;
  background-color: transparent;
  border: none;
}
.side-section a.link-button.secondary::after {
  color: #ff7655;
}
.side-section a.link-button.secondary:hover,
.side-section a.link-button.secondary:active,
.side-section a.link-button.secondary:focus {
  color: #ff7655;
}

/* ----------------- OM CUSTOMIZATIONS END ----------------- */

/* TOREMOVE 1 -----------*/
.rightContent-top {
  border-radius: 5px;
  border: solid 1px #ededed;
  padding: 35px 25px;
}
.rightContent-top-qn {
	font-family: Raleway-ExtraBold;
	font-size: 28px;
	/* font-weight: 800; */
	line-height: 1.2;
	text-align: left;
	color: #3e4854;
	margin-bottom: 20px;
}
.rightContent-top-qntext a {
	font-family: Raleway-ExtraBold;
	font-size: 16px;
	line-height: 1.19;
	text-align: center;
	color: #ffffff;
	background-color: #008cff;
	padding: 16px 25px 16px 25px;
	display: inline-block;
	border-radius: 5px;
	border: 1px solid #008cff;
	transition: all 0.4s ease;
}
.rightContent-top-qntext a::after {
    content: '\276F';
	margin-left: 10px;
}
.rightContent-top-qntext a:hover, .rightContent-top-qntext a:active, .rightContent-top-qntext a:focus {
	color: #008cff;
	background: transparent;
}
/* END - TOREMOVE 1 -----------*/

.contact_client_title {
	font-family: Raleway-ExtraBold;
	font-size: 30px;
	/* font-weight: 800; */
	line-height: 1.17;
	text-align: left;
	color: #222d39;
	margin: 20px 0;
}
.contact_client_content {
  font-family: Poppins;
  font-size: 18px;
  line-height: 1.61;
  text-align: left;
  color: #aab5c5;
}
.contact_client_content span {
	color: #008cff;
	text-decoration: underline;
}
/* TO REMOVE */
.rightContent-middle {
	margin: 20% 0 12%;
}
.rightContent-middle-client img {
	width: 30%;
}
.rightContent-bottom-writeus img {
	width: 50%;
}
/* END TO REMOVE */

.contact_write_us_title {
	font-family: Raleway-ExtraBold;
	font-size: 30px;
	/* font-weight: 800; */
	line-height: 1.17;
	text-align: left;
	margin: 20px 0;
	color: #aab5c5;
}
.contact_write_us_content {
  font-family: Poppins;
  font-size: 18px;
  line-height: 1.61;
  text-align: left;
  color: #aab5c5;
}



/* Overview Template */

.mainOverview .overviewHeader{ background-color: #f9fbfd;     margin-bottom: 100px; position: relative; overflow: hidden; }
.mainOverview .overviewHeader .container { position: relative;}
.mainOverview .overviewHeader .container::before {
    content: "";
    background-image: url(../images/contactHeader1x.png);
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: 100% 0%;
    width: 380px;
    height: 323px;
    display: inline-block;
    position: absolute;
    bottom: 0;
}

.mainOverview .overviewHeader .container::after {
  content: "";
  background-image: url(../images/overview-image1.png);
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: 100% 27%;
  width: 666px;
  height: 323px;
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: 0;
}
.mainOverview h1.pageTitle {
	color: #008cff;
	margin-bottom: 10px;
	font-family: Raleway-ExtraBold;
	font-size: 46px;
	/* font-weight: 800; */
	line-height: 1.17;
}
.mainOverview .overviewHeader .pageText{font-family: 'Poppins'; color: #3e4854;font-size: 21px; font-weight: 300; line-height: 1.45; }
.mainOverview .overviewHeader .text , .facturation-inner .facturationheader .text { padding: 70px 15px; }


/**************** MEDIA CSS *******************/
@media screen and ( max-width: 991px ) {
.contactHeader .text {
	padding: 70px 20px;
}
.contactContent .letfContent , .rightContent{
	max-width: 100%;
	float: none;
}
.rightContent {
	margin: 6% 0;
}
/* TO REMOVE */
.rightContent-middle-client img , .rightContent-bottom-writeus img{
	width: auto;
}
.rightContent-middle {
	margin: 10% 0 10%;
}
/* END TO REMOVE */
}

@media screen and ( max-width: 767px ) {
h1.pageTitle {
	font-size: 38px;
}
.numberSection .numText h3 {
	font-size: 22px;
}
.numberSection .numText p {
	font-size: 16px;
}
}
@media screen and ( max-width: 640px ) {
.contactHeader {
	margin-bottom: 50px;
}
.contactContent .letfContent .numberSection {
	padding: 25px 40px;
	margin-bottom: 5%;
  display: block;
}
.contactContent .numberSection .numText {
	margin-left: 0;
}
}


/* ------------------------- OM - FORMS ------------------------- */
.app-react {
  margin: 0;
  min-height: 20rem;
  transition: all 0.6s;
}
.app-react-splash {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: space-around;
}
.app-react-spinner {
  background-image:url('https://via.proabono.com/Content/Images/Tools/load-ring.svg');
  background-repeat: no-repeat;
  background-position: bottom;
  min-height: 80px;
  min-width: 80px;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
}

.nice-form label {
	font-weight: 200;
}

.nice-form .field-row {
	position: relative;
	display: block;
	margin-bottom: 22px;
}

.nice-form .field-label {
	position: absolute;
	top: -12px;
	left: 14px;
	background-color: #fff;
	padding-right: 0 !important;
	padding: 0 6px !important;
  z-index: 10;
  border-radius: 8px;

	font-family: Poppins;
	font-size: 18px;
	color: #aab5c5;	
}

/* text */
.nice-form .input-text {
	height: 50px !important;
}
.nice-form .input-text.single-line > input {
	height: 50px;
	padding: 10px !important;
}
.nice-form .input-text:not(.single-line) {
	height: auto !important;
}
.nice-form .input-text:not(.single-line) > textarea {
	height: 100px;
	padding: 10px !important;
}
/* select */
.nice-form .wrap-select .select > button {
  min-height: 50px !important;
}
.nice-form .wrap-select {
	height: 50px !important;
}
.nice-form .wrap-select .control button,
.nice-form .wrap-select .options button {
  color: #888;
  font-weight: 200;
}

.nice-form .input-text:hover,
.nice-form .input-text.focused,
.nice-form .select:hover,
.nice-form .select.focused {
	box-shadow: none !important;
}

.nice-form .field-value.required.missing:before,
.nice-form .field-value .required.missing:before {
  color: #008cff;
}

.nice-form .button-ok {
  font-family: poppinsbold;
  font-size: 16px;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.19;
  letter-spacing: 0.5px;
  text-align: center;
  color: #ffffff !important;
  background-color: #008cff !important;
  padding: 16px 25px 16px 25px !important;
  border-radius: 5px !important;
  border: 1px solid #008cff !important;
  transition: background-color 0.5s ease-out !important;
}
.nice-form .button-ok:after {
    content: '\276F';
	margin-left: 10px;
}
.nice-form .button-ok:hover,
.nice-form .button-ok:active,
.nice-form .button-ok:focus {
	color: #008cff !important;
	background: transparent !important;
}
.nice-form .form-success a {
  font-weight: bold;
  color: #007bff;
}

