/* CSS файл для виджетов "Есть вопросы?", ведущего на iwant */

/* Контейнер для иконки и текста */
#iwant-container {
	width: 100%;
	position: fixed;
	bottom: 52px;
	display: flex;
	height: 64px;
	justify-content: right;
	align-items: center;
	left: 0%;
	z-index: 999;
	pointer-events: none;
}

/* Текст "Есть вопросы?" */
#iwant-text {
	border-radius: 15px;
	padding: 12px 20px 12px 14px;
	display: flex;
	align-items: center;
	height: 36px;
	transition: 1s;
	text-decoration: none;
	background-color: white;
	box-shadow: 0px 0px 1px gray;
}

/* Выступ контейнера текста */
#iwant-text-numb {
    cursor: pointer;
    height: 8px;
    margin-left: -6px;
    margin-right: 12px;
    position: relative;
    perspective-origin: 4px 4px;
    transform: matrix(0.707107, -0.707107, 0.707107, 0.707107, 0, 0);
    transform-origin: 4px 4px;
    width: 8px;
    background: rgb(255, 255, 255) none repeat scroll 0% 0% / auto padding-box border-box;
    transition: 1s;
    box-shadow: 0px 0px 1px gray;
}

/* Иконка c "ЯХ" */
#iwant-icon {
	display: flex;
    line-height: 0px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: yellow;
    color: white;
    width: 50px;
    height: 50px;
    font-weight: bold;
    margin-right: 60px;
    font-size: 24px;
    border: 1px solid red;
    box-shadow: 0px 0px 3px white;
}

.iwant-text-0-opacity {
	opacity: 0;
}

#iwant-link {
	pointer-events: all;
	text-decoration: none;
}

#iwant-mobile-strip {
	display: none;
}

@media screen and (max-width: 767px) {
	#iwant-container {
		display: none;
	}

	/* Полоска вместо мобильного меню */
	#iwant-mobile-strip {
		display: flex;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		z-index: 999;
		background: yellow;
		flex-direction: row;
		justify-content: center;
		padding: 5px 0;
		box-shadow: 1px 0 1px black;
		height: 50px;
		overflow: hidden;
	}

	/* Ссылка на /iwant */
	#iwant-mobile-strip a {
		font-size: 26px;
	}
}