.video_vk_horizontal_comp_version{
	cursor:pointer; 
	display:inline-block; 
	width: 100%; 
	max-width:560px; 
	height:315px; 
	border: 3px solid black;
	position:relative;
}

.video_vk_vertical_comp_version {
	cursor:pointer; 
	display:inline-block; 
	width: 100%; 
	max-width:560px; 
	height:660px; 
	border: 0px solid black;
	position:relative;
}

.video_vk_horizontal_mob_version{
	cursor:pointer; 
	display:inline-block; 
	width: 100%; 
	max-width:320px; 
	height:315px; 
	border: 3px solid black;
	position:relative;
}

.video_vk_vertical_mob_version {
	cursor:pointer; 
	display:inline-block; 
	width: 100%; 
	max-width:320px; 
	height:660px; 
	border: 0px solid black;
	position:relative;
}

/* VK play button */
.vk-playbtn {
    display: block;
    /* Make the button element cover the whole area for a large hover/click target… */
    width: 100%;
    height: 100%;
    /* …but visually it's still the same size */
    background: no-repeat center;
    /* YT's actual play button svg */
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAALiMAAC4jAHM9rsvAAAJu2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNi4wLWMwMDIgNzkuMTY0NDYwLCAyMDIwLzA1LzEyLTE2OjA0OjE3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0RXZ0PSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VFdmVudCMiIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczpwaG90b3Nob3A9Imh0dHA6Ly9ucy5hZG9iZS5jb20vcGhvdG9zaG9wLzEuMC8iIHhtbG5zOnRpZmY9Imh0dHA6Ly9ucy5hZG9iZS5jb20vdGlmZi8xLjAvIiB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjEuMiAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDI1LTAxLTEyVDA1OjU5OjU3KzAzOjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDI1LTAxLTEyVDE3OjU3OjEzKzAzOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyNS0wMS0xMlQxNzo1NzoxMyswMzowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6YjUzMzdmZmEtYWQ1MC1kMDQ3LTljNzMtYTRjNzc0NjBhMDBlIiB4bXBNTTpEb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6ZjQxOTE3OTgtMWI0NS1lODQxLWIwMzctM2Q5YjMyYTFjZDAyIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ODM0OWZjZjMtNjA5Yy1jZDQyLWE2NDMtNzYyYWMwNGE4MDgxIiBwaG90b3Nob3A6Q29sb3JNb2RlPSIzIiBwaG90b3Nob3A6SUNDUHJvZmlsZT0iRVBTT04gIHNSR0IiIHRpZmY6T3JpZW50YXRpb249IjEiIHRpZmY6WFJlc29sdXRpb249IjEyMDAwMDAwLzEwMDAwIiB0aWZmOllSZXNvbHV0aW9uPSIxMjAwMDAwMC8xMDAwMCIgdGlmZjpSZXNvbHV0aW9uVW5pdD0iMiIgZXhpZjpDb2xvclNwYWNlPSIxIiBleGlmOlBpeGVsWERpbWVuc2lvbj0iNTAwIiBleGlmOlBpeGVsWURpbWVuc2lvbj0iNTAwIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo4MzQ5ZmNmMy02MDljLWNkNDItYTY0My03NjJhYzA0YTgwODEiIHN0RXZ0OndoZW49IjIwMjUtMDEtMTJUMDU6NTk6NTcrMDM6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyMS4yIChXaW5kb3dzKSIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6OGRlZjU4Y2UtZjIwNS04MTRiLTlmNWItMTRlOTU0NTc0YjBiIiBzdEV2dDp3aGVuPSIyMDI1LTAxLTEyVDE3OjU3OjEzKzAzOjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgMjEuMiAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249ImNvbnZlcnRlZCIgc3RFdnQ6cGFyYW1ldGVycz0iZnJvbSBhcHBsaWNhdGlvbi92bmQuYWRvYmUucGhvdG9zaG9wIHRvIGltYWdlL3BuZyIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iZGVyaXZlZCIgc3RFdnQ6cGFyYW1ldGVycz0iY29udmVydGVkIGZyb20gYXBwbGljYXRpb24vdm5kLmFkb2JlLnBob3Rvc2hvcCB0byBpbWFnZS9wbmciLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmI1MzM3ZmZhLWFkNTAtZDA0Ny05YzczLWE0Yzc3NDYwYTAwZSIgc3RFdnQ6d2hlbj0iMjAyNS0wMS0xMlQxNzo1NzoxMyswMzowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4ZGVmNThjZS1mMjA1LTgxNGItOWY1Yi0xNGU5NTQ1NzRiMGIiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODM0OWZjZjMtNjA5Yy1jZDQyLWE2NDMtNzYyYWMwNGE4MDgxIiBzdFJlZjpvcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ODM0OWZjZjMtNjA5Yy1jZDQyLWE2NDMtNzYyYWMwNGE4MDgxIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+LzLdKgAAA2pJREFUaN7lm19IU1EYwBf9lxDqod6KtbIkSAilB4nqJSF6iEDoQdEWPUSkbz3VQ1HRQxE9lJprpqLRwEAxKFeLWkNEStQy06jFGunAkc65uT/39J04By7Dte3unHvPvfvg97h774/dc+453/k+k/lByMSRvUA9cA9wAp+AGWCBEAC+Am+BFuA8UAas5vVMrC+4BqgD+oGfAFKIH3ABDcAWEYUPkn8oH8l0zAPtQJUIwhWAjYNkOnrzFVf6ww3ANRVFU7ED29QSPgR4NZSlLALVvIWvCiCaio2X8GMBZSmvgXUshXsElqWMAsUshHt1IEuZANbnI9yhI1mKR6nwZR3KUtpzFS7XsSzlXC7CQQMIYzZnI3zLILIYdybhEhY3cvsS6NiTsCjSlf8T7mZxExyJJEKd4zF0wL6otfB0OuH9rG4ij2BEQlfeRdGuZk2lj68kbOchTGMqmEQ1fUtaCb9KFV4FzPIUpvHiexwd6dJkfJfJhWtYXjxTxGB8N39cRvtaVR3fd+XCTjWFacyGJXTJFUWWJvWWnFR4RgthGmOBJDrVw318J4GtWNbC+uJKQgL6puKosoPra27FwmdFEKYRjkno9tAyKn3IRbgTC98XSZiGPyShhoEIa+EhE/lGCSdMY9CfQCcczD5jk1h4UmRhHEkY4E8nmCxT/cxnaB7CNOajErrhiaIS5cvUORM51NKFMA3vnySq71f0GVvAwiE9ClufK5rQ/i06AgX0Sgex8Dc9TFqOLzFU3pb3pPXbRA6jC+WzNIWFW4VdeDgjaCfbZxvGwhdEEo7EEc+lpYNpakcHm4dGLnnoXGNcne0hxkKFPQWQABiVJwAa1U7xtIyonuJpkgtvBMIGT+IdTU3TPuOdpq3VLk37YaW89GEDJ+Lr0h21uAx41DIHFKUTrjDgYVp1puPSbkEelAU/sjkfLjKQ8O5sKwBOGkD2eq5FLTYdy7qVli25dSj7C9ikVHgt8FlHskvAjnwr8Yp1Ih0F9rCqtcQz9xuBZb2kIId5+XCbgLIDufRFKCkQv0jGigiyN9VqAdgOvNRQdIykplRv8sANFyMqivqAWhHaeE5zrqvGuXOrfNcjSqMW3m3dYTSjD5PD+iqzwJ1pcszAGeAR8J5Uq/vI/pS24gVJFxpuxxsEukg7Ximv5/oLQSFtr/lLKbYAAAAASUVORK5CYII=);
    position: absolute;
    cursor: pointer;
    z-index: 1;
    filter: grayscale(100%);
    transition: filter .1s cubic-bezier(0, 0, 0.2, 1);
    border: 0;
}
.vk-playbtn:hover {
    filter: none;
}