.arrowleft{
    position: relative;
    border: 1px solid teal;
    width: 150px;
	height: 50px;
    margin-left: 23px;
    padding: 10px 5px 5px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -0px 0px 6px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
}
.arrowleft:before{
    content: ' ';
    display: block;
    position: absolute;
    left: -7px;
    top: 23px;
    width: 14px;
    height: 14px;
    border-color: teal;
    border-width: 1px;
    border-style: none none solid solid;
    background-color: #fff;
    box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -webkit-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -moz-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
}

.arrowtopleft{
    position: relative;
	background: #fff;
    border: 1px solid teal;
    width: 150px;
	height: 50px;
    margin-left: 23px;
    padding: 10px 5px 5px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -0px 0px 6px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
}
.arrowtopleft:before{
    content: ' ';
    display: block;
    position: absolute;
    left: -8px;
    top: 3px;
    width: 14px;
    height: 14px;
    border-color: teal;
    border-width: 1px;
    border-style: none none solid solid;
    background-color: #fff;
    box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -webkit-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -moz-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
}

.arrowright{
    position: relative;
    border: 1px solid teal;
    width: 150px;
	height: 50px;
    margin-left: 20px;
    padding: 10px 5px 5px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -0px 0px 6px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
}
.arrowright:before{
    content: ' ';
    display: block;
    position: absolute;
    left: 157px;
    top: 23px;
    width: 14px;
    height: 14px;
    border-color: teal;
    border-width: 1px;
    border-style: none none solid solid;
    background-color: #fff;
	z-index:1;
    box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -webkit-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -moz-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
}

.arrowtopright{
    position: relative;
	background: #fff;
    border: 1px solid teal;
    width: 150px;
	height: 50px;
    margin-left: 20px;
    padding: 10px 5px 5px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -0px 0px 6px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
}
.arrowtopright:before{
    content: ' ';
    display: block;
    position: absolute;
    left: 157px;
    top: 3px;
    width: 14px;
    height: 14px;
    border-color: teal;
    border-width: 1px;
    border-style: none none solid solid;
    background-color: #fff;
	z-index:1;
    box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -webkit-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -moz-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
}

.arrowup{
    position: relative;
    border: 1px solid teal;
    width: 150px;
	height: 50px;
    margin-left: 20px;
    padding: 10px 5px 5px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -0px 0px 6px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
}
.arrowup:before{
    content: ' ';
    display: block;
    position: absolute;
    left: 75px;
    top: -8px;
    width: 14px;
    height: 14px;
    border-color: teal;
    border-width: 1px;
    border-style: none none solid solid;
    background-color: #fff;
    box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -webkit-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -moz-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
}

.arrowbottom{
    position: relative;
    border: 1px solid teal;
    width: 150px;
	height: 50px;	
    margin-left: 23px;
    padding: 10px 5px 5px 10px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
    -webkit-box-shadow: -0px 0px 6px rgba(0, 0, 0, .7);
    -moz-box-shadow: 0px 0px 6px rgba(0, 0, 0, .7);
}
.arrowbottom:before{
    content: ' ';
    display: block;
    position: absolute;
    left: 75px;
    top: 58px;
    width: 14px;
    height: 14px;
    border-color: teal;
    border-width: 1px;
    border-style: none none solid solid;
    background-color: #fff;
	z-index: 1;
    box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -webkit-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    -moz-box-shadow: -2px 2px 3.5px rgba(0, 0, 0, .5);
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
}