@font-face {
  font-family: "Graphik-Regular-Web";
  font-style: normal;
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  font-stretch: normal;
  src: url("../../fonts/Graphik/Graphik-Regular-Web.eot?#iefix") format("embedded-opentype"), url("../../fonts/Graphik/Graphik-Regular-Web.woff") format("woff"), url("../../fonts/Graphik/Graphik-Regular-Web.ttf") format("truetype"), url("../../fonts/Graphik/Graphik-Regular-Web.svg") format("svg");
}
/* TRANSITION */
/* COLORS */
/* SOCIAL */
/* MIXINS */
/*
 grayscale      ex: filter: grayscale(100%);
 sepia          ex: filter: sepia(100%);
 saturate       ex: filter: saturate(0%);
 hue-rotate     ex: filter: hue-rotate(45deg);
 invert         ex: filter: invert(100%);
 brightness     ex: filter: brightness(15%);
 contrast       ex: filter: contrast(200%);
 blur           ex: filter: blur(2px);
 */
/* PRIMARY SEARCH ENGINE */
.primary-search-engine {
  position: relative;
  overflow: hidden;
}
.primary-search-engine.without-oh {
  overflow: visible;
}
.primary-search-engine .container {
  position: relative;
}
.primary-search-engine .anim {
  position: absolute;
  top: 0;
  right: 0;
  width: 440px;
  height: 100%;
  overflow: hidden;
}
.primary-search-engine .anim.anim-account svg {
  margin-top: 20px;
}
.primary-search-engine h1 {
  position: relative;
  text-align: center;
  font-size: 40px;
  color: #fff;
  letter-spacing: -1px;
  padding-top: 60px;
  margin-bottom: 30px;
}
.primary-search-engine h1 span {
  letter-spacing: -2px;
  display: block;
  font-size: 30px;
}
.primary-search-engine p {
  position: relative;
  text-align: center;
  font-size: 20px;
  color: #fff;
  margin-bottom: 50px;
  margin-top: -20px;
  padding: 0 10%;
}
.primary-search-engine .tag {
  cursor: pointer;
}
.bgc2 .primary-search-engine .anim {
  top: 180px;
}
.search-engine {
  position: relative;
}
.search-engine .input-wrapper {
  margin-bottom: 10px;
}
.search-engine .std-input {
  width: 100%;
  height: 50px;
  line-height: 50px;
  background-color: rgba(255, 255, 255, .95);
  border: 1px solid #d7d7d7;
  border-radius: 3px;
  padding: 0 16px;
}
.search-engine .std-input::placeholder {
  color: #acacac;
}
.search-engine .selectric {
  background-color: rgba(255, 255, 255, .95);
}
.search-engine button {
  outline: none;
  cursor: pointer;
  width: 100%;
  border: none;
}
@media only screen and (min-width: 768px) {
  .bgc2 .primary-search-engine .anim {
    top: 30px;
    right: -90px;
  }
}

@media only screen and (min-width: 992px) {
  /* PRIMARY SEARCH ENGINE */
  /* SEARCH ENGINE */
  .primary-search-engine h1 {
    font-size: 80px;
    letter-spacing: -4px;
    padding-top: 45px;
    margin-bottom: 50px;
  }
  .primary-search-engine h1 span {
    font-size: 60px;
  }
  .primary-search-engine h1.small {
    font-size: 60px;
  }
  .primary-search-engine h1.small span {
    font-size: 40px;
  }
  .bgc2 .primary-search-engine .anim {
    top: 0;
    right: -110px;
  }
  .search-engine {    
    margin-left: 200px;
    margin-right: auto;
  }
  .search-engine .input-wrapper {
    float: left;
    padding-right: 1px;
    margin-bottom: 0;
  }
  .search-engine .input-job {
    width: 46%;
  }
  .search-engine .input-location {
    width: 27%;
  }
  .search-engine .input-contract {
    width: 27%;
  }
  .search-engine .std-input {
    line-height: 76px;
    height: 76px;
    font-size: 20px;
    padding: 0 20px;
  }
  .search-engine .std-input.job {
    border-radius: 3px 0 0 3px;
  }
  .search-engine .selectric {
    border-radius: 0;
  }
  .search-engine button {
    float: right;
    width: 100px;
    margin-right: -100px;
  }
  .search-engine button .icon:before {
    font-size: 37px;
  }
  .search-engine .bt {
    border-radius: 0 3px 3px 0;
  }
  .search-engine.b2b .input-job {
    width: 60%;
  }
  .search-engine.b2b .input-location {
    width: 40%;
  }
}
@media only screen and (min-width: 1250px) {
  .search-engine .std-input {
    padding: 0 40px;
  }
  .search-engine.b2b {
    max-width: 80%;
    margin: 0;
  }
  .bgc2 .primary-search-engine .anim {
    top: 0;
    right: 0;
  }
}
@media only screen and (min-width: 1350px) {
  .search-engine {
    max-width: 90%;
  }
}
@media only screen and (max-width: 600px){
  .primary-search-engine h1 .prim-title{font-size: 35px !important;padding-top: 6px;padding-bottom: 54px;}
  .primary-search-engine h1 span{font-size: 25px !important}
};
