
/** hair arrow START **/
.hair_arrow {
  border: solid black;
  border-width: 0 1px 1px 0;
  display: inline-block;
  padding: 5px;
  position:relative;
  top:0px;
  transition:all 0.5s ease;
}

.hair_arrow.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.hair_arrow.left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.hair_arrow.up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
	top:3px;
}

.hair_arrow.down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
	top:-3px;
}

.hair_arrow.go_right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.hair_arrow.go_left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.hair_arrow.go_up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
	top:3px;
}

.hair_arrow.go_down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
	top:-3px;
}


/** hair arrow END **/

/**hair line close***/
.sc_hairline_close {
	position: relative;
	display: inline-block;
	width: 50px;
	height: 50px;
	overflow: hidden;
	background:none;
	border:0px;
}
.sc_hairline_close::before, .sc_hairline_close::after {
  content: '';
  position: absolute;
  height: 2px;
  width: 100%;
  top: 50%;
  left: 0;
  margin-top: -1px;
  background: #000;
}
.sc_hairline_close::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.sc_hairline_close::after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.sc_hairline_close::before, .sc_hairline_close::after {height: 1px;}


/**********/