/******************************
 * author : Kiko
 *******************************/

.page-title {
	position: fixed;
	top: 0;
    left: calc(100% /2 - 150px);
	text-align: center;
	z-index: 10001;
}  
.page-title span {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
    padding: 5px 20px;
    font-size: 35px;
	color: #fff;
	border-bottom-right-radius: 18px;
	border-bottom-left-radius: 18px;
}



#player {
	position: fixed;
	top:62px;
	left: 0;
	width: 100%;
	height: calc(100% - 62px);
	box-sizing: border-box;
}



#popup,#popupCon {
	display: none;
	position: fixed;
	top:62px;
	left: 0;
	width: 100%;
	height: calc(100% - 62px);
	box-sizing: border-box;
	z-index: 2;
}
.popup {
	position: relative;
	left: 0;
	background-color: rgb(198 198 198 / 43%);
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	display: flex;
}
.popup .qa{
	background-color: #d9d7db;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
.popup-center {
	align-items: center;
	justify-content: center;
}
.qa-center {
	width: 100%;
	max-width: 370px;
}
.popup-left {
	align-items: center;
	justify-content: flex-start;
}
.popup-right {
	align-items: center;
	justify-content: flex-end;
}
.qa-left,
.qa-right {
	height: 100%;
	max-width: 370px;
}
.popup-bottom {
	align-items: flex-end;
	justify-content: center;
}
.qa-up,
.qa-bottom {
	width: 100%;
}



.btn:not(.main_bt), h1{
	font-size: 1.8em;
}
.btn img{
	width: 100%;
	max-width: 320px;
}
.btn-primary::before {
	content: "\2660";
	padding-right: 10px;
}
.btn-success::before {
	content: "\2665";
	padding-right: 10px;
}
.btn-danger::before {
	content: "\2663";
	padding-right: 10px;
}
.btn-warning::before {
	content: "\2666";
	padding-right: 10px;
}


.myToast {
	position:fixed; 
	top:60px; 
	left:0; 
	z-index:99999; 
	width:100%;
	max-width:100%;
	height: 100%;
}
.myToast .toast-body {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width:100%;
	height: 100%;
}
.myToast .right-or-wrong {
	width: 100%;
	max-width: 400px;
}


.PlayCount{
    position: relative;
    right: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #d9d7db;
}