@font-face {
	font-family: SanFranciscoText-Regular;
	src: url(../webfonts/SanFranciscoText-Regular.otf);
}
*{
	font-family: SanFranciscoText-Regular;
}
body {
    background: url(../images/bg_home.jpg) repeat scroll 0 0 transparent;
}
.container{
	min-height: 40vh;
}
.ServiceLayout {
    position: relative;
    width: 750px;
    max-width: 100%;
    min-height: 100%;
    margin: 0 auto;
    background: #f0f2f5;
}
.menu_top{
	padding: 15px 10px 15px 10px;
	display: flex;
	align-items: center;
}
.color_dark{
	color: rgb(52,71,103);
	font-size: 1.2rem;
	font-weight: 500;
}
.menu_left{
	flex: 1;
}
.menu_right{
	/* padding: 0px 14px 0px 0px; */
}
.ico{
	cursor: pointer;
	font-size: 1.4rem;
}
.bTn{
	padding: 8px;
	outline: none;
	cursor: pointer;
}
.bTn:hover{
	filter: opacity(0.5);
}
.btnBlue{
	background-image: linear-gradient(0deg,rgb(6,122,203),rgba(6,122,203,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(6,122,203,.15),0 3px 1px -2px rgba(6,122,203,.2),0 1px 5px rgba(6,122,203,.15);
}
.btnRed{
	background-image: linear-gradient(0deg,rgb(244,67,53),rgba(244,67,53,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(244,67,53,.15),0 3px 1px -2px rgba(244,67,53,.2),0 1px 5px rgba(244,67,53,.15);
}
.btnGreen{
	background-image: linear-gradient(0deg,rgb(75,224,81),rgba(75,224,81,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 1px rgba(75,224,81), 0 3px 1px -2px rgba(75,224,81,.2), 0 1px 5px rgba(75,224,81,.15);
}
.btnCard{
	background-image: linear-gradient(0deg,rgb(90,170,61),rgba(90,170,61,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 0px 1px rgba(90,170,61), 0 3px 1px -2px rgba(90,170,61,.2), 0 1px 5px rgba(75,224,81,.15);
}
.btnBank{
	background-image: linear-gradient(0deg,rgb(243,141,26),rgba(243,141,26,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 0px 1px rgba(243,141,26), 0 3px 1px -2px rgba(243,141,26,.2), 0 1px 5px rgba(75,224,81,.15);
}
.btnMomo{
	background-image: linear-gradient(0deg,rgb(175,32,112),rgba(175,32,112,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 0px 1px rgba(175,32,112), 0 3px 1px -2px rgba(175,32,112,.2), 0 1px 5px rgba(75,224,81,.15);
}
.btnYellow{
	background-image: linear-gradient(0deg,rgb(245,176,66),rgba(245,176,66,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 1rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(245,176,66,.15),0 3px 1px -2px rgba(245,176,66,.2),0 1px 5px rgba(245,176,66,.15);
}
.btn1{
	background-image: linear-gradient(0deg,rgb(26,115,232),rgba(26,115,232,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(26,115,232,.15),0 3px 1px -2px rgba(26,115,232,.2),0 1px 5px rgba(26,115,232,.15);
}
.btn2{
	background-image: linear-gradient(0deg,rgb(38,57,84),rgba(38,57,84,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(38,57,84,.15),0 3px 1px -2px rgba(38,57,84,.2),0 1px 5px rgba(38,57,84,.15);
}
.btn3{
	background-image: linear-gradient(0deg,rgb(59,89,153),rgba(59,89,153,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(59,89,153,.15),0 3px 1px -2px rgba(59,89,153,.2),0 1px 5px rgba(59,89,153,.15);
}
.btn4{
	background-image: linear-gradient(0deg,rgb(28,159,247),rgba(28,159,247,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	/* box-shadow: 0 3px 3px rgba(28,159,247,.15),0 3px 1px -2px rgba(28,159,247,.2),0 1px 5px rgba(28,159,247,.15); */
}
.btn5{
	background-image: linear-gradient(0deg,rgb(75,224,81),rgba(75,224,81,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(75,224,81,.15),0 3px 1px -2px rgba(75,224,81,.2),0 1px 5px rgba(75,224,81,.15);
}
.btn6{
	background-image: linear-gradient(0deg,rgb(244,67,53),rgba(244,67,53,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(244,67,53,.15),0 3px 1px -2px rgba(244,67,53,.2),0 1px 5px rgba(244,67,53,.15);
}
.btn7{
	background-image: linear-gradient(0deg,#02b2af,rgba(2,178,175,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(2,178,175,.15),0 3px 1px -2px rgba(2,178,175,.2),0 1px 5px rgba(2,178,175,.15);
}
.btn8{
	background-image: linear-gradient(0deg,rgb(245,176,66),rgba(245,176,66,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(245,176,66,.15),0 3px 1px -2px rgba(245,176,66,.2),0 1px 5px rgba(245,176,66,.15);
}
.btn9{
	background-image: linear-gradient(0deg,rgb(255,65,83),rgba(255,65,83,.7));
	color: rgb(240,242,245);
	font-weight: 500;
	font-size: 0.8rem;
	border: 0;
	border-radius: 5px;
	box-shadow: 0 3px 3px rgba(255,65,83,.15),0 3px 1px -2px rgba(255,65,83,.2),0 1px 5px rgba(255,65,83,.15);
}
.btnDot{
	border: dashed  1px #adb5bd;
	border-radius: 5px;
	background: rgb(240,242,245) !important;
	padding: 8px;
	font-size: 0.8rem;
}
.mr1{
	margin-right: calc(12px*.5);
}
.img_banner{width: 100%;}
.img_banner img{
	width: 100%;
}
.menu-icon {
  cursor: pointer;
  padding: 20px;
  display: inherit;
  text-align: center;
}

.menu-icon i {
  font-size: 2rem;
}

.menu-text {
  margin-top: 5px;
  font-size: 14px;
  color: rgb(108 117 125);
  font-weight: 600;
}
.menu_bottom{
	display: inline-block;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
.w{
	width: 50px;
	height: 50px;
	justify-content: center;
	align-items: center;
	display: flex;
	margin: 5px 10px 5px 10px;
}
#leftBar{
	width: auto !important;
}
.left_bar{
	cursor: pointer;
	background: rgb(248 249 250);
	display: flex;
	align-items: center;
	border-radius: 5px;
	margin: 0px 0px 10px 0px;
}
.left_bar span{
	color: rgb(52,71,103);
    font-weight: 500;
}
.left_bar i{
	font-size: 2rem
}
.top_title_ui{
	background: rgb(248 249 250);
	position: relative;
	border-radius: 10px 10px 0px 0px;
	box-shadow: 0 0 20px -10px rgb(0,0,0,.2);
	border: 1px solid rgba(52,71,103,.1);
	margin: auto;
}
.bottom_title_ui{
	background: rgb(248 249 250);
	position: relative;
	border-radius: 0px 0px 10px 10px;
	box-shadow: 0 0 20px -10px rgb(0,0,0,.2);
	border: 1px solid rgba(52,71,103,.1);
	margin: auto;
	margin-top: -2px;
	padding: 10px;
}
.bottom_title_ui button{
	float: right;
}
.name_ui{
	color: rgb(52,71,103);
    font-weight: 500;
    font-size: 1.1rem;
    padding: 8px;
    display: block;
}
input{
	outline: none !important;
	border: none !important;
}
input:focus{
	background: rgb(248 249 250) !important;
	outline: none !important;
	border: none !important;
	box-shadow: none !important;
}
select:focus{
	background: rgb(248 249 250) !important;
	outline: none !important;
	border: none !important;
	box-shadow: none !important;
}
.form, .select{
	background: #fff;
	position: relative;
	box-shadow: 0 0 20px -10px rgb(0,0,0,.2);
	border: 1px solid rgba(52,71,103,.1);
	margin: auto;
	margin-top: -2px;
}
.form i{
	font-size: 2rem;
}
.input{
	background: rgb(248 249 250);
	font-size: 0.9rem !important;
}
input::-webkit-input-placeholder {
  color: #ccc;
}

input:-ms-input-placeholder {
  color: #ccc;
}

input::placeholder {
  color: #ccc;
}

.name_ui_bottom{
	color: rgb(52,71,103);
	font-weight: 600;
	background: rgb(240 242 245);
	padding: 5px;
	border-radius: 5px;
	border: 1px dashed rgba(52,71,103,.1);
	cursor: pointer;
	display: inline-block;
	 /* Căn giữa theo chiều ngang */
}

footer{
	background: rgb(248 249 250);
    text-align: center;
    padding: 10px;
	color: #61616a;
}
footer img{
	width: 250px;
}
.news_img{
	width: 350px;
	height: 197px;
	object-fit: cover;
	border-radius: 5px;
}
.news_date{
	background: #f0f2f5;
	padding: 5px;
	border-radius: 5px;
	color: rgb(52,71,103);
	font-weight: 600;
	position: absolute;
	margin: 12px 0px 0px 208px;
}
.news_title{
	position: absolute;
	margin: 154px 0px 0px 0px;
	background: #f0f2f5bd;
	border-radius: 0px 0px 5px 5px;
	color: rgb(52,71,103);
	font-weight: 700;
	padding: 10px;
	width: 347px;
}
.btnNews{
	cursor: pointer;
}
.news_img:hover{
	filter: blur(1px);
}
.ui_News{
	margin: 0 auto;
}
#alertLogin, #alertReg{
	width: 90%;
	margin: 0 auto;
}
.ico_user{
	background: #fff;
	color: #3994d3;
	padding: 5px;
	border-radius: 10px;
}
.ico_xu{
	background: #fff;
	color: #f4665b;
	padding: 5px;
	border-radius: 10px;
}
.user_bar{
	/* padding: 2px 2px 2px 2px; */
}
.topUser{
	background: #fff;
	margin: 0 auto;
	border-radius: 5px;
}
.avatar{
	width: 80px;
    height: 80px;
    border-radius: 10px;
}
.table{
	vertical-align: middle;
	box-shadow: 0 0 20px -10px rgba(0,0,0,.2);
}
.c1{
	flex: 1;
}
.logOut{
	text-align: center;
	border-radius: 0px 10px 0px 0px;
}
.s_logout{
	width: 40px;
	height: 31px;
	text-align: center;
}
.s_logout i{
	font-size: 1rem
}
.ava{
	width: 10px;
	border-radius: 10px 0px 0px 0px;
}
.vipExp{
	color: rgb(52,71,103) !important;
	text-align: center;
	border-radius: 0px 0px 0px 10px;
	border-bottom: 0;
}
.vipbar{
	border-radius: 0px 0px 10px 0px;
    border-bottom: 0;
}
.main{
	padding: 0px 10px 0px 10px;
}
.tb_title{
	background: rgb(248 249 250) !important;
    border-radius: 10px 10px 0px 0px;
    color: rgb(52,71,103) !important;
}
.info_profile td{
	color: #495057;
	font-size: 0.9rem;
}
.info_profile th{
	color: rgb(52,71,103);
	text-align: right;
	border-bottom: 0;
}
.info tr{
	height: 50px;
}
.info td{
	border-bottom: 0;
	text-align: left;
}
.box_pay{
	text-align: center;
	margin: 0 auto; 
}
.info_pay{
	display: grid;cursor: pointer;
}
.info_pay img{
	width: 50%;
}
.payType{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
	background: #f2f2f2;
	color: rgb(52,71,103);
	font-size: 1.5vh;
	font-weight: 700;
	padding: 8px;
	border-radius: 10px 10px 0px 0px;
}
.payImg{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
	background: #fff;
	padding: 8px;
}
.payBonus{
	box-shadow: 0 3px 8px -5px rgb(20 0 0);
	background: #f2f2f2;
	color: rgb(52,71,103);
	font-size: 1.5vh;
	font-weight: 700;
	padding: 8px;
	border-radius: 0px 0px 10px 10px;
}
.cardType_active{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
    background: #81b76d;
    color: #fff;
    font-size: 1.5vh;
    font-weight: 700;
    padding: 8px;
    border-radius: 10px 10px 0px 0px;
}
.cardImg_active{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
    background-image: linear-gradient(0deg,rgb(90,170,61),rgba(90,170,61,.7));
    padding: 8px;
}
.cardBonus_active{
	box-shadow: 0 3px 8px -5px rgb(20 0 0);
    background: #59a33f;
    color: #fff;
    font-size: 1.5vh;
    font-weight: 700;
    padding: 8px;
    border-radius: 0px 0px 10px 10px;
}
.bankType_active{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
    background: rgb(255 163 60);
    color: #fff;
    font-size: 1.5vh;
    font-weight: 700;
    padding: 8px;
    border-radius: 10px 10px 0px 0px;
}
.bankImg_active{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
    background-image: linear-gradient(0deg,rgb(243,141,26),rgba(243,141,26,.7));
    padding: 8px;
}
.bankBonus_active{
	box-shadow: 0 3px 8px -5px rgb(20 0 0);
    background: #e7881c;
    color: #fff;
    font-size: 1.5vh;
    font-weight: 700;
    padding: 8px;
    border-radius: 0px 0px 10px 10px;
}

.momoType_active{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
    background: rgb(205 59 141);
    color: #fff;
    font-size: 1.5vh;
    font-weight: 700;
    padding: 8px;
    border-radius: 10px 10px 0px 0px;
}
.momoImg_active{
	box-shadow: 0 0 13px -10px rgb(20 0 0);
    background-image: linear-gradient(0deg,rgb(175,32,112),rgba(175,32,112,.7));
    padding: 8px;
}
.momoBonus_active{
	box-shadow: 0 3px 8px -5px rgb(20 0 0);
    background: rgb(187 44 124);
    color: #fff;
    font-size: 1.5vh;
    font-weight: 700;
    padding: 8px;
    border-radius: 0px 0px 10px 10px;
}
.c{
	width: 65px;
	display: inline-table;
}
.btncardsubmit{
	float: inherit !important;
}