/* --------------------------------------
	Spinner
   -------------------------------------- */

.gamipress-spinner {
	display: block;
	margin: 4px auto;
	width: 20px;
	height: 20px;
	background: url('../img/spinner.gif');
}


/* --------------------------------------
	Achievements List
   -------------------------------------- */

#gamipress-achievements-filter {
	float: left;
	margin-bottom: 1em;
}

#gamipress-achievements-search {
	margin-right: 5px;
	margin-bottom: 1em;
	float: right;
}

#gamipress-achievements-container:not([class*="gamipress-columns"]),
#achievements_list_load_more,
#gamipress-achievements-filters-wrap {
	display: block;
	margin: 0 auto;
	clear: both;
}

#gamipress-achievements-filter select {
	max-width: 100%;
	margin-left: 5px;
}

.gamipress-achievements-list .gamipress-achievement {
	padding: 1em 0;
}

.gamipress-no-results {
	width: 100%;
}

/* --------------------------------------
	Layout Utility
   -------------------------------------- */

.gamipress-achievement:not(.gamipress-layout-none),
.gamipress-rank:not(.gamipress-layout-none),
.single-achievement.achievement-wrap:not(.gamipress-layout-none),
.single-rank.rank-wrap:not(.gamipress-layout-none),
.gamipress-user-points:not(.gamipress-layout-none) {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;

	align-self: flex-start;

	width: 100%;

	margin-bottom: 1rem;
}

.gamipress-points-types:not(.gamipress-layout-none) .gamipress-points-type {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;

	align-self: flex-start;
}

/* Force box sizing to box's border instead of box's content */
.gamipress-achievement:not(.gamipress-layout-none) *,
.gamipress-rank:not(.gamipress-layout-none) *,
.single-achievement.achievement-wrap:not(.gamipress-layout-none) *,
.single-rank.rank-wrap:not(.gamipress-layout-none) *,
.gamipress-user-points:not(.gamipress-layout-none) *,
.gamipress-points-types:not(.gamipress-layout-none) * {
	box-sizing: border-box;
}

/* Left and Right */
.gamipress-achievement.gamipress-layout-left .gamipress-achievement-image,
.gamipress-achievement.gamipress-layout-right .gamipress-achievement-image,
.gamipress-rank.gamipress-layout-left .gamipress-rank-image,
.gamipress-rank.gamipress-layout-right .gamipress-rank-image,
.single-achievement.gamipress-layout-left .gamipress-achievement-image,
.single-achievement.gamipress-layout-right .gamipress-achievement-image,
.single-rank.gamipress-layout-left .gamipress-rank-image,
.single-rank.gamipress-layout-right .gamipress-rank-image,
.gamipress-points-types.gamipress-layout-left .gamipress-points-type-image,
.gamipress-points-types.gamipress-layout-right .gamipress-points-type-image {
	width: 20%;
}

.gamipress-achievement.gamipress-layout-left .gamipress-achievement-image,
.gamipress-rank.gamipress-layout-left .gamipress-rank-image,
.single-achievement.gamipress-layout-left .gamipress-achievement-image,
.single-rank.gamipress-layout-left .gamipress-rank-image,
.gamipress-points-types.gamipress-layout-left .gamipress-points-type-image {
	padding-right: 1em;
}

.gamipress-achievement.gamipress-layout-right .gamipress-achievement-image,
.gamipress-rank.gamipress-layout-right .gamipress-rank-image,
.single-achievement.gamipress-layout-right .gamipress-achievement-image,
.single-rank.gamipress-layout-right .gamipress-rank-image,
.gamipress-points-types.gamipress-layout-right .gamipress-points-type-image {
	padding-left: 1em;
}

.gamipress-achievement.gamipress-layout-left .gamipress-achievement-description,
.gamipress-achievement.gamipress-layout-right .gamipress-achievement-description,
.gamipress-rank.gamipress-layout-left .gamipress-rank-description,
.gamipress-rank.gamipress-layout-right .gamipress-rank-description,
.single-achievement.gamipress-layout-left .gamipress-achievement-description,
.single-achievement.gamipress-layout-right .gamipress-achievement-description,
.single-rank.gamipress-layout-left .gamipress-rank-description,
.single-rank.gamipress-layout-right .gamipress-rank-description,
.gamipress-points-types.gamipress-layout-left .gamipress-points-type-description,
.gamipress-points-types.gamipress-layout-right .gamipress-points-type-description {
	margin-top: 0;
	width: 80%;
}

.gamipress-achievement.gamipress-layout-right,
.gamipress-rank.gamipress-layout-right,
.single-achievement.gamipress-layout-right,
.single-rank.gamipress-layout-right,
.gamipress-user-points.gamipress-layout-right .gamipress-points,
.gamipress-points-types.gamipress-layout-right .gamipress-points-type {
	flex-direction: row-reverse;
}

.gamipress-user-points.gamipress-layout-left .gamipress-points,
.gamipress-user-points.gamipress-layout-right .gamipress-points {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	align-items: center;
}

.gamipress-user-points.gamipress-layout-right .gamipress-points {
	justify-content: flex-end;
}

/* Top and Bottom */
.gamipress-achievement.gamipress-layout-top .gamipress-achievement-image,
.gamipress-achievement.gamipress-layout-bottom .gamipress-achievement-image,
.gamipress-rank.gamipress-layout-top .gamipress-rank-image,
.gamipress-rank.gamipress-layout-bottom .gamipress-rank-image,
.single-achievement.gamipress-layout-top .gamipress-achievement-image,
.single-achievement.gamipress-layout-bottom .gamipress-achievement-image,
.single-rank.gamipress-layout-top .gamipress-rank-image,
.single-rank.gamipress-layout-bottom .gamipress-rank-image,
.gamipress-points-types.gamipress-layout-top .gamipress-points-type-image,
.gamipress-points-types.gamipress-layout-bottom .gamipress-points-type-image {
	width: 100%;
}

.gamipress-achievement.gamipress-layout-top .gamipress-achievement-image,
.gamipress-rank.gamipress-layout-top .gamipress-rank-image,
.single-achievement.gamipress-layout-top .gamipress-achievement-image,
.single-rank.gamipress-layout-top .gamipress-rank-image,
.gamipress-points-types.gamipress-layout-top .gamipress-points-type-image {
	padding-bottom: 1em;
}

.gamipress-achievement.gamipress-layout-bottom .gamipress-achievement-image,
.gamipress-rank.gamipress-layout-bottom .gamipress-rank-image,
.single-achievement.gamipress-layout-bottom .gamipress-achievement-image,
.single-rank.gamipress-layout-bottom .gamipress-rank-image,
.gamipress-points-types.gamipress-layout-bottom .gamipress-points-type-image {
	padding-top: 1em;
}

.gamipress-achievement.gamipress-layout-top .gamipress-achievement-description,
.gamipress-achievement.gamipress-layout-bottom .gamipress-achievement-description,
.gamipress-rank.gamipress-layout-top .gamipress-rank-description,
.gamipress-rank.gamipress-layout-bottom .gamipress-rank-description,
.single-achievement.gamipress-layout-top .gamipress-achievement-description,
.single-achievement.gamipress-layout-bottom .gamipress-achievement-description,
.single-rank.gamipress-layout-top .gamipress-rank-description,
.single-rank.gamipress-layout-bottom .gamipress-rank-description,
.gamipress-points-types.gamipress-layout-top .gamipress-points-type-description,
.gamipress-points-types.gamipress-layout-bottom .gamipress-points-type-description {
	width: 100%;
}

.gamipress-achievement.gamipress-layout-bottom,
.gamipress-rank.gamipress-layout-bottom,
.single-achievement.gamipress-layout-bottom,
.single-rank.gamipress-layout-bottom,
.gamipress-user-points.gamipress-layout-bottom .gamipress-points,
.gamipress-points-types.gamipress-layout-bottom .gamipress-points-type {
	flex-direction: column-reverse;
}

.gamipress-user-points.gamipress-layout-top .gamipress-points,
.gamipress-user-points.gamipress-layout-bottom .gamipress-points {
	text-align: center;
}

.gamipress-user-points.gamipress-layout-top .gamipress-user-points-image,
.gamipress-user-points.gamipress-layout-bottom .gamipress-user-points-image {
	width: 100%;
}

/* --------------------------------------
	Align Utility
   -------------------------------------- */

.gamipress-align-left {
	text-align: left;
}

.gamipress-align-left .gamipress-share-buttons {
	justify-content: flex-start;
}

.gamipress-align-center {
	text-align: center;
}

.gamipress-align-center .gamipress-share-buttons {
	justify-content: center;
}

.gamipress-align-right {
	text-align: right;
}

.gamipress-align-right .gamipress-share-buttons {
	justify-content: flex-end;
}

.gamipress-align-justify {
	text-align: justify;
}

/* --------------------------------------
	Columns Utility
   -------------------------------------- */

[class*="gamipress-columns"] {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;

	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;

	width: 100%;
}

[class*="gamipress-columns"] > .gamipress-achievement,
[class*="gamipress-columns"] > .gamipress-points,
[class*="gamipress-columns"] > .gamipress-points-type,
[class*="gamipress-columns"] .gamipress-rank {
	width: 100%;
}

/* Force box sizing to box's border instead of box's content */
[class*="gamipress-columns"] * {
	box-sizing: border-box;
}

.gamipress-columns-small-2 > .gamipress-achievement,
.gamipress-columns-small-2 > .gamipress-points,
.gamipress-columns-small-2 > .gamipress-points-type,
.gamipress-columns-small-2 .gamipress-rank {
	width: 50%;
}

.gamipress-columns-small-3 > .gamipress-achievement,
.gamipress-columns-small-3 > .gamipress-points,
.gamipress-columns-small-3 > .gamipress-points-type,
.gamipress-columns-small-3 .gamipress-rank {
	width: 33%;
}

.gamipress-columns-small-4 > .gamipress-achievement,
.gamipress-columns-small-4 > .gamipress-points,
.gamipress-columns-small-4 > .gamipress-points-type,
.gamipress-columns-small-4 .gamipress-rank {
	width: 25%;
}

.gamipress-columns-small-5 > .gamipress-achievement,
.gamipress-columns-small-5 > .gamipress-points,
.gamipress-columns-small-5 > .gamipress-points-type,
.gamipress-columns-small-5 .gamipress-rank {
	width: 20%;
}

.gamipress-columns-small-6 > .gamipress-achievement,
.gamipress-columns-small-6 > .gamipress-points,
.gamipress-columns-small-6 > .gamipress-points-type,
.gamipress-columns-small-6 .gamipress-rank {
	width: 16.6%;
}

@media screen and (min-width: 768px) {

	#gamipress-achievements-container[class*="gamipress-columns"] > .gamipress-achievement,
	.gamipress-user-points[class*="gamipress-columns"] > .gamipress-points,
	.gamipress-points-types[class*="gamipress-columns"] > .gamipress-points-type,
	.gamipress-ranks-container[class*="gamipress-columns"] .gamipress-rank {
		padding: 1em;
		overflow: hidden;
		border-bottom: none;
	}

	.gamipress-columns-2 > .gamipress-achievement,
	.gamipress-columns-2 > .gamipress-points,
	.gamipress-columns-2 > .gamipress-points-type,
	.gamipress-columns-2 .gamipress-rank {
		width: 50%;
	}

	.gamipress-columns-3 > .gamipress-achievement,
	.gamipress-columns-3 > .gamipress-points,
	.gamipress-columns-3 > .gamipress-points-type,
	.gamipress-columns-3 .gamipress-rank {
		width: 33%;
	}

	.gamipress-columns-4 > .gamipress-achievement,
	.gamipress-columns-4 > .gamipress-points,
	.gamipress-columns-4 > .gamipress-points-type,
	.gamipress-columns-4 .gamipress-rank {
		width: 25%;
	}

	.gamipress-columns-5 > .gamipress-achievement,
	.gamipress-columns-5 > .gamipress-points,
	.gamipress-columns-5 > .gamipress-points-type,
	.gamipress-columns-5 .gamipress-rank {
		width: 20%;
	}

	.gamipress-columns-6 > .gamipress-achievement,
	.gamipress-columns-6 > .gamipress-points,
	.gamipress-columns-6 > .gamipress-points-type,
	.gamipress-columns-6 .gamipress-rank {
		width: 16.6%;
	}

}

/* Achievement and rank earned status styles */
.gamipress-achievement .gamipress-achievement-image,
.gamipress-rank .gamipress-rank-image,
.achievement-wrap .gamipress-achievement-image,
.rank-wrap .gamipress-rank-image {
	opacity: .4;
}

.gamipress-achievement.user-has-earned .gamipress-achievement-image,
.gamipress-rank.user-has-earned .gamipress-rank-image,
.user-has-earned .achievement-wrap .gamipress-achievement-image,
.achievement-wrap.user-has-earned .gamipress-achievement-image,
.user-has-earned .rank-wrap .gamipress-rank-image,
.rank-wrap.user-has-earned .gamipress-rank-image {
	opacity: 1;
}

.gamipress-points-type .gamipress-points-type-awards,
.gamipress-points-type .gamipress-points-type-deducts {
	width: 100%;
}

.gamipress-achievement-points {
	font-weight: bold;
}

#gamipress-achievements-container .gamipress-achievement-title {
	display: inline-block;
	margin-top: 0;
}

#achievements_list_load_more {
	margin: 1em auto;
}

.gamipress-open-close-switch {
	text-align: right;
}

.gamipress-extras-window {
	display: none;
}

.gamipress-required-achievements .user-has-earned,
.gamipress-required-requirements .user-has-earned,
.gamipress-achievements-list .gamipress-achievement.user-has-earned .gamipress-extras-window li,
.gamipress-rank.user-has-earned .gamipress-extras-window li,
.gamipress-points-awards .user-has-earned,
.gamipress-points-deducts .user-has-earned {
	text-decoration: line-through;
}

.gamipress-required-achievements .user-has-earned:hover,
.gamipress-required-requirements .user-has-earned:hover,
.gamipress-achievements-list .gamipress-achievement.user-has-earned .gamipress-extras-window li:hover,
.gamipress-rank.user-has-earned .gamipress-extras-window li:hover,
.gamipress-points-awards .user-has-earned:hover,
.gamipress-points-deducts .user-has-earned:hover {
	text-decoration: none;
}

.show-hide-open:after,
.show-hide-close:after {
	content: '';
	display: inline-block;
	background: url('../img/arrow.svg') no-repeat;
	background-size: 100%;
	width: 22px;
	height: 22px;
	vertical-align: top;
}

.show-hide-close:after {
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	-o-transform: rotate(180deg);
	transform: rotate(180deg);
}

ul.gamipress-achievement-earners-list,
ul.gamipress-rank-earners-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.gamipress-achievement-earners-list:after,
ul.gamipress-rank-earners-list:after {
	content: "";
	clear: both;
	display: block;
}

ul.gamipress-achievement-earners-list li,
ul.gamipress-rank-earners-list li {
	position: relative;
	float: left;
	margin: 5px;
	padding: 0;
}

ul.gamipress-achievement-earners-list li .earner-display-name,
ul.gamipress-rank-earners-list li .earner-display-name {
	display: block;
}

.gamipress-achievement-congratulations,
.gamipress-rank-congratulations {
	background: #f0f0f0;
	padding: 10px;
	margin:1em auto 2em;
	border-radius: 5px;
}

.gamipress-achievement-points {
	font-weight: bold;
}

.gamipress-required-achievements .user-has-earned,
.gamipress-required-requirements .user-has-earned {
	text-decoration: line-through;
}

.gamipress-required-achievements .user-has-earned:hover,
.gamipress-required-requirements .user-has-earned:hover {
	text-decoration: none;
}

/* GamiPress unlock with points form */
.gamipress-achievement-unlock-with-points,
.gamipress-rank-unlock-with-points {
	display: inline-block;
}

/* Inline shortcodes styles */
.gamipress-inline-points .gamipress-inline-points-thumbnail img,
.gamipress-inline-achievement .gamipress-inline-achievement-thumbnail img,
.gamipress-inline-rank .gamipress-inline-rank-thumbnail img {
	vertical-align: middle;
}

/* --------------------------------------
	Share buttons
   -------------------------------------- */

.gamipress-share-buttons-label {
	margin-top: 0;
	margin-bottom: 2px;
}

.gamipress-share-buttons {
	display: flex;
	flex-wrap: wrap;
	margin-left: -2px;
	margin-right: -2px;
}

.gamipress-share-button {
	display: inline-block;
	width: 28px;
	height: 28px;
	vertical-align: middle;
	padding: 4px;
	margin: 2px;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px 18px;
	box-sizing: border-box;
}

.gamipress-share-button span {
	display: none;
}

.gamipress-share-button-square {
	border-radius: 0;
}

.gamipress-share-button-rounded {
	border-radius: 6px;
}

.gamipress-share-button-circle {
	border-radius: 50%;
}

.gamipress-share-button-facebook {
	background-color: #4766a9;
	background-image: url('../img/social/facebook.svg');
}

.gamipress-share-button-twitter {
	background-color: #000;
	background-image: url('../img/social/twitter.svg');
}

.gamipress-share-button-linkedin {
	background-color: #0074b3;
	background-image: url('../img/social/linkedin.svg');
}

.gamipress-share-button-pinterest {
	background-color: #bd081c;
	background-image: url('../img/social/pinterest.svg');
}

/* --------------------------------------
	User Earnings
   -------------------------------------- */

/* User earnings in small areas (with support for iPads screens) */
@media only screen
and (max-width: 760px), (min-device-width: 768px)
and (max-device-width: 1024px) {
	#gamipress-earnings-table,
	#gamipress-earnings-table thead,
	#gamipress-earnings-table tbody,
	#gamipress-earnings-table th,
	#gamipress-earnings-table td,
	#gamipress-earnings-table tr {
		display: block;
		width: 100%;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-thumbnail {
		float: left;
		width: 18%;
		margin-right: 2%;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-thumbnail img {
		width: 100%;
		height: auto;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-thumbnail.gamipress-earnings-col-empty {
		display: none;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-description {
		width: 100%;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-description:after {
		content: " ";
		display: block;
		clear: both;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-date {
		width: 48%;
		float: left;
	}

	#gamipress-earnings-table td.gamipress-earnings-col-points {
		width: 50%;
		text-align: right;
		float: right;
	}

	#gamipress-earnings-table thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}

	#gamipress-earnings-table tr {
		padding-bottom: 1em;
		border-bottom: 1px solid rgba(0,0,0,0.1);
		margin-bottom: 1em;
	}

	#gamipress-earnings-table tr:after {
		content: " ";
		display: block;
		clear: both;
	}
}

/* Force responsive */
#gamipress-earnings-table.gamipress-earnings-force-responsive,
#gamipress-earnings-table.gamipress-earnings-force-responsive thead,
#gamipress-earnings-table.gamipress-earnings-force-responsive tbody,
#gamipress-earnings-table.gamipress-earnings-force-responsive th,
#gamipress-earnings-table.gamipress-earnings-force-responsive td,
#gamipress-earnings-table.gamipress-earnings-force-responsive tr {
	display: block;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-thumbnail {
	float: left;
	width: 18%;
	margin-right: 2%;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-thumbnail img {
	width: 100%;
	height: auto;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-thumbnail.gamipress-earnings-col-empty {
	display: none;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-description {
	width: 100%;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-description:after {
	content: " ";
	display: block;
	clear: both;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-date {
	width: 48%;
	float: left;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive td.gamipress-earnings-col-points {
	width: 50%;
	text-align: right;
	float: right;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive thead tr {
	position: absolute;
	top: -9999px;
	left: -9999px;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive tr {
	padding-bottom: 1em;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	margin-bottom: 1em;
}

#gamipress-earnings-table.gamipress-earnings-force-responsive tr:after {
	content: " ";
	display: block;
	clear: both;
}

/* --------------------------------------
	Email Settings
   -------------------------------------- */

.gamipress-email-settings .gamipress-email-settings-header-yes,
.gamipress-email-settings .gamipress-email-settings-header-no,
.gamipress-email-settings .gamipress-email-settings-column-yes,
.gamipress-email-settings .gamipress-email-settings-column-no {
	width: 80px;
	text-align: center;
}

.gamipress-email-settings-loader {
	position: absolute;
	right: -65px;
	font-size: 80%;
	width: 60px;
}

.gamipress-email-settings-loader .gamipress-email-settings-saving {
	-webkit-animation: flickerAnimation 1s infinite;
	-moz-animation: flickerAnimation 1s infinite;
	-o-animation: flickerAnimation 1s infinite;
	animation: flickerAnimation 1s infinite;
}

@keyframes flickerAnimation {
	0%   { opacity:1; }
	50%  { opacity:0; }
	100% { opacity:1; }
}
@-o-keyframes flickerAnimation{
	0%   { opacity:1; }
	50%  { opacity:0; }
	100% { opacity:1; }
}
@-moz-keyframes flickerAnimation{
	0%   { opacity:1; }
	50%  { opacity:0; }
	100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation{
	0%   { opacity:1; }
	50%  { opacity:0; }
	100% { opacity:1; }
}

/* --------------------------------------
	Shortcode errors
   -------------------------------------- */

.gamipress-shortcode-error {
	color: #a00;
	background-color: #fdd;
	padding: 0.5em 1em;
	margin-bottom: 1em;
	border-radius: 6px;
}

.gamipress-shortcode-error .gamipress-shortcode-error-shortcode,
.gamipress-shortcode-error .gamipress-shortcode-error-reminder {
	font-size: 75%;
}

.gamipress-shortcode-error .gamipress-shortcode-error-reminder {
    text-align: right;
}

@media screen and (min-width: 768px) {
    .gamipress-shortcode-error .gamipress-shortcode-error-shortcode {
        float: left;
    }
}
