@charset "utf-8";

.switch3 	{
	position:relative;
	display:none;
	float:right;
	bottom:33px;
	right:10px;
	z-index:102;
	width:25px; height:25px;
	margin:0 0 -29px 0; padding: 2px 3px;
	background-color:#fe2f72;
	border-radius: 3px;
	cursor:pointer;
}

.content3	{
	position:relative;
	top:0;
	display:inline-block;
	z-index:97;
	width:100%;
	/* TEMP VIS height: 82px; */
	margin:0; padding:0; 
	background-color:rgba(0,0,0,.3);
	text-align:center;
	font-size:0.9rem;
}
.downloadFlashBtn	{display:inline-block; margin:1px auto 0 17px; border-radius: 3px; cursor:pointer; padding: 6px 40px; font-size: 0.8rem; font-weight: 800; text-decoration: none; color:#fff; background-color:#fe2f72; border-bottom: 3px solid #a2093a;}

.switch5	{
cursor: pointer;
position:relative;
margin-bottom: -31px;
padding: 4px 4px 3px 4px;
float: right;
top: -20px;
left: 7px;
z-index: 98;
background-color:#08C;
font-size: 0.9rem;
text-transform: uppercase;
text-align: center;
}

#triangle-topleft {
position: relative;
width: 0; height: 0;
border-top: 7px solid #036;
border-right: 7px solid transparent;
float: right;
margin-bottom: -7px;
float: right;
margin-bottom: -7px;
top: 10px;
left: 7px;
display: inline-block;
}

#c31, #c32, #c33{padding: 7px 0;}
#c32			{background-color:rgba(0,0,0,.15);}

.summer2020 {background-image:url("/images/rsp/summer2020-bg.png"); background-repeat: no-repeat;  background-position: center 0px;  height: 90px; text-align: center;}
.endSummer2020 {background-image:url("/images/rsp/end-summer2020-bg.png"); background-repeat: no-repeat;  background-position: center 0px;  height: 90px; text-align: center;}
.Halloween2020 {background-image:url("/images/rsp/Halloween2020.png"); background-repeat: no-repeat;  background-position: center 0px;  height: 81px; text-align: center;}

.chromeNot	{display: block !important;}
.chromeYes	{display: none !important;}

.chrome .chromeNot	{display: none !important;}
.chrome .chromeYes	{display: block !important;}



#promoTxt	{display:none;}
.promoLeft	{display: inline-block; margin-right: 20px;}
	#sakuraFlower {margin: 0 0 -14px 0;}
	#house {margin: 0 -12px -4px 0;}
.promoRight	{display: inline-block;}

.promoButtons		{display:inline-block; margin:7px auto 0 auto; padding: 6px 33px; font-family: Arial, "sans-serif"; font-size: 0.7rem; font-weight: 800; text-decoration: none; letter-spacing: 1px; color:#fff; border-radius: 3px; cursor:pointer; }
.promoButtonsColor2 {background-color:#fe2f72; border-bottom: 2px solid #a2093a;}
.promoButtonsColor2:hover {background-color:#ff548b; border-bottom: 2px solid #cc275c;}
.promoButtonsColor1 {background-color:#0088CC; border-bottom: 2px solid #095982;}
.promoButtonsColor1:hover {background-color:#1199DD; border-bottom: 2px solid #0d71a4;}
.promoButtonsColor3 {background-color:#4ab400; border-bottom: 2px solid #347308; position: relative; z-index: 11; bottom: 20px;}
.promoButtonsColor3:hover {background-color:#54cc00; border-bottom: 2px solid #3b8209;}
.promoButtonsColor4 {background-color:#ff47b3; border-bottom: 2px solid #BB1777;}
.promoButtonsColor4:hover {background-color:#fd67bf; border-bottom: 2px solid #ff47b3;}
.promoButtonsColor5 {background-color:#ff8647; border-bottom: 2px solid #ff6f20;}
.promoButtonsColor5:hover {background-color:#ffa547; border-bottom: 2px solid #ff9520;}
.promoButtonsColorOrange {background-color:#fe982f; border-bottom: 2px solid #ab5100;}
.promoButtonsColorOrange:hover {background-color:#ffb161; border-bottom: 2px solid #ff8200;}


#chromeMsg	{position: relative; width:100%; margin: 0 auto; padding: 10px 0; background:#0060B9; text-align: center;}
#closeBtn   {
background: #fe2f72;
position: relative;
padding: 3px 8px;
top: -4px;
right: 7px;
float: right;
color: #fff;
font-family: arial;
font-size: 1rem;
}

.chromeMsgTxt	{display:inline; font-size: 1rem;}

#thumBox	{position: relative; z-index:3; background: rgba(0,0,0,0.5); padding:4px 0 4px 0.6%;}

sup {font-size: 0.5rem;}

.promoBold {font-size: 1rem;}
.promoDate1 {font-size: 0.9rem;}
.promoDate2 {font-size: 1rem;}
.promoTime  {font-size:0.6rem;}

/* Rank */
#topGirls	{margin:10px 0 0 0; padding: 2px;text-align: center;background-color: rgba(89, 5, 46, 0.5); border-top:solid 3px #e9715f;}
#topGirls h1{font-size: 1.5rem; font-weight: 100; margin: 0 0 7px 0;}
.rankDiv	{display:inline-block;margin: 0 3px 8px 3px; width: 24%;}
.rankImg	{width:100%;}
.rankArrow	{position:relative; bottom: 1px;}
.rankName	{background:#222222; padding: 2px 0 2px 10px; font-size: 0.9rem; text-align: left;}
.rankStatus	{margin:0 0 -35px 0; padding: 4px 0;font-size: 1rem; font-weight: 600;position: relative;bottom: 35px;}
.rankOffline{background:#55555588;}
.rankPrivate{background:#ff0066b0;}
.rankStarted{background:#008eb4d6;}
.rankFree	{background:#8dbd11c4;}


/* HOLIDAY */
#christmasPromo2{position:relative; width: 314px; margin: 0 auto -58px auto; text-align: center; z-index: 10;} 


@media all and (max-width: 1300px) {
.rankDiv	{width:24%;}
.rankStatus	{font-size: 0.8rem;bottom: 30px;}
.rankName	{font-size: 0.7rem;padding: 7px 0 2px 10px;}
}

@media all and (max-width: 900px) {
.rankDiv	{width:32%;}
}

@media all and (max-width: 500px) {
.rankDiv	{width:49%;}
.rankName	{padding:5px 0 1px 7px;}
}



@media all and (max-width: 750px) {
.content3	{font-size: 0.8rem; top: 0px; /* TEMP VIS height: 78px; */}
.contentJP {font-size: 0.7rem;}
/* .regular, .regular2, .regular3 { background-color:darkgray;} */
.promoLeft {margin-right: 5px;}
}

@media all and (max-width: 600px) {
/* .chromeMsgTxt		{font-size: 0.9rem;}
.downloadFlashBtn	{margin:5px 28px 0 0;font-size: 0.8rem;}

.content3			{height:74px;} */
.promoButtons	{padding: 6px 20px; font-size: 0.6rem; font-weight: 100;}
.promoLeft {margin-right: 20px;}
}

@media all and (max-width: 520px) {
.switch5			{top: 0px; left: 0px; width: 100%; margin: 0 auto 0 auto; padding:6px 0 0 0; float: none;}
#promoTxt			{display:inline-block;position: relative; bottom: 5px; left: 10px;}
	
.content3			{font-size: 0.8rem; margin: 0 0 5px 0; /* TEMP VIS height: 82px; */}
.contentJP 			{font-size: 0.7rem;}
.contentJP .promoLeft	{margin-right: 2px;}
	
#triangle-topleft 	{display: none;}
.chromeMsgTxt		{font-size: 0.8rem;}
.downloadFlashBtn	{display:inline-block;margin:5px 0 0 0;}
	
/* .regular, .regular2, .regular3 { background-color:aqua;} */
}

@media all and (max-width: 400px) {
.chromeMsgTxt		{display: block;}
.downloadFlashBtn	{font-size: 0.7rem;margin:5px 28px 0 0;}
	
.promoBold  {font-size:0.9rem;}
.promoDate1 {font-size:0.8rem;}
.promoTime  {font-size:0.6rem;}
}