/* css arrow*/
.arrow-up, .arrow-right, .arrow-down, .arrow-left, .icon-cross, .icon-check, .triangle-up, .triangle-right, .triangle-down, .triangle-left{
	margin: auto; background-image: none; color:currentColor; display: inline-block; position: relative; width: 1em; height: 1em; vertical-align: middle; text-align: center;
}

.arrow-up:before, .arrow-right:before, .arrow-down:before, .arrow-left:before, .icon-cross:before, .arrow-up:after, .arrow-right:after, .arrow-down:after, .arrow-left:after, .icon-cross:after,
.icon-check:before, .icon-check:after{
	content: ""; display:inline-block;
	position: absolute;
	width: 4%;
	min-width: 2px;
	background-color: currentColor;
	pointer-events: none;
	border-radius: 16px;
	transition:0.5s transform;
	-webkit-transition:0.5s transform;
	-moz-transition:0.5s transform;
	-o-transition:0.5s transform;
	-ms-transition:0.5s transform;
}

.arrow-up:before, .arrow-up:after{
	height: 70.71%; top: 15%; left: 50%;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.arrow-up:before{
-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}

.arrow-up:after{
	-webkit-transform: translateX(-70.71%) rotate(315deg);
	transform: translateX(-70.71%) rotate(315deg);
}

.arrow-down:before, .arrow-down:after{
	height: 70.71%; bottom: 15%; left: 50%;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.arrow-down:before{
-webkit-transform:translateY(70.71%) rotate(135deg);
	transform:translateY(70.71%) rotate(135deg);
}

.arrow-down:after{
	-webkit-transform:translateY(70.71%) translateX(-70.71%) rotate(-135deg);
	transform:translateY(70.71%) translateX(-70.71%) rotate(-135deg);
}

.arrow-left:before, .arrow-left:after{
	height: 70.71%; top: 50%; left: 15%;
	background-color: currentColor;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.arrow-left:before{
	-webkit-transform:translateY(-2%) rotate(-45deg);
	transform:translateY(-2%) rotate(-45deg);
}
.arrow-left:after{
	-webkit-transform: translateY(2%) rotate(-135deg);
	transform: translateY(2%) rotate(-135deg);
}

.arrow-right:before, .arrow-right:after{
	height: 70.71%;top: 50%;right: 15%;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.arrow-right:before{
	-webkit-transform:translateY(-2%) rotate(45deg);
	transform:translateY(-2%) rotate(45deg);
}

.arrow-right:after{
	-webkit-transform:translateY(2%) rotate(135deg);
	transform:translateY(2%) rotate(135deg);
}

/* css icon*/
.icon-cross:before, .icon-cross:after{	
	height: 100%; top: 0; left:46%;
}

.icon-cross:before{
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}


.icon-cross:after{
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}


.icon-check:before, .icon-check:after{
	height: 70.71%; bottom: 15%; left: 20%;
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.icon-check:before{
	height:40%;
-webkit-transform:translateY(82%) rotate(135deg);
	transform:translateY(82%) rotate(135deg);
}

.icon-check:after{
	-webkit-transform:translateY(90%) translateX(-70.71%) rotate(-135deg);
	transform:translateY(90%) translateX(-70.71%) rotate(-135deg);
}

.icon-plus, .icon-minus{ margin: auto; background-image: none; color:currentColor; display: inline-block; position: relative; width: 1em; height: 1em; vertical-align: middle; text-align: center; }
.icon-plus:before, .icon-plus:after, .icon-minus:before, .icon-minus:after{
	content: ""; display:inline-block;
	position: absolute;
	top: 0; right: 0; bottom:0; left:0; margin: auto;
	width: 4%; height: 100%;
	min-width: 2px; min-height: 1em;
	background-color: currentColor;
	pointer-events: none;
	border-radius: 16px;
	-webkit-transform-origin: 50%;
	transform-origin: 50%;
	transition:0.5s transform;
	-webkit-transition:0.5s transform;
	-moz-transition:0.5s transform;
	-o-transition:0.5s transform;
	-ms-transition:0.5s transform;
}
.icon-plus:before{
	-webkit-transform:translateY(-2%) rotate(90deg);
	transform:translateY(-2%) rotate(90deg);
}
.icon-plus:after{
	-webkit-transform:translateX(-2%) rotate(0deg);
	transform:translateX(-2%) rotate(0deg);
}

.icon-minus:before, .icon-minus:after{
	-webkit-transform:translateY(-2%) rotate(90deg);
	transform:translateY(-2%) rotate(90deg);
}

/* css triangle*/
.triangle-up, .triangle-right, .triangle-down, .triangle-left{ line-height: 0; }
.triangle-up:before, .triangle-right:before, .triangle-down:before, .triangle-left:before{
	content: "";
	display:inline-block;
	height: 0; width: 0; top:0; right:0;
 border: 0.5em solid transparent;
 border-bottom: 0.5em solid currentColor;
	transition:0.5s transform;
	-webkit-transition:0.5s transform;
	-moz-transition:0.5s transform;
	-o-transition:0.5s transform;
	-ms-transition:0.5s transform;
}

.triangle-up:before{
	-webkit-transform:translateY(-0.25em);
	transform:translateY(-0.25em);
}

.triangle-right:before{
	-webkit-transform:translateX(0.25em) rotate(90deg);
	transform:translateX(0.25em) rotate(90deg);
}

.triangle-down:before{
	-webkit-transform:translateY(0.25em) rotate(180deg);
	transform:translateY(0.25em) rotate(180deg);
}
.triangle-left:before{
	-webkit-transform:translateX(-0.25em) rotate(-90deg);
	transform:translateX(-0.25em) rotate(-90deg);
}


