.player-buttons {
	.back-button, .forward-button, .play-pause {
		display: inline-block;
		&::after {
			font-family: 'FontAwesome';
		}
	}

	.back-button {
		&::after {
			content: "\f048";
		}
	}

	.forward-button {
		&::after {
			content: "\f051";
		}
	}

	.play-pause{
		&::after { content: "\f017"; }

		&.play {
			&::after {content: "\f04b";}

		}

		&.pause {
			&::after {content: "\f04c";}
		}
	}
}

/* ................... */

.back-button, .forward-button, .play-pause {
								color: @player-controls-main-text-color;

								.linear-gradient (@player-controls-background-color, @player-controls-background-color - #222);

								&:hover {
									.linear-gradient (@player-controls-hover-background-color, @player-controls-hover-background-color - #222);

									&::after {
										border-top: 1px solid @player-controls-hover-background-color + #322;
									}
								}

								&::before {
									border: 2px solid black;
									content: '';
									position: absolute;
									top: -2px;
									left: -1px;
									bottom: -1px;
									right: -1px;
									/* @todo засунуть в миксин */
									-webkit-box-shadow: 0px 1px 2px rgba(150,150,150,.5);
									-moz-box-shadow:    0px 1px 2px rgba(150,150,150,.5);
									box-shadow:         0px 1px 2px rgba(150,150,150,.5);
								}

								&::after {
									border-top: 1px solid @player-controls-background-color + #322;
									position: absolute;
									top: 0px;
									left: 0px;
									bottom: 0px;
									right: 0px;
								}

								&.disabled {
									cursor: default;

									.linear-gradient (@player-controls-disabled-background-color, @player-controls-disabled-background-color - #222);

									&:hover {
										.linear-gradient (@player-controls-disabled-background-color, @player-controls-disabled-background-color - #222);
									}


									&:hover::after, &::after {
										border-top: 1px solid @player-controls-disabled-background-color + #322;
									}
								}
							}

							.back-button, .forward-button {
								position: absolute;
								top: ( @play-button-size - @back-forward-button-height )/2;

								height: @back-forward-button-height;
								width: @back-forward-button-width;

								&::after {
									font-size: 16px;
									line-height: @back-forward-button-height;

									padding: @play-button-size/3;
								}
							}

							.back-button {
								right: 50%;
								.rounded-corners(@back-forward-button-height/2, 0, @back-forward-button-height/2, 0);
								&::before, &::after {
									.rounded-corners(@back-forward-button-height/2, 0, @back-forward-button-height/2, 0);
								}

								&::after{
									text-align: left;
									padding-right: 0;
									padding-top: 0;
									padding-bottom: 0;
								}
							}

							.forward-button {
								left: 50%;
								.rounded-corners(0, @back-forward-button-height/2, 0, @back-forward-button-height/2);
								&::before, &::after {
									.rounded-corners(0, @back-forward-button-height/2, 0, @back-forward-button-height/2);
								}

								&::after{
									text-align: right;
									padding-left: 0;
									padding-top: 0;
									padding-bottom: 0;
								}
							}

							.play-pause {
								position: relative;
								height: @play-button-size;
								width: @play-button-size;
								z-index: 1;
								.rounded-corners(@play-button-size/2);

								&::before, &::after {
									.rounded-corners(@play-button-size/2);
								}

								&::after{
									font-size: 24px;
									line-height: @play-button-size;
								}

								&.play::after{
									padding-left: @play-button-size/10;
								}

							}
						}