/*==================================================
GAME PORTAL
PC STYLE
==================================================*/
@font-face {
	font-family: 'Pretendard Variable';
	font-weight: 45 920;
	font-style: normal;
	font-display: swap;
	src: url('/pc/font/PretendardVariable.woff2') format('woff2-variations');
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{

    scroll-behavior:smooth;

}

body{

    background:#050913;

    color:#ffffff;

    font-family: "Pretendard Variable", Pretendard, sans-serif;

    overflow-x:hidden;

}

a{

    text-decoration:none;

    color:#fff;

}

ul{

    list-style:none;

}

img{

    display:block;

    max-width:100%;

}

button{

    cursor:pointer;

    border:none;

    outline:none;

    font-family:inherit;

}

input,
select{

    outline:none;

    font-family:inherit;

}



/*==================================================
VARIABLE
==================================================*/

:root{

--bg:#050913;

--panel:#101728;

--panel2:#161f36;

--main:#6d39ff;

--main2:#b464ff;

--border:#6a42ff;

--yellow:#ffd84d;

--text:#ffffff;

--sub:#bfc6dd;

}



/*==================================================
BACKGROUND
==================================================*/

body::before{

content:"";

position:fixed;

left:0;

top:0;

width:100%;

height:100%;

background:

radial-gradient(circle at top,#35237e 0%,transparent 45%),

radial-gradient(circle at right,#1d2b63 0%,transparent 35%),

linear-gradient(180deg,#04070f,#050913);

z-index:-2;

}



.bg-effect{

position:fixed;

left:0;

top:0;

width:100%;

height:100%;

pointer-events:none;

background-image:

linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),

linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);

background-size:50px 50px;

opacity:.35;

z-index:-1;

}



/*==================================================
CONTAINER
==================================================*/

.container{

width:1280px;

margin:auto;

}



/*==================================================
HEADER
==================================================*/

.top-header{

height:90px;

display:flex;

align-items:center;

background:#0b1222;

border-bottom:1px solid rgba(255,255,255,.06);

box-shadow:

0 8px 35px rgba(0,0,0,.45);

}

.top-header .container{

display:flex;

justify-content:space-between;

align-items:center;

}

.logo img{

height:75px;

width:auto;

}



/*==================================================
MEMBER
==================================================*/
/*==================================================
LOGIN USER INFO
==================================================*/


.login-user{


    display:flex;
    
    align-items:center;
    
    gap:15px;
    
    
    }
    
    
    
    
    .user-info{
    
    
    display:flex;
    
    
    align-items:center;
    
    
    gap:20px;
    
    
    height:46px;
    
    
    padding:0 20px;
    
    
    background:
    
    linear-gradient(
    180deg,
    #171f36,
    #101728
    );
    
    
    border:1px solid var(--border);
    
    
    box-shadow:
    
    0 0 15px rgba(109,57,255,.35);
    
    
    }
    
    
    
    .user-row{
    
    
    font-size:14px;
    
    
    color:#cbd2e8;
    
    
    white-space:nowrap;
    
    
    }
    
    
    
    .user-row strong{
    
    
    margin-left:5px;
    
    
    color:#ffd84d;
    
    
    font-size:15px;
    
    
    }
    
    
    
    .user-row .credit{
    
    
    color:#b477ff;
    
    }
    
    
    
    .user-row .gift{
    
    
    color:#b477ff;
    
    }
    
    
    
    
    .logout-btn{
    
    
    height:46px;
    
    
    padding:0 28px;
    
    
    font-size:15px;
    
    
    font-weight:700;
    
    
    color:white;
    
    
    background:
    
    linear-gradient(
    90deg,
    #ff416c,
    #ff4b2b
    );
    
    
    
    border:1px solid #ff7890;
    
    
    box-shadow:
    
    0 0 15px rgba(255,70,100,.45);
    
    
    transition:.3s;
    
    
    }
    
    
    
    .logout-btn:hover{
    
    
    transform:translateY(-2px);
    
    
    box-shadow:
    
    0 0 25px rgba(255,70,100,.8);
    
    
    }


.member-menu{

display:flex;

gap:12px;

}

.member-btn{

height:46px;

padding:0 30px;


font-size:15px;

font-weight:700;

color:#fff;

border:1px solid var(--border);

background:

linear-gradient(

180deg,

#20284b,

#111829

);

transition:.25s;

}

.member-btn:hover{

background:

linear-gradient(

90deg,

#6b3cff,

#a563ff

);

box-shadow:

0 0 18px rgba(167,108,255,.85);

transform:translateY(-2px);

}

.join{

background:

linear-gradient(

90deg,

#6c39ff,

#9d5eff

);

}



/*==================================================
MENU
==================================================*/

.main-menu{

height:68px;

background:#0d1425;

border-top:1px solid rgba(255,255,255,.04);

border-bottom:1px solid rgba(255,255,255,.05);

}

.main-menu ul{

display:flex;

height:68px;

gap:14px;

align-items:center;

justify-content:center;

}

.main-menu li{

flex:1;

}

.main-menu a{

display:flex;

justify-content:center;

align-items:center;

height:48px;


font-size:17px;

font-weight:700;

background:

linear-gradient(

180deg,

#212a4d,

#101729

);

border:1px solid var(--border);

transition:.25s;

}

.main-menu a img{

width:18px;

margin-right:8px;

}

.main-menu a:hover{

background:

linear-gradient(

90deg,

#6a36ff,

#a966ff

);

box-shadow:

0 0 18px rgba(164,108,255,.9);

}



/*==================================================
NEWS
==================================================*/

.news-wrap{

margin-top:16px;

}

.news-wrap .container{

display:flex;

align-items:center;

}

.news-title{

width:90px;

height:44px;

display:flex;

justify-content:center;

align-items:center;

font-size:15px;

font-weight:700;


background:

linear-gradient(

90deg,

#6d3dff,

#9758ff

);

}

.news-box{

flex:1;

height:44px;

overflow:hidden;

background:#11182a;

border:1px solid var(--border);

border-left:none;


position:relative;

}

.news-track{

display:flex;

align-items:center;

height:44px;

position:absolute;

white-space:nowrap;

animation:newsMove 25s linear infinite;

}

.news-track span{

margin-right:120px;

font-size:14px;

color:#d7dcf3;

}

@keyframes newsMove{

0%{

transform:translateX(100%);

}

100%{

transform:translateX(-100%);

}

}

/*==================================================
BANNER
==================================================*/



.bannerSwiper{

    width:100%;

    height:430px;

    overflow:hidden;


    border:1px solid var(--border);

    box-shadow:

    0 0 35px rgba(113,78,255,.35);

}

.bannerSwiper img{

    width:100%;

    height:430px;

    object-fit:cover;

}

.bannerSwiper .swiper-button-next,
.bannerSwiper .swiper-button-prev{

    width:46px;

    height:46px;


    background:rgba(18,26,46,.8);

    border:1px solid var(--border);

    color:#fff;

    transition:.25s;

}

.bannerSwiper .swiper-button-next:hover,
.bannerSwiper .swiper-button-prev:hover{

    background:linear-gradient(
    90deg,
    #6d3eff,
    #9f63ff
    );

    box-shadow:0 0 15px rgba(160,110,255,.8);

}

.bannerSwiper .swiper-button-next::after,
.bannerSwiper .swiper-button-prev::after{

    font-size:18px;

    font-weight:bold;

}

.bannerSwiper .swiper-pagination-bullet{

    width:11px;

    height:11px;

    background:#fff;

    opacity:.35;

}

.bannerSwiper .swiper-pagination-bullet-active{

    opacity:1;

    background:#9a63ff;

    box-shadow:0 0 12px #9a63ff;

}



/*==================================================
PLAY BUTTON
==================================================*/

.play-button{

    display: flex
;
    justify-content: center;
    align-items: center;

    font-size: 28px;
    font-weight: 700;

    color: #fff;
    height: 97px;
    background: url("../images/gamestart.png") no-repeat center;
    background-size: auto 97px;
    line-height: 15px;

}

.play-button1{

    display: flex
;
    justify-content: center;
    align-items: center;

    font-size: 28px;
    font-weight: 700;


}
.sbss{
    /* 动画名称 时长 循环播放 */
    margin-left:80px;
    text-align: center;
    margin-top: 10px;
    letter-spacing: 5px;
    
  animation: scaleText 2s infinite;
}
.sbsss{
    letter-spacing: 3px;
    /* 动画名称 时长 循环播放 */
    font-size: 12px;
}

/* 定义放大缩小动画 */
@keyframes scaleText {
    0% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.2);
    }
    100% {
      transform: scale(1);
    }
  }



/*==========================================
MAIN VISUAL
==========================================*/

.main-visual{

    margin-top:20px;

}

.visual-wrap{

    display:flex;

    gap:20px;

}

.visual-left{

    width:72%;

}

.visual-right{

    width:28%;

    display:flex;

    flex-direction:column;

    gap:16px;

}
.bannerSwiper{

    height:650px;


    overflow:hidden;

}

.bannerSwiper img{

    width:100%;

    height:650px;

    object-fit:cover;

}

.status-box{

    flex:1;

    overflow:hidden;

}
.status-list{

    max-height:159px;


    position:relative;

    padding:15px;

}
/*==================================================
STATUS
==================================================*/


.status-box{

    flex:1;

    background:linear-gradient(
    180deg,
    #11192d,
    #090d1a
    );

    border:1px solid var(--border);


    overflow:hidden;

    box-shadow:

    0 0 20px rgba(111,78,255,.28);

}

.box-title{
    position:relative;

    z-index:5;
    height:52px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:18px;

    font-weight:700;

    background:linear-gradient(
    90deg,
    #6b39ff,
    #9856ff
    );

}

.status-list{

    padding:15px;

}

.status-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:15px;

    margin-bottom:12px;


    background:#171f36;

    border:1px solid rgba(255,255,255,.04);

    transition:.25s;

}

.status-row:last-child{

    margin-bottom:0;

}

.status-row:hover{

    background:#1c2643;

    border-color:#8b5fff;

    box-shadow:

    0 0 12px rgba(150,103,255,.6);

}

.status-row span{

    color:#d2d8eb;

    font-size:15px;

}

.status-row strong{

    color:#ffd84d;

    font-size:18px;

    font-weight:700;

}



/*==================================================
BOARD
==================================================*/


.board-box{

    flex:1;
        
    margin-bottom:0;


    overflow:hidden;

    background:linear-gradient(
    180deg,
    #101728,
    #080d18
    );

    border:1px solid var(--border);

    box-shadow:

    0 0 18px rgba(109,80,255,.3);

}



.board-section{

    margin-top:25px;

}
.board-section .container{

    display:flex;
    
    gap:20px;
    
    align-items:flex-start;
    
    }
.board-list{

height:300px;

overflow:hidden;

}

.board-title{

    height:54px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 22px;

    background:linear-gradient(
    90deg,
    #6b39ff,
    #9d5eff
    );

}

.board-title h2{

    font-size:18px;

}

.board-title a{

    font-size:28px;

    font-weight:bold;

}

.board-list li{

    border-bottom:1px solid rgba(255,255,255,.05);

}

.board-list li:last-child{

    border-bottom:none;

}

.board-list a{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:18px 22px;

    transition:.25s;

}

.board-list a:hover{

    background:#18203a;

}

.board-list span{

    font-size:15px;

    color:#fff;

}

.board-list em{

    font-style:normal;

    color:#aeb7cf;

    font-size:14px;

}



/*==================================================
FOOTER BANNER
==================================================*/

.footer-banner{

    margin-top:28px;

}

.footer-banner img{


    border:1px solid var(--border);

    box-shadow:

    0 0 20px rgba(115,81,255,.3);

}



/*==================================================
FOOTER
==================================================*/

.footer{

    margin-top:25px;

    padding:30px 0;

    text-align:center;

    color:#8f98b8;

    border-top:1px solid rgba(255,255,255,.05);

    font-size:13px;

}

/*==================================================
LOGIN MODAL
==================================================*/

.modal{

    position:fixed;

    left:0;

    top:0;

    width:100%;

    height:100%;

    display:none;

    justify-content:center;

    align-items:center;

    z-index:9999;

}

.modal.active{

    display:flex;

}

.modal-bg{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.75);

    backdrop-filter:blur(6px);

}

.modal-box{

    position:relative;

    width:500px;


    overflow:hidden;

    background:linear-gradient(
    180deg,
    #11192d,
    #090d18
    );

    border:1px solid var(--border);

    box-shadow:

    0 0 45px rgba(116,80,255,.55);

    animation:modalShow .35s ease;

    z-index:10;

}

@keyframes modalShow{

0%{

opacity:0;

transform:scale(.85);

}

100%{

opacity:1;

transform:scale(1);

}

}

.modal-close{

position:absolute;

right:16px;

top:14px;

width:38px;

height:38px;

font-size:28px;

background:none;

color:#fff;

transition:.25s;

}

.modal-close:hover{

transform:rotate(90deg);

color:#ffce55;

}

.modal-logo{

padding-top:35px;

display:flex;

justify-content:center;

}

.modal-logo img{

height:58px;

width:auto;

}

.modal-box h2{

margin-top:18px;

text-align:center;

font-size:28px;

font-weight:700;

}

.login-box form{

padding:35px;

}



/*==================================================
INPUT
==================================================*/

.input-group{

margin-bottom:22px;

}

.input-group label{

display:block;

margin-bottom:10px;

font-size:14px;

color:#c9d0e7;

font-weight:600;

}

.input-group input{

width:100%;

height:52px;

padding:0 16px;

background:#171f35;

border:1px solid #38405e;


color:#fff;

font-size:15px;

transition:.25s;

}

.input-group input:focus{

border-color:#9562ff;

box-shadow:

0 0 15px rgba(153,105,255,.65);

}

.password-box{

position:relative;

}

.password-box input{

padding-right:55px;

}

.show-password{

position:absolute;

right:12px;

top:8px;

width:36px;

height:36px;

background:none;

font-size:18px;

color:#d7d9e7;

}



/*==================================================
CHECKBOX
==================================================*/

.remember{

margin-bottom:25px;

display:flex;

justify-content:flex-start;

}

.remember label{

display:flex;

align-items:center;

gap:8px;

font-size:14px;

color:#b9c2dc;

}

.remember input{

width:16px;

height:16px;

accent-color:#8d61ff;

}



/*==================================================
BUTTON
==================================================*/

.submit-btn{

width:100%;

height:58px;

font-size:18px;

font-weight:700;

color:#fff;


background:linear-gradient(
90deg,
#6035ff,
#a060ff
);

border:1px solid #9865ff;

transition:.3s;

box-shadow:

0 0 20px rgba(139,95,255,.45);

}

.submit-btn:hover{

transform:translateY(-2px);

box-shadow:

0 0 35px rgba(184,136,255,.9);

}

.join-link{

margin-top:22px;

text-align:center;

font-size:14px;

color:#b6bfd7;

}

.join-link a{

margin-left:8px;

color:#ffd84d;

font-weight:700;

}



/*==================================================
REGISTER
==================================================*/

.register-box{

width:820px;

max-height:90vh;

overflow-y:auto;

}

.bonus-text{

margin-top:10px;

margin-bottom:30px;

text-align:center;

font-size:15px;

color:#d5dbef;

}

.bonus-text strong{

color:#ffd84d;

}

.form-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:18px;

padding:0 35px;

}

.form-grid .full{

grid-column:1/3;

}

.form-grid select{

width:100%;

height:52px;

padding:0 14px;

background:#171f35;

border:1px solid #38405e;


color:#fff;

font-size:15px;

transition:.25s;

}

.form-grid select:focus{

border-color:#9461ff;

box-shadow:

0 0 15px rgba(152,106,255,.65);

}

.join-notice{

margin:30px 35px;

padding:18px;


background:#151d31;

border:1px solid rgba(255,255,255,.05);

}

.join-notice p{

margin-bottom:10px;

font-size:14px;

color:#d2d7ea;

}

.join-notice p:last-child{

margin-bottom:0;

}

.register-box .submit-btn{

margin:0 35px 35px;

width:calc(100% - 70px);

}

/*==================================================
TABLE / LIST HOVER
==================================================*/

.board-list li{

    position:relative;

    overflow:hidden;

}

.board-list li::before{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:100%;

    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.08),
        transparent
    );

    transition:.8s;

}

.board-list li:hover::before{

    left:120%;

}

.board-list li:hover span{

    color:#ffd84d;

}



/*==================================================
INPUT PLACEHOLDER
==================================================*/

input::placeholder{

    color:#6f7995;

}

select{

    appearance:none;

    -webkit-appearance:none;

    background-image:url("../images/select-arrow.png");

    background-repeat:no-repeat;

    background-position:right 16px center;

}



/*==================================================
SCROLLBAR
==================================================*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-track{

    background:#0b1222;

}

::-webkit-scrollbar-thumb{


    background:linear-gradient(
        180deg,
        #6a39ff,
        #9b61ff
    );

}

::-webkit-scrollbar-thumb:hover{

    background:#b173ff;

}



/*==================================================
GLOW EFFECT
==================================================*/

.glow{

    animation:glowEffect 2s infinite;

}

@keyframes glowEffect{

0%{

box-shadow:

0 0 8px rgba(120,80,255,.25);

}

50%{

box-shadow:

0 0 28px rgba(170,120,255,.95);

}

100%{

box-shadow:

0 0 8px rgba(120,80,255,.25);

}

}



/*==================================================
FLOAT
==================================================*/

.float{

animation:floatBox 3.5s ease-in-out infinite;

}

@keyframes floatBox{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}



/*==================================================
BUTTON RIPPLE
==================================================*/

.member-btn,
.play-button,
.submit-btn{

    position:relative;

    overflow:hidden;

}

.member-btn::after,
.play-button::after,
.submit-btn::after{

    content:"";

    position:absolute;

    width:0;

    height:0;


    background:rgba(255,255,255,.25);

    transform:translate(-50%,-50%);

    left:50%;

    top:50%;

    transition:.55s;
    border-radius: 5px;

}

.member-btn:hover::after,
.play-button:hover::after,
.submit-btn:hover::after{

    width:420px;

    height:420px;
    border-radius: 5px;
}



/*==================================================
STATUS FLASH
==================================================*/

.status-row strong{

    animation:numberFlash 3s infinite;
    
}

@keyframes numberFlash{

0%{

color:#ffd84d;

}

50%{

color:#fff59c;

text-shadow:

0 0 12px #ffe45a;

}

100%{

color:#ffd84d;

}

}



/*==================================================
CARD SHOW
==================================================*/

.status-box,
.board-box,
.bannerSwiper,
.play-button,
.play-button1{

opacity:0;

transform:translateY(30px);

animation:showUp .8s forwards;
border-radius: 8px;
}

.status-box:nth-child(1){

animation-delay:.15s;

}

.status-box:nth-child(2){

animation-delay:.3s;

}

.board-box:nth-child(1){

animation-delay:.45s;

}

.board-box:nth-child(2){

animation-delay:.6s;

}

.board-box:nth-child(3){

animation-delay:.75s;

}

@keyframes showUp{

to{

opacity:1;

transform:translateY(0);

}

}



/*==================================================
FOOTER
==================================================*/

.footer{

position:relative;

overflow:hidden;

}

.footer::before{

content:"";

position:absolute;

left:-100%;

top:0;

width:100%;

height:1px;

background:linear-gradient(

90deg,

transparent,

#9f6cff,

transparent

);

animation:footerLight 6s linear infinite;

}

@keyframes footerLight{

100%{

left:100%;

}

}



/*==================================================
RESPONSIVE (PC MIN)
==================================================*/

@media(max-width:1400px){

.container{

width:1200px;

}

.bannerSwiper{

height:390px;

}

.bannerSwiper img{

height:390px;

}

}

@media(max-width:1280px){

.container{

width:1140px;

}

.main-menu a{

font-size:14px;

}

.play-button{

font-size:22px;

}

}



/*==================================================
END
==================================================*/

.status-list{

    height:340px;

    

}

.status-row{

    height:36px;

    transition:.45s;

}

.status-row.new{

    animation:newRow .8s;

}

@keyframes newRow{

0%{

background:#ffd84d;
color:#000;

}

100%{

background:#171f36;

}

}



/*================================
PAGE
================================*/


.page-content{

    margin-top:35px;
    
    }
    
    
    
    .page-title{
    
    height:60px;
    
    display:flex;
    
    align-items:center;
    
    padding-left:25px;
    
    font-size:25px;
    
    font-weight:700;
    
    
    background:
    
    linear-gradient(
    90deg,
    #6d39ff,
    #101729
    );
    
    
    border:1px solid var(--border);
    
    }
    
    
    
    
    
    .notice-table{
    
    
    width:100%;
    
    margin-top:20px;
    
    border-collapse:collapse;
    
    
    background:#101728;
    
    border:1px solid var(--border);
    
    
    }
    
    
    
    .notice-table th{
    
    
    height:55px;
    
    
    background:#161f36;
    
    
    color:#ffd84d;
    
    
    }
    
    
    
    .notice-table td{
    
    
    height:55px;
    
    text-align:center;
    
    border-bottom:1px solid rgba(255,255,255,.08);
    
    
    }
    
    
    
    .notice-table td:nth-child(2){
    
    text-align:left;
    
    padding-left:25px;
    
    }
    
    
    
    .notice-table a:hover{
    
    color:#ffd84d;
    
    }
    
    
    
    
    .pagination{
    
    
    display:flex;
    
    justify-content:center;
    
    gap:10px;
    
    margin-top:35px;
    
    
    }
    
    
    
    .pagination a{
    
    
    width:38px;
    
    height:38px;
    
    display:flex;
    
    justify-content:center;
    
    align-items:center;
    
    
    background:#151d32;
    
    
    border:1px solid var(--border);
    
    
    }
    
    
    
    .pagination .active{
    
    
    background:#713cff;
    
    }
    
    
    
    
    /* VIEW */
    
    
    .view-box{
    
    
    margin-top:20px;
    
    
    background:#101728;
    
    
    border:1px solid var(--border);
    
    
    }
    
    
    
    .view-box h1{
    
    
    padding:25px;
    
    font-size:24px;
    
    
    border-bottom:1px solid rgba(255,255,255,.1);
    
    
    }
    
    
    
    .view-info{
    
    
    padding:15px 25px;
    
    color:#9fa8c2;
    
    
    }
    
    
    
    .view-body{
    
    
    min-height:300px;
    
    padding:30px 25px;
    
    
    line-height:2;
    
    
    }
    
    
    
    
    
    .view-btn{
    
    
    padding:20px;
    
    
    text-align:center;
    
    
    }
    
    
    .view-btn a{
    
    
    display:inline-flex;
    
    width:120px;
    
    height:45px;
    
    
    justify-content:center;
    
    align-items:center;
    
    
    background:#713cff;
    
    
    }
    
    
    
    
    /* WRITE */
    
    
    .write-box{
    
    
    background:#101728;
    
    border:1px solid var(--border);
    
    padding:30px;
    
    
    }
    
    
    .write-box h1{
    
    
    margin-bottom:30px;
    
    
    }
    
    
    
    .write-item{
    
    
    margin-bottom:25px;
    
    
    }
    
    
    
    .write-item label{
    
    
    display:block;
    
    margin-bottom:10px;
    
    
    }
    
    
    
    .write-item input,
    .write-item textarea{
    
    
    width:100%;
    
    background:#171f35;
    
    border:1px solid #38405e;
    
    color:white;
    
    
    }
    
    
    
    .write-item input{
    
    
    height:50px;
    
    padding:0 15px;
    
    
    }
    
    
    
    .write-item textarea{
    
    
    height:350px;
    
    padding:15px;
    
    
    }
    
    
    
    .write-btn{
    
    
    width:180px;
    
    height:55px;
    
    
    background:
    
    linear-gradient(
    90deg,
    #6d39ff,
    #a35eff
    );
    
    
    color:white;
    
    font-size:18px;
    
    font-weight:bold;
    
    
    display:block;
    
    margin:auto;
    
    
    }