/*
100	Thin, Hairline
200	Extra Light, Ultra Light
300	Light
400	Book, Normal, Regular
500	Medium
600	Semi Bold, Demi Bold
700	Bold
800	Extra Bold, Ultra Bold
900	Black, Heavy
*/
.searchBox__show {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
}

<!--.tmpl__header .searchBox input[type="search"],-->
.tmpl__header .searchBox input[type="search"]:focus,
.tmpl__header .searchBox input[type="search"]:active {
  border-radius: 0;
  border:4px solid #000000;
}

<!--.mobileNav .searchBox input[type="search"],-->
.mobileNav .searchBox input[type="search"]:focus,
.mobileNav .searchBox input[type="search"]:active {
  border-radius: 0;
  border:2px solid #000000;
}




.searchBox--noLangPicker {
  right: 10px;
}


@media (max-width: 767px) {
  .tmpl__header .searchBox {
    display: none;
  }
  .mobileNav .searchBox {
    position: relative;
    top: 0;
    max-width: none;
    right: 0;
    height: 52px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    border-left: 2px solid;
    border-color: #589020;
    background-color: #fff;
  }

  .searchBox__submit {
     right: 10px!important;
  }
}


.fixed .searchBox {
  top: 0;
}

/*.sv-editing-mode .searchBox,
.sv-classic-edit-mode .searchBox {
  display: none;
}*/

.searchBox.hidden {
  width: 55px;
  background-color: transparent;
}



.searchBox__submit, .searchBox__input {
  -webkit-appearance: none;
  border: 0;
  outline: 0;
}

.hidden .searchBox__submit, .hidden .searchBox__input {
  cursor: pointer;
}


@media (min-width: 767px) {

.searchBox__submit {
 z-index:99999;
  position: absolute;
  top: -20px;
  right: 20px;
  width: 20px;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  background-image: url(/images/18.794e2c56167f08f83dab1160/1551443346149/search-black.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: transform .3s ease;
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}
}

@media (max-width: 767px) {

.searchBox__submit {
  z-index:99999;
  position: absolute;
  top: 0px;
  right: 155px;
  width: 26px;
  height: 100%;
  padding: 0;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0;
  background-color: transparent;
  background-image: url(/images/18.794e2c56167f08f83dab1160/1551443346149/search-black.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: transform .3s ease;
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}
}

@media (max-width: 1020px) {
  .tmpl__header .searchBox__submit {
    display: none;
  }
}

.searchBox__submit:hover {
  background-color: transparent;
}

.fixed .searchBox__submit {
  background-image: url(/images/18.794e2c56167f08f83dab1160/1551443346149/search-black.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: transform .3s ease;
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}

  <!--background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNyAyNyIgd2lkdGg9IjI3IiBoZWlnaHQ9IjI3Ij48cGF0aCBkPSJNMy4yNTQsMTAuNTcyYTcuMzE5LDcuMzE5LDAsMCwxLDcuMzE4LTcuMzE5QTcuODg3LDcuODg3LDAsMCwxLDE4LjIxNywxMC45LDcuMzE5LDcuMzE5LDAsMCwxLDEwLjksMTguMjE3YTcuODg2LDcuODg2LDAsMCwxLTcuNjQ0LTcuNjQ0bTIzLjE0LDEyLjI3MS02LjQ1OC02LjQ1N0ExMC41MjEsMTAuNTIxLDAsMCwwLDIxLjQ3MSwxMC45LDExLjEzNywxMS4xMzcsMCwwLDAsMTAuNTcyLDAsMTAuNTcyLDEwLjU3MiwwLDAsMCwwLDEwLjU3MmExMS4xMzYsMTEuMTM2LDAsMCwwLDEwLjksMTAuOSwxMC41MTksMTAuNTE5LDAsMCwwLDUuMzIzLTEuNDM5bDYuNDkzLDYuNDkzYTEuNjI2LDEuNjI2LDAsMCwwLDIuMywwbDEuNjExLTEuNjFjLjYzNS0uNjM2LjQtMS40MzUtLjIzLTIuMDcxIiBzdHlsZT0iZmlsbDojNTc1NzU3Ii8+PC9zdmc+);-->
}

.searchBox__submit.is-open,
.mobileNav .searchBox__submit:focus {
   background-image: url(/images/18.794e2c56167f08f83dab1160/1551443346149/search-black.svg);
   background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: transform .3s ease;
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
}

  <!--background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNyAyNyIgd2lkdGg9IjI3IiBoZWlnaHQ9IjI3Ij48cGF0aCBkPSJNMy4yNTQsMTAuNTcyYTcuMzE5LDcuMzE5LDAsMCwxLDcuMzE4LTcuMzE5QTcuODg3LDcuODg3LDAsMCwxLDE4LjIxNywxMC45LDcuMzE5LDcuMzE5LDAsMCwxLDEwLjksMTguMjE3YTcuODg2LDcuODg2LDAsMCwxLTcuNjQ0LTcuNjQ0bTIzLjE0LDEyLjI3MS02LjQ1OC02LjQ1N0ExMC41MjEsMTAuNTIxLDAsMCwwLDIxLjQ3MSwxMC45LDExLjEzNywxMS4xMzcsMCwwLDAsMTAuNTcyLDAsMTAuNTcyLDEwLjU3MiwwLDAsMCwwLDEwLjU3MmExMS4xMzYsMTEuMTM2LDAsMCwwLDEwLjksMTAuOSwxMC41MTksMTAuNTE5LDAsMCwwLDUuMzIzLTEuNDM5bDYuNDkzLDYuNDkzYTEuNjI2LDEuNjI2LDAsMCwwLDIuMywwbDEuNjExLTEuNjFjLjYzNS0uNjM2LjQtMS40MzUtLjIzLTIuMDcxIiBzdHlsZT0iZmlsbDojZmZmIi8+PC9zdmc+);-->
}

.searchBox__submit.is-open {
  width: 26px;
  background-position: 50% 70%;
}

.searchBox__submit.is-open:focus {
  background-color: rgba(0, 0, 0, 0.025);
}

.searchBox__submit::-moz-focus-inner {
  border: 0;
  outline: 0;
}

.searchBox__submit__txt {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  position: absolute;
  top: 15px;
  left: 40px;
  font-size: 18px;
  font-weight: normal;
  color: #0084d0;
}

.mobileNav .searchBox__submit:focus .searchBox__submit__txt {
  color: #575757;
}

.fixed .searchBox__submit__txt {
  color: #575757;
}

.searchBox__submit.is-open .searchBox__submit__txt {
  display: none;
}

.searchBox.hidden .searchBox__label {
  display: block;
}

@media (min-width: 768px) {
.searchBox__input {
  position: absolute;
   top:10px;
  z-index:9999;
   right:17px;
  background-color: #d1dfb9;
  border-color: #0084d0;
  border-radius: 3px!important;
  max-width:65%;
  width: calc( 100% - 85%);
  height: 30px;
  padding: 0 .5em;
  font-family: Merriweather,sans-serif;
  font-style:normal;
  font-size: 13px!important;
   color:#000000!important;
}
}

@media (max-width: 767px) {
  .mobileNav .searchBox__input {
    width: calc( 100% - 73px);
    border-color: #fff;
    color: #4a4a4a;
    background-color: #fff;
  }
}



.tmpl__header .searchBox__input::-webkit-input-placeholder {
  font-style: normal;
  color: #575757;
   
}

.tmpl__header .searchBox__input::-moz-placeholder {
  font-style: normal;
   color: #575757;
}

.tmpl__header .searchBox__input:-ms-input-placeholder {
  font-style: normal;
 color: #575757;
}

.tmpl__header .searchBox__input:-moz-placeholder {
  font-style: normal;
   color: #575757;
}


