﻿#textcontent .node {
    padding: 0px;
}
.user__wrap {
    padding: 16px 32px 50px;
}
.user__title {
    text-transform: uppercase;
    font-size: 18px;
    padding: 5px 0 0 0;
}

/*--- pin  ---*/

.pin__text {
	display: inline-block;
	vertical-align: top;
	margin: 20px 3% 20px 0;
	width: 46%;
}
.pin__server {
	vertical-align: top;
	display: inline-block;
	width: 50%;
}
	.pin__server-item {
		background: var(--pad-color2);
		margin-bottom: 1px;;
		line-height: 50px;
		cursor: pointer;
		box-sizing: border-box;
		padding: 0px;
	}
	.pin__server-radio {
	    display:none;
		}
	.pin__server-radio + label {
		cursor: pointer;
		position: relative;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		align-items: center;
		padding: 0px 20px;
		}
	.pin__server-radio + label::before {
	    content: "";
	    display: inline-block;
		vertical-align: middle;
	    height: 14px;
	    width: 14px;
	    margin: 0 15px 0 0;
	    background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/profile/icon-radio.png);
	    background-repeat: no-repeat;
		}
	.pin__server-radio + label::before {
	    background-position: left center;
		}
	.pin__server-radio:checked + label::before {
	    background-position: right center;
		}
	.pin__server-item:hover {
		color: #fff;
		}
	.pin__server-radio:checked + label {
		color: var(--item-color);
		}
	.pin__server-name {
		font: 14px/22px Quantico, Arial, Helvetica, sans-serif;
		text-transform: uppercase;
	}
	.pin__server-icon {
		margin: 0 20px;
	}

.pin__content {
    background: var(--pad-color);
    padding-bottom: 50px;
    text-align: center;
}

	.pin__content h6 {
		padding: 0px 32px;
		text-align: left;
		overflow: hidden;
		}

		.pin__content h6 .code_valid {
			display: block;
			float: right;
			font-size: 15px;
			text-transform: none
			}

	.pin__content .user__title {
		padding-left: 20px;
		text-align: left;
	}
	.pin__gifts {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
	}
	.gifts__item {
		background-color: var(--pad-color2);
		background-repeat: no-repeat;
		background-position: center;
		background-clip: padding-box;
		width: 452px;
		position: relative;
		padding-top: 190px;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		box-sizing: border-box;
		border: 1px solid transparent;
	}
	.gifts__item_credit { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_credit.png); }
	.gifts__item_crown { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_crown.png); }
	.gifts__item_coin { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_coin.png); }
	.gifts__item_kiwi { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_kiwi.png); }
	.gifts__item_vk { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_vk.png); }
	.gifts__item_vk_gift { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_vk-gift.png); }
	.gifts__item_bp { background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon_bp.png); }

	.gifts__item.is-select {
		background-color: #2c363e;
	}
	.gifts__item.select_on:hover {
		border: 1px solid var(--item-color);
		cursor: pointer;
	}
	.gifts__item.select_off .gifts__item__button {
    background: #575c61;
    color: #a9aeb3;
    cursor: default;
  }
  .b-link {
    position: absolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    z-index: 5;
  }

  .gifts__item img {
    position: absolute;
	width: 100%;
	max-width: 240px;
	height: 100%;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	object-fit: contain;
    z-index: 1;
  }
	.gifts__item__title {
		color: var(--item-color);
		font-size: 18px;
		position: absolute;
		top: 10px;
		left: 15px;
		right: 15px;
    text-align: left;
    z-index: 2;
	}
	.gifts__item__price {
		height: 25px;
		background: #15191d;
		font-size: 15px;
		text-transform: uppercase;
		text-align: center;
		flex-grow: 1;
	}
		.gifts__item__price_credit:after,
    .gifts__item__price_crown:after,
    .gifts__item__price_crown_money:after,
    .gifts__item__price_money:after  {
		    content: '';
		    display: inline-block;
		    background-size: contain;
		    background-repeat: no-repeat;
		    width: 14px;
		    height: 14px;
		    vertical-align: middle;
		    margin-left: 3px;
		    position: relative;
		    top: -1px;
		}
		.gifts__item__price_credit:after,
    .gifts__item__price_money:after {
 			background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon-credit-small.png);
		}
		.gifts__item__price_crown:after,
    .gifts__item__price_crown_money:after {
 			background-image: url(https://wf.cdn.gmru.net/static/wf.mail.ru/img/main/content/pin/icon-crown-small.png);
		}
    .gifts__item__price_coin:after {
      content: ' шт.';
      display: inline;
    }
		.pin__gifts .icon-credit, .pin__gifts .icon-crown {
			display: inline-block;
			vertical-align: middle;
			font-size: 14px;
		}
	.gifts__item__button {
		height: 25px;
		background: var(--item-color);
		color: #fff;
		text-transform: uppercase;
		font: 18px/25px Quantico, Arial, Helvetica, sans-serif;
		text-align: center;
		width: 122px;
		cursor: pointer;
	}
	.gifts__item__button:hover, .gifts__item.is-select .gifts__item__button {
		background: #fff;
		color: #000;
	}


.pin__content .wf__button {
	margin-top: 35px;
}

.spoiler__content .faq__title {
	text-transform: uppercase;
	/*margin: 15px 0 0;*/
	font-weight: bold;
}

.pin__form {
	text-align: center;
	margin-top: 30px;
}
.pin__input {
	background: none;
	border: 1px solid #5e6468;
	color: currentColor;
	font: inherit;
	font-size: 15px;
	display: block;
	margin: auto;
    padding: 2px 15px;
    width: 435px;
    box-sizing: border-box;
    margin-bottom: 15px;
}
.pin__input:focus {
	outline: none;
}
.pin__notice, .pin__error {
	color: #ff0000;
	font-size: 16px;
	text-align: left;
}
.pin__error {
	width: 403px;
	padding: 0 15px;
	margin: auto;
}
.pin__server .pin__notice {
	margin-bottom: 10px;
	display: none;
}
.pin__form .wf__button {
	margin-top: 15px;
}
.text_orange {
	color: var(--item-color);
}
.pin__gifts + .text_orange,
.text_orange + .wf__button {
  margin-top: 15px;
}

.pin__success {
	margin: 20px 0;
}
	.pin__success p {
		margin: 0;
	}
	.pin__bt_success {
		display: block;
		width: 452px;
		margin: 35px auto 0;
	}

@media only screen and (max-width: 985px) {
	.pin__text, .pin__server {
		display: block;
		width: 100%;
	}
	.pin__content-item:nth-child(even) {
		margin-left: 0;
	}
  .gifts__item {
    width: 49%;
  }
}
@media only screen and (max-width: 720px) {
  .pin__content .gifts__item {
    width: 90%;
    max-width: 452px;
    margin: 0px;
  }
}

@media only screen and (max-width: 452px) {
	.pin__content-item, .pin__bt_success {
		width: 100%;
	}

	.pin__input {
		width: 300px;
		}

	.pin__error{
		max-width: 100%;
		text-align: center;
		box-sizing: border-box;
	}
}

 /*--- pin history ---*/

 .pin__table{
	border-spacing: 1px 0;
	border-collapse: separate;
	background: none;
	width: 100%;
	color: #a2a7ac;
	}
.pin__table td, .pin__table th {
	border: none;
	padding: 10px 20px;
	}
.pin__table th {
	background: var(--pad-color2);
	text-transform: uppercase;
	font-weight: normal;
	text-align: center;
	}
.pin__table th:focus {
	outline: none;
}
.pin__table tr {
	cursor: pointer;
	background: none;
	padding: 0;
}
.pin__table tr:nth-child(2n) td {
    background: none;
	}
.pin__table tr:nth-child(2n+1) td {
    background: var(--pad-color2);
	}


.authNeeds {
  text-align: center;
  padding: 50px 25px;
}
.authNeeds .wf__button {
  min-width: 210px;
  margin: 10px 5px;
}
.error-wrap {
  min-height: 400px;
  text-align: center;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
	padding: 0 50px;
	background-color: var(--pad-color);
}

.error-wrap h2 {
  color: #575c61;
  line-height: 1;
  font-size: 100px;
  margin-bottom: 0;
}

.error-wrap h3 {
  color: #575c61;
  line-height: 1;
  font-size: 24px;
  margin-top: 29px;
  margin-bottom: 29px;
}
