/* BOTH */
@media screen and (max-width: 979px) {
	
}

/* TABLETS */
@media screen and (max-width: 979px) {
	html[dir="ltr"] .ipsFollow {
		float: right;
	}
	html[dir="rtl"] .ipsFollow {
		float: left;
	}
	
	html[dir="ltr"] .ipsPromote {
		float: right;
	}
	html[dir="rtl"] .ipsPromote {
		float: left;
	}

	/* Buttons don't need to float when used inside .ipsGap */
	[class*='ipsGap'] .ipsFollow,
	[class*='ipsGap'] .ipsPromote{
		float: none !important;
	}
}

/* PHONES */
@media screen and (max-width: 767px) {
	
	/* REACTIONS */
	.ipsReact_overview {
		display: none;
	}

	.ipsReact_reactCount span:last-child {
		padding: 0 4px;
	}

	.ipsReact_button {
		padding: 2px;
		width: 36px;
		height: 36px;
		line-height: 36px;
		border-radius: 36px;
	}

	.ipsReact .ipsReact_types ul.ipsReact_hover {
		animation: reaction-hover-mobile 0.3s ease-in-out forwards;
	}

	html[dir] .ipsReact_types ul,
	html[dir] .ipsReact.ipsReact_mini .ipsReact_types ul {
		transform-origin: bottom;
		top: auto;
		bottom: 0px;
		border-radius: 38px;
		height: auto;
		padding: 5px 5px 50px 5px;
	}
		html[dir="ltr"] .ipsReact_types ul,
		html[dir="ltr"] .ipsReact.ipsReact_mini .ipsReact_types ul {
			right: -1px;
		}
		html[dir="rtl"] .ipsReact_types ul,
		html[dir="rtl"] .ipsReact.ipsReact_mini .ipsReact_types ul {
			left: -1px;
		}

		html[dir] .ipsReact_types ul li,
		html[dir] .ipsReact.ipsReact_mini .ipsReact_types ul li {
			display: block;
			margin: 10px 0 !important;
			position: relative;
		}

			html[dir] .ipsReact_types ul li:first-child,
			html[dir] .ipsReact.ipsReact_mini .ipsReact_types ul li:first-child {
				margin-top: 0 !important;
			}
			html[dir] .ipsReact_types ul li:last-child,
			html[dir] .ipsReact.ipsReact_mini .ipsReact_types ul li:last-child {
				margin-bottom: 0 !important;
			}

	.ipsReact_unreact {
		top: -12px;
	}
	html[dir="ltr"] .ipsReact_unreact {
		right: -12px;
	}
	html[dir="rtl"] .ipsReact_unreact {
		left: -12px;
	}

	.ipsReact_name {
		position: absolute;
		background: #494949;
		color: #fff;
		font-size: 11px;
		padding: 0px 7px;
		line-height: 21px;
		border-radius: 20px;
		top: 50%;
		margin-top: -10px;
		display: none;
	}

		html[dir="ltr"] .ipsReact_name {
			right: 40px;
		}
		html[dir="rtl"] .ipsReact_name {
			left: 40px;
		}

	.ipsReact_types_active .ipsReact_name {
		display: block;
	}

	html[dir] .ipsReact_button .ipsReact_name {
		transform: scale(0.8);
	}
	html[dir="ltr"] .ipsReact_button .ipsReact_name {
		right: 35px;
	}
	html[dir="rtl"] .ipsReact_button .ipsReact_name {
		left: 35px;
	}

	html[dir="ltr"] .ipsReact.ipsReact_mini .ipsReact_types ul {
		left: -4px;
		right: auto;
	}
	html[dir="rtl"] .ipsReact.ipsReact_mini .ipsReact_types ul {
		right: -4px;
		left: auto;
	}

	html[dir] .ipsReact.ipsReact_mini .ipsReact_types ul {
		padding: 5px 5px 30px 5px;
	}

	html[dir="ltr"] .ipsReact.ipsReact_mini .ipsReact_name {
		right: 32px;
	}
	html[dir="rtl"] .ipsReact.ipsReact_mini .ipsReact_name {
		left: 32px;
	}
	
	html[dir="ltr"] .ipsReact.ipsReact_mini .ipsReact_button .ipsReact_name {
		right: 26px;
	}
	html[dir="rtl"] .ipsReact.ipsReact_mini .ipsReact_button .ipsReact_name {
		left: 26px;
	}

	html[dir="ltr"] .ipsReact.ipsReact_mini .ipsReact_unreact {
		top: 40px;
		right: 2px;
	}
	html[dir="rtl"] .ipsReact.ipsReact_mini .ipsReact_unreact {
		top: 40px;
		left: 2px;
	}

	/* FOLLOWS */

	.ipsApp .ipsFollow,
	.ipsApp .ipsPromote,
	.ipsApp .ipsShareButton {
		display: flex;
		float: none !important;
	}

	.ipsApp .ipsPromote,
	.ipsApp .ipsShareButton {
		justify-content: center;
	}
	
	.ipsFollow.ipsButton_verySmall,
	.ipsPromote.ipsButton_verySmall {
		padding-left: 4px;
		padding-right: 4px;
	}
	
		.ipsPromote .ipsPromote_icon {
			float: left;
		}

	.ipsFollow > a:not( .ipsCommentCount ), .ipsFollow > span:not( .ipsCommentCount ), .ipsFollow > a > span:not( .ipsCommentCount ) {
		width: 100%;
	}

	html[dir="ltr"] .ipsFollow > a:not( .ipsCommentCount ),
	html[dir="ltr"] .ipsFollow > span:not( .ipsCommentCount ),
	html[dir="ltr"] .ipsFollow > a > span:not( .ipsCommentCount ) {
		left: 0;
		padding-left: 0;
	}

	/* Center the Follow button text on mobiles */
	.ipsApp .ipsFollow{
		position: relative;
	}
	.ipsFollow > :first-child{
		padding: 0;
	}
	.ipsFollow .ipsCommentCount{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
	}
	[dir='ltr'] .ipsFollow .ipsCommentCount{
		right: 0;
	}
	[dir='rtl'] .ipsFollow .ipsCommentCount{
		left: 0;
	}
}