/*--------------------------------------------------------
Fonts
--------------------------------------------------------*/

@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/roboto-regular-webfont.woff2') format('woff2'),
         url('../fonts/roboto-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotothin_italic';
    src: url('../fonts/roboto-thinitalic-webfont.woff2') format('woff2'),
         url('../fonts/roboto-thinitalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotolight';
    src: url('../fonts/roboto-light-webfont.woff2') format('woff2'),
         url('../fonts/roboto-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/*--------------------------------------------------------
Reset
--------------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

.typed-cursor {
  display: none;
}

/*--------------------------------------------------------
CSS Animations
--------------------------------------------------------*/

/* Hang */
@-webkit-keyframes hvr-hang {
  0% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  50% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  100% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
}
@keyframes hvr-hang {
  0% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  50% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  100% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
}
@-webkit-keyframes hvr-hang-sink {
  100% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
}
@keyframes hvr-hang-sink {
  100% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
}
.hvr-hang {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-animation-name: hvr-hang-sink, hvr-hang;
  animation-name: hvr-hang-sink, hvr-hang;
  -webkit-animation-duration: .3s, 1.5s;
  animation-duration: .3s, 1.5s;
  -webkit-animation-delay: 0s, .3s;
  animation-delay: 0s, .3s;
  -webkit-animation-timing-function: ease-out, ease-in-out;
  animation-timing-function: ease-out, ease-in-out;
  -webkit-animation-iteration-count: 1, infinite;
  animation-iteration-count: 1, infinite;
  -webkit-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-direction: normal, alternate;
  animation-direction: normal, alternate;
}

/* Underline From Center */

.hvr-underline-from-center {
  display: inline-block;
  vertical-align: middle;
  line-height: 32px;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  position: relative;
  overflow: hidden;
}
.hvr-underline-from-center:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 50%;
  right: 50%;
  bottom: 0;
  background: rgba(52, 73, 94,0.8);
  height: 1px;
  -webkit-transition-property: left, right;
  transition-property: left, right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hvr-underline-from-center:hover:before, .hvr-underline-from-center:focus:before, .hvr-underline-from-center:active:before {
  left: 0;
  right: 0;
}

/* Pop */
@-webkit-keyframes hvr-pop {
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}
@keyframes hvr-pop {
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}
.hvr-pop {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
}
.hvr-pop:hover, .hvr-pop:focus, .hvr-pop:active {
  -webkit-animation-name: hvr-pop;
  animation-name: hvr-pop;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Grow */
.hvr-grow {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-grow:hover, .hvr-grow:focus, .hvr-grow:active {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

/*--------------------------------------------------------
Global styles
--------------------------------------------------------*/

body, html {
    height: 100%;
}

body {
  position: relative;
  font-family: 'robotolight', sans-serif;
  color: #113854;
  background-color: #fefdf9;
}

h1,h2 {
  margin: 45px auto;
  text-align: center;
  font-size: 35px;
  line-height: 37px;
  color: rgba(52, 73, 94,0.8);
}

h1::after,
h2::after {
  content: "";
  display: block;
  height: 1px;
  background-color: rgba(52, 73, 94,0.2);
  width: 240px;
  margin: 13px auto;
}

h3 {
  font-size: 22px;
  line-height: 31px;
  font-family: 'robotolight',sans-serif;
}

h4 {
  text-align: justify;
}

a {
    color: inherit;
    transition: 0.3s;
}

a:hover, a:focus {
  color: inherit;
  text-decoration: none;
  outline: none;
  cursor: pointer;
}

strong {
  font-family: 'robotoregular', sans-serif;
}

hr {
  margin-top: 30px;
  margin-bottom: 30px;
  border: 0;
  border-top: 1px solid #eee;
}

section {
  padding-bottom: 91px;
  font-size: 19px;
  line-height: 26px;
}

section p {
  text-align: justify;
  margin-bottom: 20px;
}

section ul li {
  text-align: justify;
  padding-left: 30px;
  margin: 15px 0;
  background: url("../images/left-arr.png") no-repeat 8px 7px;
  background-size: 12px;
}

.audit-methods li {
  background-image: none;
}

.align-middle {
  vertical-align: middle;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

/* Remove parallax scrolling in IE/Edge */
.ie .parallax {
    background-attachment: inherit;
}

.parallax {
  height: 400px;
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: inset 0 0 10px #090909;
}

.parallax.parallax-front {
    position: relative;
    /* The image used */
    background-image: url("../images/front.jpeg");
    /* Full height */
    height: 100%;
}

.slogan-field {
  position: absolute;
  top: 44%;
  right: 0;
  left: 0;
  text-align: center;
  font-family: 'robotothin_italic', sans-serif;
  color: #454343;
  opacity: 0.9;
  font-size: 38px;
}

.parallax-services {
  background-image: url("../images/services.jpg");
}

.parallax-clients {
  background-image: url("../images/clients.jpg");
}

.parallax-career {
  background-image: url("../images/career.jpg");
  -ms-background-position-y: 30%;
}

.parallax-partners {
  background-image: url("../images/partners.jpg");
}

.parallax-contacts {
  background-image: url("../images/contacts.jpg");

}

#go-top-arr {
  display: none;
  overflow: hidden;
  position: fixed;
  bottom: 25px;
  right: 15px;
  transition: 0.3s;
}

#go-top-arr img {
  height: 32px;
}

#go-top-arr:hover,
#go-top-arr:focus {
  cursor: pointer;
  opacity: 0.8;
}

/*--------------------------------------------------------
HEADER + NAVIGATION
--------------------------------------------------------*/
header {
    position: fixed;
    z-index: 10;
    opacity: 0.9;
    background-color: #F8F8F8;
    width: 100%;
}

.logo_container {
  display: block;
}

#logo {
  max-width: 100%;
}

.main_nav {
  text-align: center;
}

.main_nav li {
  display: inline-block;
  vertical-align: middle;
}

.nav-sandwich-btn {
     display: none;
     padding: 2px 7.5px;
     border: 1px solid #505d6b;
     border-radius: 2px;
     margin: 6px 0;
}

.nav-sandwich-btn span {
  display: block;
  height: 2px;
  width: 20px;
  background-color: #505d6b;
  margin: 4px 0;
  transition: 0.3s;
}

.change .bar1 {
  -webkit-transform: rotate(-50deg) translate(-8px, -1px);
  transform: rotate(-50deg) translate(-8px, -1px);
}

.change .bar2 {
  opacity: 0;
}

.change .bar3 {
  -webkit-transform: rotate(50deg) translate(-1px, -9px);
  transform: rotate(50deg) translate(-1px, -9px);
}

/* for nav items* */
.main_nav li a {
  display: block;
  padding: 36px 5px;
  border-bottom: 2px solid transparent;
  font-size: 17px;
  text-transform: uppercase;
  color: rgba(52, 73, 94, 1);
  transition: 0.3s;
}

.lang-wrapper {
  text-align: right;
}

.lang-link {
  display: inline-block;
  margin-top: 30px;
  padding: 4px 6px;
  border-radius: 2px;
  font-family: 'robotolight';
  font-size: 16px;
  color: #505d6b;
  cursor: pointer;
  transition: 0.3s;
  border: 1px solid #505d6b;
}

.lang-link:hover {
  background-color: #505d6b;
  opacity: 0.4;
  color: #fafafa;
}

.main_nav li a.active {
  border-bottom: 2px solid #6C7A89;
}

.go_down {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-align: center;
  opacity: 0.8;
  padding-bottom: 15px;
}


/*--------------------------------------------------------
SECTIONS
--------------------------------------------------------*/

/******* ABOUT_US *******/

/******* SERVICES *******/

/******* CLIENTS *******/

.company-name {
  color: rgba(52, 73, 94,1);
}

/******* OUR_TEAM *******/

/******* CAREER *******/
#career {
  background-color: rgba(200,200,200,0.2);
}

/******* PARTNERS *******/

/******* CONTACTS *******/

#contacts {
  background-color: rgba(248, 248, 248,0.8);
  padding: 85px 0 91px;
}

.contact-info-wrapper h3 {
  margin-bottom: 25px;
  font-size: 25px;
}

.contact-info-wrapper p {
  margin-bottom: 10px;
  font-size: 22px;
}

.contact-info-wrapper p > span {
  /*font-family: 'robotolight',sans-serif;*/
}

.contact-info-wrapper p > a {
  margin-left: 10px;
}

#map {
  cursor: pointer;
}

#map iframe {
  pointer-events: none;
}

/*--------------------------------------------------------
FOOTER
--------------------------------------------------------*/

footer {
    background-color: rgba(52, 73, 94,0.4);
    padding: 15px 0;
}

.copyright-container{
  text-align: left;
}

.developer-container {
  text-align: right;
}

.developer-link {
  transition: 0.3s;
}

/*--------------------------------------------------------
MEDIA
--------------------------------------------------------*/

@media (max-width: 991px) {

  .main_nav li a {
    padding: 25px 3px;
    font-size: 13px;
  }

  .lang-link {
    margin-top: 19px;
    font-size: 12px;
  }

  .slogan-field {
    font-size: 26px;
  }

  .parallax {
    height: 350px;
    background-attachment: inherit;
    background-position: 0 40%;
  }

  h2 {
    font-size: 30px;
  }

  section p, section ul li {
    font-size: 90%;
  }

  .contact-info-wrapper h3 {
    font-size: 21px;
  }

  .contact-info-wrapper p {
    font-size: 19px;
  }

  #map iframe {
    height: 320px;
  }

}

@media (max-width: 767px) {

  header {
    position: absolute;
  }

  .logo_container {
    text-align: center;
  }

  #logo {
    height: 70px;
  }

  .lang-link {
    font-size: 18px;
    margin: 6px 0;
  }

  .nav-sandwich-btn {
    display: inline-block;
  }

  .nav-wrapper {
    display: none;
  }

  .main_nav li {
    display: block;

  }

  .main_nav li a,
  .main_nav li a.active  {
    padding: 10px;
    border-bottom: 1px solid rgba(52, 73, 94,0.1);
  }

  .main_nav li:last-of-type a {
    border: none;
  }

  .slogan-field {
    font-size: 24px;
  }

  .parallax {
    height: 250px;
    /*background-position: top;*/
  }

  h1,h2 {
    margin: 30px auto;
  }

  h2 {
    font-size: 28px;
  }

  section {
    padding-bottom: 30px;
  }

  section p, section ul li, h4 {
    text-align: left;
  }

  #contacts {
    padding-top: 30px;
  }

  section p {
    font-size: 90%;
  }

  .contact-info-wrapper h3 {
    font-size: 21px;
  }

  .contact-info-wrapper p {
    font-size: 18px;
  }

  #map iframe {
    height: 220px;
  }

  footer {
    font-size: 75%;
  }

}

@media (max-width: 320px) {

}
