/* ============================
PERSONAL
============================ */
.bgp-img-inline{
	width:1.2em;
	height:1.2em;
}

div#my_book {
  display: block;
  margin: 1em 0em;
  margin-bottom: 0; 
 }

.bg_favorite {
  font-size: 0.75em;
  color: #90694a;
  text-decoration: none;
  outline: none;
  cursor: pointer; }

.bg_favorite:hover {
  text-decoration: underline;
  transition: text-decoration-color .1s ease; }

.bg_favorite img {
  vertical-align: middle; }

span.bg_response {
  display: block; }

.bg_personal {
  width: 100%;
  text-align: right; }

.bg_personal a {
  color: maroon; }

i#user_info_btn,
i#user_profile_btn,
i#user_logout_btn,
i#user_delete_btn {
  font-size: 3em;
  color: #B49477;
  cursor: pointer; }

i#user_info_btn:hover,
i#user_profile_btn:hover,
i#user_logout_btn:hover,
i#user_delete_btn:hover {
  color: #E7D7B8; }

i#user_info_btn:active,
i#user_profile_btn:active,
i#user_logout_btn:active,
i#user_delete_btn:active {
  color: #D0B272; }

#register_my_book a {
  color: grey; }

.divider-block {
  height: 20px;
  width: 100%;
  float: left;
  position: relative;
  text-align: center;
  margin: 10px 0; }

.email {
  height: 20px;
  width: 180px;
  margin-top: -5px; }
  
/*** НАЧАЛО: Внедряем кнопку Favorite ***/
div#bg-favorite-button {
  position: fixed;
  z-index: 100;
  width: 32px;
  height: 32px;
  top: 80px;
  right: -webkit-calc(50% - 40rem - 32px); 
  right: calc(50% - 40rem - 32px);
  background-color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  cursor: pointer; }

.bg_favorite_btn {
  background-image: url("../images/my_favorites.png"); }

.bg_stop_btn {
  background-image: url("../images/stop.png"); }

.bg_return_btn {
  background-image: url("../images/return.png"); }

.rating-box {
  display: inline-block;
  margin-top: 10px;
  margin-bottom: 15px;
  font-size: 0.8333rem;
  font-weight: bold; }

/*** КОНЕЦ: Внедряем кнопку Favorite ***/

.saved_in_favorite {
  position: fixed;
  left: 50%;
  top: 50%;
  min-width: 250px;
  max-width: 900px;
  transform: translate(-50%, -50%);
  z-index: 1001;
  margin: 0px;
  padding: 15px;
  border: 2px solid #767676;
  border-radius: 5px;
  font-family: sans-serif;
  font-size: 1rem;
  font-style: normal;
  font-weight: bold;
  font-stretch: normal;
  color: #000000;
  text-decoration: none;
  background-color: rgba(255, 255, 245, 0.99);
  box-shadow: 5px 5px 5px -3px rgba(118, 118, 118, 0.9);
  -webkit-box-shadow: 5px 5px 5px -3px rgba(118, 118, 118, 0.9);
  -moz-box-shadow: 5px 5px 5px -3px rgba(118, 118, 118, 0.9); }

.saved_in_favorite img {
  width: 24px;
  height: 24px;
  float: left;
  margin-right: 6px; }

div.popup_message {
  position: fixed;
  left: 50%;
  top: 50%;
  min-width: 250px;
  max-width: 900px;
  transform: translate(-50%, -50%);
  z-index: 1002;
  margin: 0px;
  padding: 25px 15px;
  border: 12px solid #f8f4eb;
  border-radius: 6px;
  font-family: sans-serif;
  font-size: 130%;
  font-style: normal;
  font-weight: normal;
  font-stretch: normal;
  color: #000000;
  text-decoration: none;
  text-align: center;
  background-color: rgba(255, 254, 254, 0.99);
  box-shadow: 5px 5px 5px -3px rgba(118, 118, 118, 0.9);
  -webkit-box-shadow: 5px 5px 5px -3px rgba(118, 118, 118, 0.9);
  -moz-box-shadow: 5px 5px 5px -3px rgba(118, 118, 118, 0.9); }

/*** НАЧАЛО: Внедряем кнопку Bookmark ***/
div#bg-bookmark-button {
  position: fixed;
  z-index: 100;
  width: 32px;
  height: 32px;
  top: 128px;
  right: -webkit-calc(50% - 40rem - 32px); 
  right: calc(50% - 40rem - 32px);
  background-color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  cursor: pointer; }

.bg_bookmark_btn {
  background-image: url("../images/my_bookmark.png"); }

.bg_nobookmark_btn {
  background-image: url("../images/nobookmark.png"); }
/*** КОНЕЦ: Внедряем кнопку Bookmark ***/

/*** НАЧАЛО: Внедряем кнопку Personal ***/
div#bg-personal-button {
  position: fixed;
  z-index: 100;
  width: 32px;
  height: 32px;
  top: 176px;
  right: -webkit-calc(50% - 40rem - 32px); 
  right: calc(50% - 40rem - 32px);
  background-color: transparent;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("../images/personal.png");
  cursor: pointer; 
 }
/*** КОНЕЦ: Внедряем кнопку Personal ***/

/* ============================
LOGIN
============================ */
ul.anycomment-socials li:before,
.wppb-user-forms ul li:before {
	border: 0 !important;
}


/********************************************/
/*	Кнопки управления при разрешении 		*/
/*  монитора до 960 пикселей 				*/
/*	и книжной ориентацией экрана			*/
/********************************************/
@media(orientation:portrait) and (max-width: 960px) {
	div#bg-player-dashboard {
	  position: fixed;
	  left: 0; bottom: 0;
	  width: 100%;
	  height: 50px;
	  background-color: #fff;
	  border-top: 2px solid #f8f4eb;
	  z-index: 100;
	}
	button.scroll-top {
		width: 36px;
		height: 36px;
		bottom: 0px;
		margin: 8px;
		z-index: 101;
	}
	
	div#bg-personal-button,
	div#bg-bookmark-button,
	div#bg-favorite-button {
		top: inherit;
		right: inherit;
		bottom: 0px;
		width: 32px;
		height: 32px;
		margin: 8px;
		z-index: 101; 
	} 
	div#bg-favorite-button {
		left: 10px;
	}
	div#bg-bookmark-button {
		left: 58px;
	}
	div#bg-personal-button {
		left: 111px;
	}
	div#back-to-top {
		right: 10px !important;
		width: 48px;
		height: 48px;
		z-index: 101; 
	}

	.wppb-form-field label{
		width: calc(100vw - 44px) !important;
	}
	.wppb-form-field input, 
	.wppb-form-field input[type=text], 
	.wppb-form-field input[type=number], 
	.wppb-form-field input[type=email], 
	.wppb-form-field input[type=url], 
	.wppb-form-field input[type=password], 
	.wppb-form-field input[type=search], 
	.wppb-form-field select, 
	.wppb-form-field textarea, 
	.wppb-checkboxes, 
	.wppb-radios, 
	#wppb-login-wrap .login-username input, 
	#wppb-login-wrap .login-password input {
		width: calc(100vw - 40px) !important;
	}
}
/********************************************/
/*	Кнопки управления при разрешении 		*/
/*  монитора до 960 пикселей 				*/
/*	и альбомной ориентацией экрана			*/
/********************************************/
@media(orientation:landscape) and (max-width: 960px) {
	button.scroll-top,
	div#bg-personal-button,
	div#bg-bookmark-button,
	div#bg-favorite-button {
		right: 1px; 
		width: 28px;
		height: 28px;
	} 
	div#bg-favorite-button {
		top: 100px; 
	} 
	div#bg-bookmark-button {
		top: 148px; 
	} 
	div#bg-personal-button {
		top: 196px; 
	} 
}