.ikra {
    position: absolute;
    bottom: 50%;
    transform: translateY(50%);
    right: 15px;
    cursor: pointer;
    width: 35px;
    height: 35px;
    z-index: 2;
}
.ikra:after {
    content: '';
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzUiIGhlaWdodD0iMzUiIHZpZXdCb3g9IjAgMCAzNSAzNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMzQuNjU4NCAxNy4zMjkyQzM0LjY1ODQgMjYuODk5OSAyNi44OTk5IDM0LjY1ODQgMTcuMzI5MiAzNC42NTg0QzcuNzU4NTUgMzQuNjU4NCAwIDI2Ljg5OTkgMCAxNy4zMjkyQzAgNy43NTg1NSA3Ljc1ODU1IDAgMTcuMzI5MiAwQzI2Ljg5OTkgMCAzNC42NTg0IDcuNzU4NTUgMzQuNjU4NCAxNy4zMjkyWiIgZmlsbD0iYmxhY2siLz48cGF0aCBkPSJNMjguMjU0MiAyMy43NjQxQzI3LjM0NTcgMjcuNzQ3NSAyMy4zODAxIDMwLjI0MDIgMTkuMzk2NyAyOS4zMzE3QzE1LjQxMzMgMjguNDIzMyAxMi45MjA2IDI0LjQ1NzcgMTMuODI5MSAyMC40NzQzQzE0LjczNzUgMTYuNDkwOSAxOC43MDMyIDEzLjk5ODIgMjIuNjg2NiAxNC45MDY2QzI2LjY2OTkgMTUuODE1MSAyOS4xNjI3IDE5Ljc4MDcgMjguMjU0MiAyMy43NjQxWiIgZmlsbD0id2hpdGUiLz48L3N2Zz4=);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 35px;
    height: 35px;
    position: absolute;
    z-index: 2;
    right: 0;
    top: 0;
    transition: .2s;
}
.ikra__popup {
    position: absolute;
    overflow: hidden;
    height: 35px;
    line-height: 20px;
    font-size: 20px;
    color: #000;
    box-shadow: -1px 0 5px 0 rgba(0,0,0,.1);
    opacity: 0;
    background-color: #fff;
    right: 20px;
    top: 0px;
    padding: 3px 23px 0 18px;
    border-radius: 15px 0 0 15px;
    font-weight: bold;
    z-index: 2;
    margin-right: -15px;
    transition: .3s;
}
.ikra__popup2 {
    position: absolute;
    overflow: hidden;
    height: 35px;
    line-height: 14px;
    font-size: 14px;
    color: #000;
    box-shadow: -1px 0 5px 0 rgba(0,0,0,.1);
    background-color: #fff;
    right: 20px;
    top: 0px;
    padding: 3px 23px 0 18px;
    border-radius: 15px 0 0 15px;
    font-weight: bold;
    z-index: 1;
    opacity: 1;
    margin-right: 0;
    transition: .3s;
}
.ikra__popup small {
    white-space: nowrap;
    font-size: 10px;
    line-height: 10px;
    font-weight: 100;
    display: block;
}
.ikra:hover .ikra__popup, .ikra:focus .ikra__popup {
    opacity: 1;
    margin-right: 0;
}
.ikra:hover .ikra__popup2, .ikra:focus .ikra__popup2 {
    opacity: 0;
    margin-right: -15px;
}
.ikra:hover:after, .ikra:focus:after {
    transform: rotate(120deg);
}

@media (max-width: 1500px) {
	.ikra {
		bottom: 0;
		right: 0;
	}
}