/* Add here all your CSS customizations */
a,
button,
input:focus,
input[type="button"],
input[type="reset"],
input[type="submit"],
textarea:focus,
.button
{
	font-family: 'Roboto',​Arial,​sans-serif;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	-webkit-transition: all 0.1s ease-in-out;
	-moz-transition:    all 0.1s ease-in-out;
	-ms-transition:     all 0.1s ease-in-out;
	-o-transition:      all 0.1s ease-in-out;
	transition:         all 0.1s ease-in-out;
}
body { font-family: 'Roboto',​Arial,​sans-serif; font-size: 16px; color: #333; font-weight: 300; background: #fff; }
h1 { font-size: 60px; }
h2 { font-size: 36px; letter-spacing: 1px; }
h1, h2, h3, h1 a, h2 a, h3 a { color: #333; font-family: 'Conv_Eurostib'; text-transform: uppercase; }
p { color: #333; margin-bottom: 20px; }
a { color: #d73f4e; }
a:hover, a:focus { color: #000; text-decoration: none; }
.rounded { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
.rounded-lg { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; }
hr { border-color: #e2e2e2; }



/*** header ********************************/
#header { position: fixed; width: 100%; z-index: 100; }
#header-logo { display: block; position: relative; top: 0; width: 511px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition:    all 0.3s ease-in-out;
	-ms-transition:     all 0.3s ease-in-out;
	-o-transition:      all 0.3s ease-in-out;
	transition:         all 0.3s ease-in-out;
}

#mainnav { margin: 0; position: absolute; top: 30px; left: 0; width: 100%; background: #d73f4e; padding: 20px 0; }
#menu { float: right; }
#menu li { margin: 0 0 0 25px; }
#menu a { padding: 5px 0; margin: 0; color: #fff; font-size: 16px; border-bottom: 2px solid transparent; font-family: 'Conv_Eurostib'; text-transform: uppercase; letter-spacing: 1px; background: transparent; text-shadow: rgba(0,0,0,0.1) 1px 1px 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
#menu .active a, #menu .active a:visited, #menu .active a:hover, #menu .active a:focus { border-color: #fff; }

.sticky-header-active #mainnav, .loadNotTopPage #mainnav { top: 0; padding: 10px 0; }
.sticky-header-active #header-logo, .loadNotTopPage #header-logo { width: 120px; }


/*** langs ***/
#langs { position: absolute; top: 15px; right: 25px; }
#langs a { color: #fff; font-size: 14px; padding: 3px 10px; border: 1px solid #555; display: inline-block; margin-right: 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
#langs a:hover, #langs a:focus { background: rgba(0,0,0,0.2); }
#langs a.active, #langs a.active:hover, #langs a.active:focus { background: #df7724; color: #fff; border: none; }



#menu-trigger { display: block; display: none; height: 60px; width: 60px; line-height: 60px; font-size: 30px; position: absolute; top: 30px; border-left: 1px solid white; right: 0; color: #fff; padding: 0; text-align: center; z-index: 10000; }

/*** btn ***/
.btn, input.btn { padding: 10px 30px; border: none; text-transform: uppercase; letter-spacing: 0.5px; position: relative; font-family: 'Conv_Eurostib'; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; }
.btn-primary { background: #d73f4e; }

.btn-default { background: #fff; color: #333; border: 1px solid #a2a2a2; }
.btn-default:hover, .btn-default:focus { background: #d73f4e; color: #fff; border-color: #d73f4e; }
.btn-with-arrow { padding-right: 50px; }
.btn-with-arrow:after { font-size: 18px; position: absolute; top: 0; right: 0; color: #d73f4e; padding: 11px 15px 0; border-left: 1px solid #ccc; height: 100%; line-height: 1; content:"\f0da"; font-family: 'Font Awesome 5 Pro'; }
.btn-with-arrow:hover:after, .btn-with-arrow:focus:after, .btn-with-arrow:active:after { color: #fff; border-color: #fff; }

.btn-info { background: #333; color: #fff; }
.btn-info:hover, .btn-info:focus { background: #fff; color: #333; }
.btn-info:active { background: #fff; color: #d73f4e; }



/*** promo ****************/
#promo-text { position: absolute; top: 400px; left: 0; width: 100%;  }
#promo-text .container { padding-left: 150px; }
#promo-text h1 { color: #d73f4e; text-shadow: rgba(0,0,0,0.5) 1px 1px 3px; padding: 0; margin: 0 0 20px 0; }
#promo-text .lead { font-size: 22px; width: 55%; font-weight: 300; letter-spacing: 1.2; text-shadow: rgba(255,255,255,0.5) 0 0 5px; }
#promo-text .btns { padding: 10px 0 0; }

/*** section ***/
.section { text-align: center; padding: 110px 0; }
h2.with-line { position: relative; padding-bottom: 20px; margin-bottom: 40px; margin-top: 0; line-height: 1.1; }
h2.with-line:after { width: 150px; margin-left: -75px; display: block; content:""; height: 0; border-bottom: 5px solid #d73f4e; position: absolute; bottom: 0; left: 50%; }
.section .lead { width: 90%; margin-left: auto; margin-right: auto; }

.section-inverse { background: #777b87; }
#whatwedo { background: url(../images/section-bg-1.jpg) no-repeat center top / 100% auto; }
.section-inverse h2, .section-inverse p { color: #fff; }


/*** steps ******/
#steps-items { text-align: left; overflow: hidden; background: url(../images/steps-man.png) no-repeat 0 0; padding: 8px 0 0; }
#steps-items .step { float: right; font-size: 22px; height: 70px; padding: 20px 30px; border-left: 13px solid #d73f4e; background: #dfdfdf url(../images/steps-item-bg.png) no-repeat right top; font-weight: 400; line-height: 30px; margin-bottom: 10px; }
#steps-items .step1 { width: 60%; }
#steps-items .step2 { width: 70%; }
#steps-items .step3 { width: 80%; }
#steps-items .step4 { width: 90%; }
#steps-items .step5 { width: 100%; }


/*** services ******/
#services { background: #dfdfdf; }
#services-items { }
#services-items .service { margin: 0 0 10px 0; }
#services-items .service-icon { font-size: 80px; margin-bottom: 5px; color: #be757c; line-height: 120px; }
#services-items p { padding: 0 5%; }
#services-items .service1 .service-icon { font-size: 85px; color: #76ac8d; }
#services-items .service2 .service-icon { font-size: 90px; }
#services-items .service3 .service-icon { font-size: 80px; color: #8e9cc1; }
#services-items .service4 .service-icon { font-size: 80px; color: #ba9c62; }
#services-items .service5 .service-icon { font-size: 85px; color: #bdc579; }
#services-items .service6 .service-icon { font-size: 90px; color: #b8a9a9; }
#services-items .service7 .service-icon { font-size: 85px; color: #b896c0; }
#services-items .service8 .service-icon { font-size: 85px; color: #91b7be; }

/*** contacts ***/
#contacts { background: #d73f4e; }
#contacts h2.with-line:after { border-color: #e37983; }
#contacts .form-group { margin-bottom: 20px; }
#contacts .form-control { color: #333; font-size: 17px; padding: 10px 15px; height: 44px; background: #dd9199; font-weight: 300; border: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
#contacts .form-control:focus { background: #e3e3e3; }
#contacts textarea.form-control { height: auto; width: 100%; }

#contactForm { width: 60%; padding: 20px 0 0; margin: auto; }

#contacts .form-control::-webkit-input-placeholder { color: #fff; /* Chrome/Opera/Safari */ }
#contacts .form-control:-moz-placeholder { color: #fff; /* Firefox 18- */ }
#contacts .form-control::-moz-placeholder { color: #fff; /* Firefox 19+ */ }
#contacts .form-control:-ms-input-placeholder { color: #fff; /* IE 10+ */ }

#contacts .form-control:focus::-webkit-input-placeholder { color: #333; /* Chrome/Opera/Safari */ }
#contacts .form-control:focus:-moz-placeholder { color: #333; /* Firefox 18- */ }
#contacts .form-control:focus::-moz-placeholder { color: #333; /* Firefox 19+ */ }
#contacts .form-control:focus:-ms-input-placeholder { color: #333; /* IE 10+ */ }

#contacts label.error { font-weight: normal; font-size: 14px; }
#contacts a {color:#fff;text-decoration:underline;}
.btn-submit { font-size: 18px; }

#contactSuccess { background: #fff; }



/*** footer *******************************/
#footer { background: #fff; }
#footer-cnt { padding: 40px 0; color: #666; }
#footer-logo { width: 120px; }
#footer-menu ul { list-style: none; padding: 0; margin: 0; }
#footer-menu ul li { float: left; width: 45%; margin-right: 5%; padding-bottom: 5px; }
#footer-menu ul li a { color: #666; }
#footer-menu ul li a:hover, #footer-menu ul li a:focus { color: #333; }
#footer-contacts { text-align: right; color: #aaa; }
#footer-contacts strong { font-weight: normal; color: #666; }

#footer-bottom { background: #424242; color: #a6a6a6; padding: 10px 0; font-size: 14px; }
#footer-bottom .copyright { padding-top: 12px; }
#footer-socials { text-align: right; }
#footer-socials a { font-size: 30px; color: #fff; opacity: 0.5; padding: 0 10px; }
#footer-socials a:hover, #footer-socials a:focus { opacity: 1; }
#footer-socials .fa-facebook-f { font-size: 26px; }


/*** debug ***********************/
#debug-block { display: none; position: fixed; top: 0; left: 0; z-index: 1000; line-height: 1; }
#debug-responsive { border: 1px solid #000; height: 10px; width: 10px; opacity: 1; background: #fff; display: inline-block; }
#debug-resolution { font-size: 10px; line-height: 1; padding: 3px; background: rgba(255,255,255,0.7); display: inline-block; }
#debug-bodyclass { font-size: 10px; line-height: 1; padding: 3px; background: rgba(0,0,0,0.7); color: #fff; display: inline-block; }