@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

@font-face{font-family:BreeSerif;src:url(../../assets/font/BreeSerif.otf)}



/* CSS Variables - Light Mode */

:root{--primary-color:#6366f1;--primary-dark:#4f46e5;--primary-light:#8b5cf6;--secondary-color:#10b981;--secondary-dark:#059669;--accent-color:#f59e0b;--accent-dark:#d97706;--background-primary:#ffffff;--background-secondary:#f8fafc;--background-card:#f1f5f9;--background-disabled:#eee;--background-glass:rgba(248,250,252,0.9);--text-primary:#1e293b;--text-secondary:#475569;--text-muted:#64748b;--border-color:#e2e8f0;--border-light:#cbd5e1;--shadow-sm:0 1px 2px 0 rgba(0,0,0,0.05);--shadow-md:0 4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05);--shadow-xl:0 20px 25px -5px rgba(0,0,0,0.1),0 10px 10px -5px rgba(0,0,0,0.04);--transition-fast:150ms cubic-bezier(0.4,0,0.2,1);--transition-medium:300ms cubic-bezier(0.4,0,0.2,1);--transition-slow:500ms cubic-bezier(0.4,0,0.2,1)}



/* Base Styles */

h1,h2,h3,h4{font-family:'BreeSerif',serif;color:var(--text-primary);font-weight:600}

*{margin:0;padding:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-smooth:always;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

body{width:100%;font-family:'Inter',sans-serif!important;color:var(--text-primary);background:url(/assets/img/bg.jpg);background-position:top center;background-repeat:no-repeat;line-height:1.6}

a,img{color:var(--primary-color);text-decoration:none;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium)}

a:hover{color:var(--primary-light);text-decoration:none;cursor:pointer}

input,textarea,select,option,div,button{font-family:'Inter',sans-serif;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium);border:0}

p{line-height:1.6;color:var(--text-secondary)}

.container{margin:0 auto;padding:0;width:1200px;position:relative;clear:both}

.label-message{display:none;margin:20px auto none;text-align:center}



/* Modern Navigation */

nav#menu{width:100%;height:auto;padding:0;background:rgba(255,255,255,0.01);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);text-align:center;position:sticky;top:0;z-index:90;box-shadow:0 4px 32px rgba(0,0,0,0.06);transition:all var(--transition-medium)}

nav#menu.scrolled{background:rgba(255,255,255,0.02);box-shadow:0 6px 40px rgba(0,0,0,0.12);backdrop-filter:blur(30px)}

nav#menu:after{display:none}

nav#menu:hover:after{display:none}

nav#menu ul{list-style:none;padding:0;margin:0;display:flex;justify-content:center;align-items:center;max-width:1200px;margin:0 auto;position:relative;width:100%}

nav#menu ul li{display:flex;position:relative}

nav#menu a{color:var(--text-primary);font-size:15px;font-weight:500;text-transform:none;display:flex;align-items:center;justify-content:center;letter-spacing:0.02em;transition:all var(--transition-medium);position:relative}

nav#menu a:hover{color:var(--primary-color);text-decoration:none}

nav#menu > ul > li:after{display:none}

nav#menu:hover > ul > li:after{display:none}

nav#menu > ul > li > a{text-align:center;padding:22px 35px;font-family:'BreeSerif',serif;color:#fff;font-size:18px;font-weight:600;border-radius:0;transition:all var(--transition-medium);position:relative;min-height:64px;display:flex;align-items:center;justify-content:center;overflow:hidden}

nav#menu > ul > li > a:before{content:'';position:absolute;bottom:0;left:50%;width:0;height:3px;background:linear-gradient(90deg,var(--primary-color),var(--primary-light));transform:translateX(-50%);transition:all var(--transition-medium);border-radius:2px 2px 0 0;box-shadow:0 0 8px rgba(99,102,241,0.3)}

nav#menu > ul > li > a:after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(99,102,241,0.05),rgba(139,92,246,0.05));opacity:0;transition:opacity var(--transition-medium)}

nav#menu > ul > li > a:hover{background:rgba(99,102,241,0.08);color:#fff;text-shadow:2px 2px 3px rgba(0, 0, 0, 0.5), 0 0 10px #fff;transform:translateY(-2px);box-shadow:0 8px 25px rgba(99,102,241,0.15)}

nav#menu > ul > li > a:hover:before{width:90%}

nav#menu > ul > li > a:hover:after{opacity:1}

nav#menu > ul > li > a.active{color:var(--primary-color);background:rgba(99,102,241,0.1)}

nav#menu > ul > li > a.active:before{width:100%;height:4px;box-shadow:0 0 12px rgba(99,102,241,0.5)}

nav#menu > ul > li > ul{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(-10px);width:260px;overflow:hidden;max-height:0;opacity:0;visibility:hidden;transition:all var(--transition-medium);background:var(--background-primary);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.12);border:1px solid var(--border-color);margin-top:8px;backdrop-filter:blur(10px)}

nav#menu > ul > li > ul:before{content:'';position:absolute;top:-6px;left:50%;transform:translateX(-50%);width:12px;height:12px;background:var(--background-primary);border:1px solid var(--border-color);border-bottom:none;border-right:none;transform:translateX(-50%) rotate(45deg);z-index:-1}

nav#menu > ul > li:hover > ul{padding:20px 0;max-height:400px;opacity:1;visibility:visible;transform:translateX(-50%) translateY(0px)}

nav#menu > ul > li > ul > li{transform:translateY(10px);opacity:0;transition:all var(--transition-medium)}

nav#menu > ul > li:hover > ul > li{transform:translateY(0);opacity:1}

nav#menu > ul > li:hover > ul > li:nth-child(1){transition-delay:50ms}

nav#menu > ul > li:hover > ul > li:nth-child(2){transition-delay:100ms}

nav#menu > ul > li:hover > ul > li:nth-child(3){transition-delay:150ms}

nav#menu > ul > li:hover > ul > li:nth-child(4){transition-delay:200ms}

nav#menu > ul > li > ul > li > a{padding:14px 24px;font-weight:400;font-size:14px;border-radius:8px;color:var(--text-secondary);min-height:auto;transition:all var(--transition-fast);position:relative;margin:0 8px;overflow:hidden}

nav#menu > ul > li > ul > li > a:before{content:'';position:absolute;left:0;top:0;width:3px;height:100%;background:linear-gradient(to bottom,var(--primary-color),var(--primary-light));transform:scaleY(0);transition:transform var(--transition-fast);transform-origin:bottom}

nav#menu > ul > li > ul > li > a:hover{background:rgba(99,102,241,0.08);color:var(--primary-color);padding-left:28px;transform:none;box-shadow:0 4px 12px rgba(99,102,241,0.1)}

nav#menu > ul > li > ul > li > a:hover:before{transform:scaleY(1)}



/* Header */

header{height:350px}

header .logo{text-align:center;padding:0}

header .logo img{width:350px;margin-top:60px}

header.small{height:auto}

header.small .logo{padding:40px 0}

header.small .logo img{max-height:135px}



/* Main Layout */

main{display:inline-block;width:100%}

aside{float:left;width:310px}



/* Enhanced Widgets */

aside .widget,.card{border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);backdrop-filter:blur(10px);position:relative;margin:0 0 20px;box-shadow:var(--shadow-lg);transition:all var(--transition-medium);overflow:hidden}

aside .widget:hover,.card:hover{box-shadow:var(--shadow-xl);border-color:var(--primary-color)}

aside .widget h3,.card--title{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));text-align:center;font-size:15px;font-weight:700;color:white;padding:12px;text-transform:uppercase;letter-spacing:0.05em}

aside .widget .inner,.card--inner{padding:14px;background:var(--background-card)}

aside .widget ul{list-style:none;margin:0;padding:0}

.card--inner{line-height:1.5}

.card--inner p{padding:5px 0}



/* Enhanced Login Form */

aside #login{border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);backdrop-filter:blur(10px);padding:10px;padding-top:45px;position:relative;margin:0 0 20px;box-shadow:var(--shadow-lg);transition:all var(--transition-medium)}

aside #login:hover{box-shadow:var(--shadow-xl);border-color:var(--primary-color)}

aside #login:before{content:'';position:absolute;background:url(/assets/img/renders/login.png) no-repeat center;background-size:contain;width:211px;height:228px;bottom:85%;bottom:calc(100% - 25px);left:25px;filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));display:block}

aside #login:after{content:'';position:absolute;background:url(/assets/img/renders/login2.png) no-repeat center;background-size:contain;width:41px;height:18px;top:25px;left:121px;display:block}

aside #login form{padding:10px 0}

aside #login input{background:var(--background-secondary);border:1px solid var(--border-color);color:var(--text-primary);width:100%;height:40px;border-radius:8px;margin:0 0 6px;float:left;outline:0;padding:0 10px;box-shadow:var(--shadow-sm);transition:all var(--transition-medium)}

aside #login input:focus{box-shadow:0 0 0 3px rgba(99,102,241,0.1);border-color:var(--primary-color);background:var(--background-primary)}

aside #login button{font-family:'BreeSerif',serif}

aside #login button.login{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border:none;border-radius:8px;width:72px;height:86px;color:#fff;margin:0 0 0 6px;font-size:14px;font-weight:700;text-align:center;text-transform:uppercase;letter-spacing:-.02em;cursor:pointer;box-shadow:var(--shadow-md);transition:all var(--transition-medium)}

aside #login button.login:hover{text-shadow:0 0 10px #fff;box-shadow:var(--shadow-xl);background:linear-gradient(135deg,var(--accent-dark),var(--accent-color))}

aside #login button.login:before{content:'';background:url(/assets/img/renders/signin.png) no-repeat center;background-size:contain;width:43px;height:42px;display:inline-block;vertical-align:top;margin-bottom:5px}

aside #login ::-webkit-input-placeholder{color:var(--text-muted)}

aside #login ::-moz-placeholder{color:var(--text-muted)}

aside #login :-ms-input-placeholder{color:var(--text-muted)}

aside #login :-moz-placeholder{color:var(--text-muted)}

aside #login .account{float:left;max-width:70%;line-height:1;overflow:hidden}

aside #login .account p{color:var(--text-secondary);font-family:'BreeSerif',serif;display:flex;line-height:1.2;flex-direction:column;align-items:flex-start;justify-content:flex-end}

aside #login .account .text{font-size:1em;color:var(--text-muted)}

aside #login .account .user{font-size:1.5em;margin-top:5px;word-wrap:break-word;word-break:break-word;color:var(--primary-color);font-weight:600}



/*TEST 666*/

.container.client-container {

    position: relative; /* cần để định vị con absolute */

}



.login666-image {

    position: absolute;

    top: -225px;

    left: 50%;

    transform: translateX(-10%) scale(3);

    opacity: 100%;

    

    width: 200px;

    height: 220px;

    background: url(/assets/img/renders/logo2025.png) no-repeat center;

    background-size: contain;



    pointer-events: none;

    z-index: 20;

}



.login667-image {

    position: absolute;

    top: -185px;

    left: 50%;

    transform: translateX(235%) scale(0.8); 

    opacity: 0%;

    

    width: 200px;

    height: 230px;

    background: url(/assets/img/renders/logo.png) no-repeat center;

    background-size: contain;



    pointer-events: none;

    z-index: 20;

}



.login668-image {

    position: absolute;

    top: -150px;

    left: 50%;

    transform: translateX(-115%) scale(3); 

    opacity: 0%;


    

    width: 200px;

    height: 230px;

    background: url(/assets/img/renders/27.png) no-repeat center;

    background-size: contain;



    pointer-events: none;

    z-index: 20;

}



.login669-image {

    position: absolute;

    top: -235px;

    left: 50%;

    transform: translateX(25%) scale(2); 

    opacity: 0%;


    

    width: 200px;

    height: 230px;

    background: url(/assets/img/renders/28.png) no-repeat center;

    background-size: contain;



    pointer-events: none;

    z-index: 20;

}

/* Enhanced Functional Buttons */

.button-functional{margin:4px 0;display:flex;flex-wrap:wrap;justify-content:space-between}

.button-functional .item{flex:1;font-family:'BreeSerif',serif;font-size:15px;padding:15px 10px;font-weight:500;color:#fff;border-radius:8px;border:none;display:inline-flex;flex:0 0 calc(50% - 3px);vertical-align:top;cursor:pointer;justify-content:space-evenly;align-items:center;transition:all var(--transition-medium);box-shadow:var(--shadow-md);text-decoration:none}

.button-functional.acc .item{width:135.5px}

.button-functional .item:hover{filter:brightness(120%);box-shadow:var(--shadow-lg)}

.button-functional .item.orange{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark))}

.button-functional .item.green{background:linear-gradient(175deg,var(--secondary-color),var(--secondary-dark))}

.button-functional .item.blue{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark))}

.button-functional .item.darkgray{background:linear-gradient(135deg,#374151,#1f2937)}



/* Account Page Buttons */

.button-functional-account{margin:-2.5px;height:100%;display:flex;flex-wrap:wrap}

.button-functional-account .item{width:22%;font-size:15px;padding:12px 10px 10px;font-weight:400;color:#fff;border-radius:8px;border:none;display:inline-flex;vertical-align:top;cursor:pointer;margin:5px 2.5px;justify-content:center;align-items:center;align-items:flex-start;font-family:'BreeSerif',serif;transition:all var(--transition-medium);box-shadow:var(--shadow-md);text-decoration:none}

.button-functional-account .item:hover{filter:brightness(110%);box-shadow:var(--shadow-lg)}

.button-functional-account .item img{margin:0 10px}

.button-functional-account .item.green{background:linear-gradient(135deg,#f56200,#fa5300)}

.button-functional-account .item.gray{background:linear-gradient(135deg,#6c757d,#5a6268)}

.button-functional-account .item.blue{background:linear-gradient(135deg,var(--primary-color),var(--primary-dark))}

.button-functional-account .item.red{background:linear-gradient(135deg,#ef4444,#dc2626)}

.button-functional-account .item.darkgray{background:linear-gradient(135deg,#374151,#225197)}

.button-functional-account .item.steelblue{background:linear-gradient(135deg,#0ea5e9,#0284c7)}

.button-functional-account .item.vividcyan{background:linear-gradient(135deg,#06b6d4,#0891b2)}

.button-functional-account .item.emeraldgreen{background:linear-gradient(135deg,var(--secondary-color),var(--secondary-dark))}



/* Enhanced Footer Styling */

aside #login .footer{width:110%;width:calc(100% + 28px);margin:10px -14px 0;font-size:14px;display:inline-block;vertical-align:top;padding:12px 15px 0;border-top:1px solid var(--border-color)}

aside #login .footer .left{float:left;color:var(--text-muted);font-weight:400}

aside #login .footer .right{float:right;font-weight:700;color:var(--accent-color)}



/* Enhanced Search */

aside .search{position:relative;width:100%;margin:0 0 15px}

aside .search input{width:100%;height:50px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:25px;font-size:14px;padding:0 50px 2px 20px;outline:0;box-shadow:var(--shadow-sm);color:var(--text-primary);transition:all var(--transition-medium)}

aside .search input:focus{box-shadow:0 0 0 3px rgba(99,102,241,0.1);border-color:var(--primary-color);background:var(--background-primary)}

aside .search button{width:50px;height:50px;background:var(--primary-color);background-image:url(/assets/img/icons.png);background-position:-129px 16px;background-repeat:no-repeat;position:absolute;top:0;right:0;cursor:pointer;border-radius:50%;border:none;transition:all var(--transition-medium)}

aside .search button:hover{background-color:var(--primary-dark);transform:scale(1.05)}



section .search{position:relative;width:50%;margin:0 0 15px}

section .search input{width:100%;height:50px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:25px;font-size:14px;padding:0 50px 2px 20px;outline:0;box-shadow:var(--shadow-sm);color:var(--text-primary);transition:all var(--transition-medium)}

section .search input:focus{box-shadow:0 0 0 3px rgba(99,102,241,0.1);border-color:var(--primary-color);background:var(--background-primary)}

section .search button{width:50px;height:50px;background:var(--primary-color);background-image:url(/assets/img/icons.png);background-position:-129px 16px;background-repeat:no-repeat;position:absolute;top:0;right:0;cursor:pointer;border-radius:50%;border:none;transition:all var(--transition-medium)}

section .search button:hover{background-color:var(--primary-dark);transform:scale(1.05)}



/* Enhanced List Tags */

main .listtag{width:100%;list-style:none;margin:0;padding:0}

main .listtag li{display:inline-block;vertical-align:top;width:100%;height:40px;font-size:14px;line-height:40px;background:var(--background-secondary);color:var(--text-primary);margin:0 0 4px;border-radius:8px;transition:all var(--transition-medium)}

main .listtag li:hover{background:var(--background-primary)}

main .listtag li a{display:inline-block;background:transparent;width:100%;height:100%;color:var(--text-primary);padding:0 12px;display:flex;align-items:center}

main .listtag li .tag{width:34px;max-width:32px;height:32px;background:var(--primary-color);display:inline-flex;vertical-align:top;margin:0 12px 0 0;text-align:center;font-size:10px;text-transform:uppercase;color:#fff;letter-spacing:-.02em;position:relative;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium);border-radius:6px;align-items:center;justify-content:center;font-weight:600}

main .listtag li .tag:after{display:none}

main .listtag li .tag.green,main .listtag li .tag.green:after{background:var(--secondary-color)}

main .listtag li .tag.red,main .listtag li .tag.red:after{background:#983030}

main .listtag li .tag.grey,main .listtag li .tag.grey:after{background:#545454}

main .listtag li .tag.orange,main .listtag li .tag.orange:after{background:var(--accent-color)}

main .listtag li .tag.emerald,main .listtag li .tag.emerald:after{background:#857037}

main .listtag li .tag.platinum,main .listtag li .tag.platinum:after{background:#c38e00}

main .listtag li .tag.gold,main .listtag li .tag.gold:after{background:var(--accent-color)}

main .listtag li .tag.bronze,main .listtag li .tag.bronze:after{background:#b7a46f}

main .listtag li .tag.iron,main .listtag li .tag.iron:after{background:#c3bba4}

main .listtag li a:hover{color:var(--primary-color)}

main .listtag li a:hover .tag{max-width:36px;transform:scale(1.1)}

main .listtag li .tag.big{width:66px;max-width:62px;height:32px;line-height:32px;margin:4px 10px 4px 4px}

main .listtag li a:hover .tag.big{max-width:66px}

main .listtag.small li{height:35px;line-height:35px;color:var(--text-muted)}

main .listtag.small li .tag{width:26px;max-width:22px;height:20px;line-height:20px;margin:8px 5px 5px 5px}

main .listtag li.gold{color:var(--accent-color)}

main .listtag li.plate{color:#64748b}

main .listtag li.bronze{color:#a3a3a3}

main .listtag li.head{background:transparent;font-size:14px;color:var(--text-muted);font-weight:700;margin:0;text-transform:uppercase}

main .listtag li.head .tag{background:transparent}

main .listtag li .right{float:right;padding:0 8px;margin-left:auto}

main .listtag .icon-trophy{width:13px;height:20px;display:inline-block;background-image:url(/assets/img/icons.png);background-repeat:no-repeat;background-position:-204px 2px}

main .listtag.inline li{width:auto;min-width:260px;margin:0 10px 10px 0}

main .listtag.inline li a{padding-right:15px}



/* Enhanced Filter */

aside .filter{font-size:0;margin:0 0 6px}

aside .filter select{width:50%;height:40px;display:inline-block;border:1px solid var(--border-color);padding:0 12px;font-size:13px;color:var(--text-primary);outline:0;background:var(--background-secondary);background-image:url(/assets/img/select.png);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:all var(--transition-medium)}

aside .filter select:first-child{border-radius:20px 0 0 20px}

aside .filter select:last-child{border-radius:0 20px 20px 0}

aside .filter select:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(99,102,241,0.1)}



/* Main Section */

main section{width:870px;float:right}



/* Enhanced Main Boxes */

main .box{width:100%;border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);backdrop-filter:blur(10px);position:relative;margin:0 0 30px;box-shadow:var(--shadow-lg);display:inline-block;vertical-align:top;transition:all var(--transition-medium)}

main .box:hover{box-shadow:var(--shadow-xl);border-color:var(--primary-color)}

main .box.mid{max-width:570px}

main section .box.guia{margin-top:36px;overflow:visible}

main section .box.guia > .title-new{font-size:18px;color:var(--primary-color);font-weight:700;text-transform:uppercase;display:inline-block;vertical-align:top;margin:-50px 0 0 15px;background:var(--background-card);padding:15px 20px 15px 90px;border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--shadow-md);position:relative;overflow:visible}

main section .box.guia > .title-new:before{content:'';width:70px;height:65px;background-image:url(/assets/img/renders/02.png);background-repeat:no-repeat;background-position:center;background-size:cover;display:block;position:absolute;top:50%;left:10px;transform:translateY(-50%);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));z-index:1}

main section .box.guia > .title-new span{position:relative;z-index:2}

main section .box .biglist{padding:15px 30px 20px;margin:0;list-style:none}

main section .box .biglist li{display:inline-block;width:100%;background:var(--background-secondary);border-radius:12px;margin:0 0 20px;padding:0 40px 0 0;border:1px solid var(--border-color);transition:all var(--transition-medium)}

main section .box .biglist li:hover{background:var(--background-primary);box-shadow:var(--shadow-md)}

main section .box .biglist li i[class*="icon"]{width:100px;height:100px;background:#f28a1a;background-image:url(/assets/img/icons.png);background-repeat:no-repeat;float:left;border-radius:50%;margin:0 16px 0 0}

main section .box .biglist li i.icon-controls{background-position:0 -34px}

main section .box .biglist li i.icon-fight-lab{background-position:-100px -30px}

main section .box .biglist li i.icon-school{background-position:-200px -32px}

main section .box .biglist li i.icon-consortia{background-position:-300px -34px}

main section .box .biglist li strong{font-size:15px;color:var(--accent-color);font-weight:700;text-transform:uppercase;margin:17px 0 5px;display:inline-block}

main section .box .biglist li p{font-size:16px;color:var(--text-secondary);line-height:140%}

main section .box .biglist .recharge-left,main section .box .biglist .recharge-right{width:50%;float:left;padding:0 15px;box-sizing:border-box}

main section .box.itens{margin-top:36px;overflow:visible}

main section .box.itens > .title-new{font-size:18px;color:var(--secondary-color);font-weight:700;text-transform:uppercase;display:inline-block;vertical-align:top;margin:-50px 0 0 15px;background:var(--background-card);padding:12px 20px 12px 75px;border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--shadow-md);position:relative;overflow:visible}

main section .box.itens > .title-new:before{content:'';width:60px;height:62px;background-image:url(/assets/img/renders/03.png);background-repeat:no-repeat;background-position:center;background-size:cover;display:block;position:absolute;top:50%;left:8px;transform:translateY(-50%);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));z-index:1}

main section .box.itens > .title-new span{position:relative;z-index:2}

main section .box.register{margin-top:36px;overflow:visible}

main section .box.register > .title-new{font-size:18px;color:var(--secondary-color);font-weight:700;text-transform:uppercase;display:inline-block;vertical-align:top;margin:-37px 0 0 15px;background:var(--background-card);padding:12px 20px 12px 70px;border-radius:12px;border:1px solid var(--border-color);box-shadow:var(--shadow-md);position:relative;overflow:visible}

main section .box.register > .title-new:before{content:'';width:60px;height:62px;background-image:url(/assets/img/renders/05.gif);background-repeat:no-repeat;background-position:center;background-size:cover;display:block;position:absolute;top:50%;left:8px;transform:translateY(-50%);filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3));z-index:1}

main section .box.register > .title-new span{position:relative;z-index:2}



/* Enhanced Item List */

main .listsquare{width:100%;list-style:none;padding:0;margin:0;font-size:0;vertical-align:top;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));padding:20px}

main .listsquare li{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:8px;padding:10px;margin:0 10px 10px 0;text-align:center;transition:all var(--transition-medium);aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center}

main .listsquare li:hover{background:var(--background-primary);border-color:var(--primary-color);transform:translateY(-4px);box-shadow:var(--shadow-md)}

main .listsquare li img{vertical-align:top;max-height:68px;margin:5px;max-width:100%;object-fit:contain}

main .listsquare li span{width:100%;font-size:12px;color:var(--accent-color);display:inline-block;vertical-align:top;margin:2px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}



/* Enhanced Slide Home */

main #slideHome{width:620px;height:260px;border:1px solid var(--border-color);background:var(--background-secondary);box-shadow:var(--shadow-lg);border-radius:12px;overflow:hidden;float:left;margin:0 0 40px}

main #slideHomeAnchor{width:250px;float:right;margin:0 0 40px}

main #slideHomeAnchor .item{width:100%;height:48px;font-size:12px;text-transform:uppercase;line-height:48px;margin:0 0 5px;border-radius:8px;overflow:hidden;transition:all var(--transition-medium)}

main #slideHomeAnchor .item:last-child{margin:0}

main #slideHomeAnchor .item a{display:inline-block;color:var(--text-muted);width:100%;height:100%;padding:0 16px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:8px;transition:all var(--transition-medium)}

main #slideHomeAnchor .item.active a,main #slideHomeAnchor .item a:hover{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));color:#fff;transform:translateX(4px);box-shadow:var(--shadow-md)}



/* Enhanced News Tabs */

.newsTabsAnchor{width:100%;height:45px;background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border-radius:12px 12px 0 0;padding:6px;box-shadow:var(--shadow-md)}

.newsTabsAnchor a{color:#FFF;padding:0 15px;line-height:33px;font-size:13px;font-weight:600;display:inline-block;position:relative;border-radius:8px;flex:1;text-align:center;text-decoration:none;cursor:pointer}

.newsTabsAnchor a:hover{background:rgba(255,255,255,0.1);color:#FFF;text-decoration:none}

.newsTabsAnchor a.active{background:#fff;color:var(--accent-color);font-weight:700;box-shadow:var(--shadow-sm)}

.newsTabsAnchor a:after{display:none}



/* Enhanced Item Tabs */

.itemTabsAnchor{background:transparent;float:right;width:auto;margin:-32px 0 0;text-transform:none;font-family:'BreeSerif',serif;display:flex;position:relative;z-index:5}

.itemTabsAnchor a{background:transparent;color:#f5f5f5;padding:8px 12px;line-height:15px;font-size:15px;font-weight:400;border-right:1px solid var(--border-color);display:inline-block;position:relative;text-decoration:none;cursor:pointer;outline:none}

.itemTabsAnchor a:last-child{border-right:0}

.itemTabsAnchor a:hover{color:#fff;text-decoration:none}

.itemTabsAnchor a.active{color:#fff;font-weight:500}

.itemTabsAnchor a.active:after{content:'';width:0;height:0;background:transparent;border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--primary-color);left:50%;transform:translateX(-50%);bottom:-9px;position:absolute;display:block}



/* Enhanced Tabs Content */

main section .tabsContent > div{width:100%;padding:20px 15px 0;display:none;vertical-align:top}

main section .tabsContent > div.active{display:inline-block}

main section .tabsContent a.seeall{width:105.6%;width:calc(100% + 30px);margin:15px -15px 0;color:var(--text-muted);font-size:13px;display:inline-block;padding:12px;text-align:center;border-top:1px solid var(--border-color);transition:all var(--transition-medium)}

main section .tabsContent a.seeall:hover{background:var(--background-secondary);color:var(--primary-color)}

main section .cards{float:right;width:280px;text-align:right}

main section .cards a{display:inline-block;vertical-align:top;width:100%;margin:-5px 0 10px;border-radius:8px;overflow:hidden;transition:all var(--transition-medium)}

main section .cards a:hover img{-webkit-filter:brightness(120%);filter:brightness(120%)}



/* Enhanced Footer */

footer{width:100%;height:auto;text-align:center;position:relative}

footer.servers{background:transparent;height:auto}

footer .text{font-size:20px;font-weight:700;color:var(--primary-color);margin:40px 0;display:inline-block;width:100%;text-align:center;font-family:'BreeSerif',serif;text-shadow:#fff 0 0 30px,#fff 0 0 10px,#fff 0 0 10px,#fff 0 0 10px,#fff 0 0 1px,#fff 0 0 1px}

footer.servers .text{color:var(--text-primary);margin:50px 0;font-size:16px}

footer .bottom{width:100%;height:40px;line-height:40px;font-size:12px;color:var(--text-muted);position:absolute;bottom:0;left:0;background:var(--background-secondary)}

footer .bottom a{color:var(--text-muted)}

footer .bottom a:hover{color:var(--primary-color)}

footer .bottom ul{list-style:none;margin:0;padding:0}

footer .bottom ul li{display:inline-block;margin:0}

footer .bottom ul li:after{content:'|';margin:0 8px;display:inline-block}

footer .bottom ul li:last-child:after{display:none}

footer .bottom .left{float:left}

footer .bottom .right{float:right}



/* Enhanced Banner */

main .banner{border:1px solid var(--border-color);background:var(--background-secondary);box-shadow:var(--shadow-lg);border-radius:12px;overflow:hidden;float:left;margin:0 0 30px}

main .banner img{vertical-align:top}



/* Enhanced Box Single */

main .box.single{padding:30px;background-color:var(--background-card);word-break:break-word}

main .box.list.pay{padding:30px}

main .box.single .share{width:60px;float:left;padding:0 30px 0 0}

main .box.single .date{width:100%;text-align:center;color:var(--text-muted);line-height:10px;padding:5px 0 20px}

main .box.single .date .d{font-size:18px;font-weight:800}

main .box.single .date .m{font-size:12px;text-transform:uppercase;margin:6px 0 0;display:inline-block}

main .box.single .date .y{font-size:10px}

main .box.single .share a{width:30px;height:30px;border-radius:3px;display:inline-block;vertical-align:top;margin:0 0 5px;background-color:#000;background-image:url(/assets/img/icons.png);background-repeat:no-repeat}

main .box.single .share a[href*="facebook"]{background-color:#3b5998;background-position:-269px 9px}

main .box.single .share a[href*="whatsapp"]{background-color:#0dc342;background-position:-306px 10px}

main .box.single .share a[href*="twitter"]{background-color:#20a2f2;background-position:-342px 10px}

main .box.single .share a[href*="pinterest"]{background-color:#be0f23;background-position:-379px 10px}

main .box.single .share a:hover{-webkit-filter:brightness(120%);filter:brightness(120%)}

main .box.single .content{float:left;width:calc(100% - 60px);border-left:1px solid var(--border-color);padding:0 0 0 30px}

main .box.single .content .title{font-size:16px;font-weight:900;color:var(--accent-color);text-transform:uppercase;margin:0 0 20px}

main .box.single .content p,main .box.single .content ul{color:var(--text-secondary);font-size:15px;margin:0 0 15px;list-style:none;line-height:150%}



/* Enhanced Box List */

main .box.list ul{list-style:none;margin:0;padding:0}

main .box.list ul li{border-bottom:1px solid var(--border-color)}

main .box.list ul li.title{color:#fff;background:var(--accent-color);padding:15px 24px;font-size:18px;text-transform:uppercase}

main .box.list ul li a{width:100%;display:inline-block;padding:15px 24px}

main .box.list ul li a span{color:var(--text-muted);margin:0 30px 0 0}

main .box.list ul li a:hover{background:var(--background-secondary)}

main .box.list ul li:last-child{border-bottom:0}

#master-qr-info{display:none}

main .box.list.pagenavi ul li{width:auto;border-right:1px solid var(--border-color);border-bottom:0;display:inline-block}

main .box.list.pagenavi ul li a{height:50px;line-height:50px;vertical-align:top;padding:0 20px}

main .box.list.pagenavi ul li a.small{font-size:13px}

main .box.servers{width:100%;min-height:520px;padding:10px 20px;border:1px solid var(--border-color)}

main .box.servers aside #login{background:transparent;border:0;box-shadow:none}

main .box.servers aside #login .footer{width:100%;margin:10px 0 0;padding:10px 0}

main .box.servers .content{max-width:calc(100% - 300px);float:left;padding:10px 0 0 15px}

main .box.servers .content .title{font-size:16px;font-weight:900;color:var(--primary-color);text-transform:uppercase;margin:0 0 15px}

main .box.servers .listtag{margin-bottom:45px}



/* Enhanced Top Button */

#toTop{position:fixed;bottom:15px;right:15px;background:var(--background-card);width:35px;height:35px;z-index:9090;border-radius:50%;text-align:center;cursor:pointer;transform:translateY(200%);-o-transform:translateY(200%);-ms-transform:translateY(200%);-moz-transform:translateY(200%);-webkit-transform:translateY(200%);-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium);box-shadow:var(--shadow-lg);border:1px solid var(--border-color)}

#toTop.show{transform:translateY(0%);-o-transform:translateY(0%);-ms-transform:translateY(0%);-moz-transform:translateY(0%);-webkit-transform:translateY(0%)}

#toTop:hover{background:var(--primary-color)}

#toTop:before{content:'';width:7px;height:7px;border-right:5px solid var(--text-primary);border-top:5px solid var(--text-primary);display:inline-block;margin:14px 0 0;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);position:relative}



/* Enhanced Render Elements */

.render01{width:91px;height:84px;background-image:url(/assets/img/renders/01.png);background-repeat:no-repeat;background-position:center;position:absolute;top:-16px;right:-26px}

.render02{width:319px;height:228px;background-image:url(/assets/img/renders/04.png);background-repeat:no-repeat;background-position:center;position:absolute;top:-165px;right:-100px}

.render03{width:200px;height:208px;background-image:url(/assets/img/renders/05.png);background-repeat:no-repeat;background-position:center;position:absolute;bottom:-15px;left:-65px}



/* Enhanced Modal */

div.modal{width:100%;height:100%;background:rgba(0,0,0,0.6);position:fixed;top:0;left:0;z-index:99999;-webkit-transform:scale(0);-moz-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium)}

div.modal.open{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);-webkit-filter:opacity(100%);filter:opacity(100%);visibility:visible}

div.modal .content{position:absolute;top:50%;left:50%;width:500px;max-height:80vh;height:auto;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:20}

div.modal .content .title{width:100%;text-align:center;font-size:20px;font-weight:900;color:var(--text-primary);margin:0 0 4px}

div.modal .box{width:100%;border:1px solid var(--border-color);border-radius:15px;background:var(--background-card);position:relative;margin:0 0 30px;box-shadow:var(--shadow-xl);display:inline-block;vertical-align:top;padding:32px;text-align:center}

div.modal .box p{font-size:20px;color:var(--text-secondary);max-width:340px;margin:15px auto}

div.modal .box .button{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border:none;border-radius:80px;width:200px;height:58px;line-height:54px;color:#fff;margin:0 0 0 6px;font-size:16px;font-weight:900;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer;transition:all var(--transition-medium);box-shadow:var(--shadow-md)}

div.modal .box .button:hover{text-shadow:0 0 10px #fff;border-color:var(--border-color)}

div.modal .box .button .icon{background-image:url(/assets/img/renders/signin.png);background-position:center;background-repeat:no-repeat;background-size:contain;width:26px;height:26px;display:inline-block;vertical-align:middle;margin:-4px 5px 0 0}

div.modal .box .cancel{font-size:12px;color:var(--text-muted);text-transform:uppercase;margin:12px 0 0;display:inline-block}

div.modal > .close{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1}

div.modal > .close span{position:absolute;top:20px;right:36px;background:var(--accent-color);cursor:pointer;-webkit-filter:opacity(80%);filter:opacity(80%);-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium)}

div.modal > .close span:before,div.modal > .close span:after{content:'';width:5px;height:25px;background:#fff;position:absolute;top:0;left:0;border-radius:10px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);display:block}

div.modal > .close span:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);display:block}

div.modal > .close span:hover{-webkit-filter:opacity(100%);filter:opacity(100%)}



/* Enhanced Forms */

form.detail-account{width:100%;display:inline-block}

form.detail-account label{width:100%;display:inline-block;text-align:left;margin:0 0 14px;font-size:15px;font-weight:600;color:var(--text-primary)}

form.detail-account label span{display:inline-block}

form.detail-account input{width:100%;height:30px;background:var(--background-secondary);color:var(--text-primary);border:1px solid var(--border-color);border-radius:5px;padding:0 25px;box-shadow:var(--shadow-sm)}

form.detail-account .info{width:25%}

form.detail-account button{cursor:pointer;font-family:'BreeSerif',serif}

form.detail-account .button .icon{background-image:url(/assets/img/renders/signin.png);background-position:center;background-repeat:no-repeat;background-size:contain;width:20px;height:21px;display:inline-block;vertical-align:middle}

form.detail-account input:focus{outline:0}

form.detail-account ::-webkit-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.detail-account ::-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.detail-account :-ms-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.detail-account :-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.account{width:100%;display:inline-block}

form.account label{width:100%;display:inline-block;text-align:left;margin:0 0 14px;font-size:15px;font-weight:600;color:var(--text-primary)}

form.account label span{margin:0 0 5px;display:inline-block}

form.account input,form.account select{width:100%;height:40px;background:var(--background-primary);font-size:14px;color:var(--text-primary);border:1px solid var(--border-color);border-radius:5px;padding:0 10px;box-shadow:var(--shadow-sm)}

form.account input:disabled{background:var(--background-disabled)!important;border:1px solid #e5e5e5;cursor:not-allowed}

form.account input[type=number]::-webkit-outer-spin-button,form.account input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

form.account input[type=number]{-moz-appearance:textfield}

form.account .input-button-group{display:flex}

form.account .input-button-group input{flex:1}

form.account .input-button-group button{height:40px;font-size:14px;padding:0 15px;margin-left:5px;background:var(--primary-color);color:#fff;border-radius:5px;cursor:pointer;box-shadow:var(--shadow-sm)}

form.account .button{margin-bottom:20px;background:linear-gradient(to bottom,var(--accent-color) 0%,var(--accent-dark) 100%);border-radius:5px;width:150px;height:45px;line-height:47px;color:#fff;font-size:15px;font-weight:500;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer;font-family:'BreeSerif',serif}

form.account .button:hover{text-shadow:0 0 10px #fff;border-color:var(--border-color)}

form.account .button .icon{background-image:url(/assets/img/renders/signin.png);background-position:center;background-repeat:no-repeat;background-size:contain;width:20px;height:21px;display:inline-block;vertical-align:middle}

form.account input:focus{outline:0;box-shadow:0 0 0 1px rgba(99,102,241,0.3)}

form.account ::-webkit-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.account ::-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.account :-ms-input-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

form.account :-moz-placeholder{color:var(--text-muted);-webkit-filter:opacity(40%);filter:opacity(40%)}

.item-group{display:flex;align-items:baseline;justify-content:center}

.item-group a{flex:1;font-weight:500}

.item-group button{margin-right:20px}

div.modal .box .buttonsSocial .social{width:calc(50% - 5px);text-align:left}

div.modal .box .buttonsSocial .social .icon{width:50px}

div.modal .or{width:100%;color:var(--text-muted);font-size:12px;position:relative;margin:12px 0;display:inline-block}

div.modal .or:after{content:'';width:100%;height:1px;background:var(--border-color);position:absolute;top:50%;left:0;z-index:1;display:block}

div.modal .or span{background:var(--background-card);padding:0 10px;display:inline-block;position:relative;z-index:2}

.popup-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.7);z-index:1000;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}

.popup-overlay.active{display:block;opacity:1;visibility:visible}

.popup-content{background:#fff;padding:20px;width:500px;margin:100px auto;border-radius:8px;position:relative;box-shadow:0 4px 10px rgba(0,0,0,0.3);transform:translateY(-20px);transition:transform .3s ease}

.popup-overlay.active .popup-content{transform:translateY(0)}

.popup-content table{width:100%;border-collapse:separate;border-spacing:0;margin-top:15px;font-size:14px;background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,0.05)}

.popup-content th{padding:12px 16px;text-align:center;font-weight:600;font-size:15px;color:#fff;border-bottom:1px solid var(--border-color);background:var(--primary-color)}

.popup-content td{padding:12px 16px;text-align:center;color:#444;border-bottom:1px solid var(--border-color);border-right:1px solid var(--border-color);transition:background-color .2s ease}

.popup-content td:last-child{border-right:0}

.popup-content tbody tr:hover{background:var(--background-secondary)}

.popup-content b{font-weight:600}

.close-popup{position:absolute;top:10px;right:15px;font-size:20px;cursor:pointer;color:#333;transition:color .3s ease}

.close-popup:hover{color:#000}



/* Enhanced Check-in Table */

.checkin.table-responsive{overflow-x:auto;width:100%}

.checkin.table{width:100%;border-collapse:collapse;font-size:14px;background-color:var(--background-primary);box-shadow:var(--shadow-sm);border-radius:8px;overflow:hidden}

.checkin.table thead{background-color:var(--primary-light)}

.checkin.table thead th{padding:12px 16px;text-align:left;vertical-align:middle;font-weight:600;color:#fff;border-bottom:1px solid var(--border-color);background-color:var(--primary-light)}

.checkin.table tbody td{padding:7px 16px;vertical-align:middle;border-top:1px solid var(--border-light);color:var(--text-secondary)}

.checkin.table tbody tr:hover{background-color:var(--background-card);transition:background-color var(--transition-fast)}

.checkin.table td img{width:32px;height:32px;margin-right:10px;vertical-align:middle}

.checkin.table td span{vertical-align:middle;display:inline-block;color:var(--text-primary)}



/* Enhanced Content Tables */

.content table{margin:10px auto;border-collapse:collapse}

.content table tr:nth-child(odd){background:var(--background-secondary)}

.content table tr:nth-child(even){background:var(--background-card)}

.content table td,.content table th{border:1px solid var(--border-color);padding:3px 10px}

.content table th{color:#fff;font-weight:bolder;padding:5px 10px;background:var(--primary-color);text-align:center}



/* Enhanced Box Styles */

.box{width:100%;border:1px solid var(--border-color);border-radius:12px;background:var(--background-card);position:relative;margin:0 0 30px;box-shadow:var(--shadow-lg);display:inline-block;vertical-align:top}

.box.pay{width:100%;min-height:520px;padding:10px 20px;border:1px solid var(--border-color);margin-top:55px}

.box.pay .content{width:100%;float:right;padding:10px}

.box.pay .content .title{font-size:16px;font-weight:900;color:var(--primary-color);text-transform:uppercase;margin:0 0 12px}



/* Enhanced Loading */

#loading{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--background-glass);z-index:50;border-radius:8px;display:none}

#loading i{width:44px;height:44px;position:absolute;top:50%;left:50%;background-image:url(/assets/img/icons_pay.png);background-repeat:no-repeat;background-position:-299px -35px;animation:spinLoad 1.2s linear infinite;-o-animation:spinLoad 1.2s linear infinite;-ms-animation:spinLoad 1.2s linear infinite;-moz-animation:spinLoad 1.2s linear infinite;-webkit-animation:spinLoad 1.2s linear infinite}



/* Enhanced Payment Styles */

.stripe-metodos-img{width:145px;height:70px;background-size:contain;background-position:center;background-repeat:no-repeat;float:left;margin-left:.5em}

.selects{font-size:0;margin:0 0 25px}

.selects select{width:300px;max-width:100%;height:40px;display:inline-block;border:1px solid var(--border-color);padding:0 60px 0 22px;margin:0 10px 0 0;font-size:15px;color:var(--text-primary);outline:0;border-radius:5px;background:var(--background-secondary);background-image:url(/assets/img/select.png);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none}

.form-group{font-size:0;margin:0 0 25px}

.form-group .form-control{width:300px;max-width:100%;height:50px;display:inline-block;border:1px solid var(--border-color);padding:0 60px 0 22px;margin:5px 10px 0 0;font-size:15px;color:var(--text-primary);outline:0;border-radius:60px;background:var(--background-secondary);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none}

.form-group .captcha{width:180px;max-width:100%;height:50px;display:inline-block;border:1px solid var(--border-color);font-size:15px;color:var(--text-primary);outline:0;border-radius:60px;background:var(--background-secondary);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none;overflow:hidden}

.selects select[disabled]{-webkit-filter:opacity(40%);filter:opacity(40%);cursor:not-allowed}

.selects select option{color:var(--text-primary)}

.selects select option:disabled{color:var(--text-muted)}



/* Enhanced Tags */

.tags{display:inline-block;position:relative;font-size:0;margin:0 0 15px}

.tags a{min-width:140px;background:var(--background-secondary);border:1px solid var(--border-color);border-radius:10px;padding:10px 15px;display:inline-block;position:relative;margin:0 10px 10px 0;overflow:hidden}

.tags a img{vertical-align:top}

.tags a.selected{border-color:var(--accent-color)}

.tags a.selected:before{content:'';width:22px;height:22px;background-color:var(--accent-color);background-image:url(/assets/img/icons_pay.png);background-repeat:no-repeat;background-position:-249px -44px;background-size:contain;border-radius:100%;position:absolute;top:50%;left:8%;z-index:12;-webkit-transform:translatey(-50%);-moz-transform:translatey(-50%);-ms-transform:translatey(-50%);-o-transform:translatey(-50%);transform:translatey(-50%);display:block}

.tags a.selected:after{content:'';background-color:var(--accent-color);width:100%;height:100%;position:absolute;top:0;left:0;z-index:10;-webkit-filter:opacity(15%);filter:opacity(15%)}

.tags a .value{background:var(--text-muted);font-size:16px;font-weight:700;line-height:30px;color:#fff;width:100%;display:inline-block;border-radius:200px 200px 0 0;margin:-1px 0 0;text-align:center}

.tags a.selected .value{background-color:var(--accent-color)}

.tags a .qnt{font-size:18px;font-weight:700;line-height:14px;color:var(--text-primary);text-align:center;padding:10px 0 8px}

.tags a .qnt span{font-size:13px;font-weight:400;width:100%;display:inline-block}

.tags a.selected .qnt{color:var(--accent-color)}



/* Enhanced Buttons */

.button button{background:linear-gradient(135deg,var(--accent-color),var(--accent-dark));border:none;border-radius:80px;width:200px;height:58px;line-height:54px;color:#fff;margin:-5px 0 20px;font-size:16px;font-weight:900;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer}

.button button:hover{text-shadow:0 0 10px #fff;border-color:var(--border-color)}

.button{border-radius:80px;width:200px;height:40px;color:#fff;font-size:16px;font-weight:900;text-align:center;text-transform:uppercase;display:inline-block;letter-spacing:-.01em;cursor:pointer}



/* Enhanced Alerts */

.alert{width:100%;padding:14px 16px 16px;background:var(--background-card);color:var(--text-primary);display:inline-block;margin:10px 0}

.alert.alert-error{background:var(--accent-color);border-radius:5px}



/* Enhanced Utility Classes */

.bold{font-weight:700}

.w-50{width:50%}

.w-100{width:100%}

.blocker{z-index:9999!important}

.f-left{float:left}

.f-right{float:right}

.pb-10{padding-bottom:10px}

.pt-10{padding-top:10px}

.text-center{text-align:center}

.text-right{text-align:right}

.d-select-stripe{display:flex}

.stripe-metodo-selected{border:2px solid var(--accent-color)}

.stripe-metodo-selected:before{content:'';width:22px;height:22px;background-color:var(--accent-color);background-image:url(/assets/img/icons_pay.png);background-repeat:no-repeat;background-position:-249px -44px;background-size:contain;border-radius:100%;position:absolute;top:52%;left:159px;z-index:12;-webkit-transform:translatey(-50%);-moz-transform:translatey(-50%);-ms-transform:translatey(-50%);-o-transform:translatey(-50%);transform:translatey(-50%);display:block}

.select{width:347px;max-width:100%;height:50px;display:inline-block;border:1px solid var(--border-color);padding:0 60px 0 22px;margin:0 10px 0 0;font-size:15px;color:var(--text-primary);outline:0;border-radius:60px;background:var(--background-secondary);background-image:url(/assets/img/select.png);background-repeat:no-repeat;background-position:center right;-webkit-appearance:none;-moz-appearance:none;appearance:none}



/* Enhanced Tooltips */

[data-toggle=tooltip]{position:relative}

[data-toggle=tooltip]::before{content:attr(data-title);position:absolute;white-space:nowrap;font-size:13px;line-height:15px;height:15px;font-weight:300;padding:4px 10px;border-radius:50px;top:100%;left:50%;background:var(--background-primary);color:var(--text-primary);-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium);display:block;z-index:1000}

[data-toggle=tooltip]::after{content:'';position:absolute;top:80%;top:calc(100% - 14px);left:50%;width:0;height:0;border-bottom:6px solid var(--background-primary);border-right:6px solid transparent;border-left:6px solid transparent;-webkit-transform:translate(-50%,-50%);-moz-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-o-transform:translate(-50%,-50%);transform:translate(-50%,-50%);-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);-o-transition:all var(--transition-medium);transition:all var(--transition-medium);display:block;z-index:1000}

[data-toggle=tooltip]:hover::before{-webkit-filter:opacity(100%) brightness(110%);filter:opacity(100%) brightness(110%);visibility:visible}

[data-toggle=tooltip]:hover::after{-webkit-filter:opacity(100%) brightness(110%);filter:opacity(100%) brightness(110%);visibility:visible}



/* Enhanced Special Elements */

#stripe-methods{display:none}

.box.list .account{background:var(--background-secondary);border-left:5px solid var(--primary-color);position:relative;padding:12px 50px 12px 22px;font-size:16px;color:var(--text-primary);margin:10px 0 20px;display:inline-block}

.error-check{color:var(--accent-color);padding-top:5px}

.game-server-wrapper{color:#fff}

.game-content-wrapper .frame{padding:12px 10px!important}

.game-content-wrapper .frame,.game-content-wrapper .inner-frame{background:var(--background-glass)}

.game-content-wrapper .ddt-game-border{border:1px solid var(--border-color);padding:7px 10px;border-radius:10px;margin-bottom:10px}

.game-wrapper-flex{display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}

.ddt-game-border img{width:auto;height:35px;margin-top:0;margin-right:0}

.switch-button{position:relative;display:table;cursor:pointer;min-width:130px}

.switch-button:hover{padding-left:4px}

.switch-button .game_status{border-radius:50%;border:1px solid #fff;width:15px;height:15px;margin:2px 7px 2px 0;padding:3px}

.switch-button .game_status .status{border-radius:50%;width:100%;height:100%}

.switch-button .game_status .status.s1{background:rgba(255,235,59,1);border-color:rgba(255,235,59,1)}

.switch-button .game_status .status.s2{background:rgba(243,37,41,1);border-color:rgba(243,37,41,1)}

.switch-button .game_status .status.s3{background:rgba(120,120,120,1);border-color:rgba(120,120,120,1)}

.switch-button .game_status .status.s4{background:rgba(22,122,242,1);border-color:rgba(22,122,242,1)}

.game-button{position:relative;display:table;cursor:pointer;min-width:130px}

.game-button-bg{background-color:var(--accent-color)}

.game-button:hover{background-color:var(--secondary-color)}

.game-button a:hover{text-decoration:none!important}

.game-button a{color:#fff}

.game-button .game_status{border-radius:50%;border:1px solid #fff;width:15px;height:15px;margin:2px 7px 2px 0;padding:3px}

.game-button .game_status .status{border-radius:50%;width:100%;height:100%}

.inner-frame{margin:25px auto;padding-bottom:25px!important}

.game-button .game_status .status.s1{background:rgba(255,235,59,1);border-color:rgba(255,235,59,1)}

.game-button .game_status .status.s2{background:rgba(243,37,41,1);border-color:rgba(243,37,41,1)}

.game-button .game_status .status.s3{background:rgba(120,120,120,1);border-color:rgba(120,120,120,1)}

.game-button .game_status .status.s4{background:rgba(22,122,242,1);border-color:rgba(22,122,242,1)}

.top_title{font-size:24px}

.server_font{color:#fffdfb;font-weight:700}

.row{height:130px;margin-right:15px;margin-left:15px;box-sizing:border-box;display:block;clear:both}

.text-center{text-align:center}

.mb-5{margin-bottom:5px}

.mb-10{margin-bottom:10px}

.mb-15{margin-bottom:15px}

.max-wd-150{max-width:150px}

.inner-frame{margin:25px auto;padding-bottom:25px!important}

.text-center{text-align:center}



/* Enhanced Tab System */

.tab{overflow:hidden;border:1px solid var(--border-color);background-color:var(--background-secondary)}

.tab button{background-color:inherit;float:left;border:none;outline:none;cursor:pointer;padding:14px 16px;transition:.3s;font-size:17px}

.tab button:hover{background-color:var(--background-primary)}

.tab button.active{background-color:var(--primary-color)}

.tabcontent{display:none;padding:6px 12px;border-top:none}

.wrapper-captcha > img{display:inline-block;vertical-align:middle}

.list-card-recharge{text-align:center}

.list-card-recharge .title{color:var(--text-primary);font-weight:600;padding:20px 0}

.ratio_deposite{display:none}

.ratio_deposite:focus{box-shadow:none!important}

.select-phoenix{padding:10px;border-radius:5px;border:1px solid var(--border-color);outline:none}



/* Enhanced Overlay */

.overlay{height:100%;width:0;position:fixed;z-index:999;top:0;left:0;background-color:var(--background-primary);background-color:rgba(255,255,255,0.95);overflow-x:hidden;transition:.5s}

.overlay-content{position:relative;top:25%;width:100%;text-align:center;margin-top:30px}

.overlay a{padding:8px;text-decoration:none;font-size:36px;color:var(--text-secondary);display:block;transition:.3s}

.overlay a:hover,.overlay a:focus{color:var(--text-primary)}

.overlay .closebtn{position:absolute;top:20px;right:45px;font-size:60px}

.p-relative{position:relative}

.hint-text{position:absolute;left:50%;top:0;display:none;width:200px;transform:translateY(-100%) translateX(-50%);background-color:var(--background-primary);color:var(--text-primary);padding:10px;border-radius:5px}

.compete-item:hover+.hint-text{display:block}



.d-none{display:none!important}

.header-banner{width:611px}

.header-banner img{width:100%}

.card-launcher{width:250px;cursor:pointer}

.card-launcher a img{width:100%}



.row-coin{display:flex}

.row-coin label{flex:1}

.row-coin label:first-child{margin-right:10px}

.row-coin input{width:100%;box-sizing:border-box}



/* Enhanced Confirm Convert Coin */

#confirm-convert{display:none;position:fixed;z-index:9999;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0,0,0,0.6)}

#confirm-convert .modal-content{background-color:var(--background-card);margin:15% auto;padding:20px;border:1px solid var(--border-color);width:500px;border-radius:12px}

#confirm-convert .modal-header{display:flex;justify-content:space-between;align-items:center}

#confirm-convert .modal-header h2{margin:0}

#confirm-convert .modal-header .close{cursor:pointer}

#confirm-convert .modal-body p{margin:0}

#confirm-convert .modal-footer{margin-top:20px;text-align:right}

#confirm-convert .modal-footer button{padding:7px 20px;cursor:pointer}

#btn-confirm{background-color:var(--primary-color);color:#fff}

#btn-cancel{background-color:var(--border-light);color:#000}

#btn-confirm:hover,#btn-cancel:hover{filter:brightness(105%);}



/* Enhanced Slideshow */

.mySlides{display:none}

.mySlides > a > img{vertical-align:middle}

.slideshow-container{max-width:620px;position:relative;margin:0 0 40px;border:1px solid var(--border-color);background:var(--background-secondary);box-shadow:var(--shadow-lg);border-radius:0 0 12px 12px;overflow:hidden;float:left}

.prevslide,.nextslide{cursor:pointer;position:absolute;top:50%;transform:translateY(-10%);width:auto;padding:8px 16px 9px 8px;margin-top:-22px;color:var(--accent-color);background-color:var(--background-glass);font-weight:700;font-size:32px;transition:.6s ease;border-radius:0 32px 32px 0;user-select:none}

.nextslide{padding:8px 8px 9px 16px;right:0;border-radius:32px 0 0 32px}

.prevslide:hover,.nextslide:hover{background-color:var(--background-glass)}

.mySlides > .text{color:var(--text-primary);font-size:15px;padding:8px 12px;position:absolute;bottom:8px;width:100%;text-align:center}

.mySlides > .numbertext{color:var(--text-primary);font-size:12px;padding:8px 12px;position:absolute;top:0}

.dotList{position:absolute;bottom:10px;left:50%;transform:translateX(-50%)}

.dot{cursor:pointer;height:15px;width:15px;margin:0 2px;background-color:var(--background-secondary);border-radius:50%;border:2px solid var(--accent-color);display:inline-block;transition:background-color .6s ease}

.fade{-webkit-animation-name:fade;-webkit-animation-duration:1.5s;animation-name:fade;animation-duration:1.5s}

.slide-right-custom{width:250px;float:right;margin:0 0 40px}

.slide-right-custom > .item-right{width:100%;height:48px;font-size:12px;text-transform:uppercase;line-height:48px;margin:0 0 5px}

.slide-right-custom > .item-right > a{display:inline-block;color:var(--text-muted);width:100%;height:100%;padding:0 16px;background-color:var(--background-secondary);cursor:pointer}

.item-right.active a,.dot.active,.dot:hover{background-color:var(--accent-color)!important;color:#fff}



/* Enhanced Animations */

@keyframes spinLoad{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}

@-webkit-keyframes spinLoad{from{-webkit-transform:rotate(0deg);color:red}to{-webkit-transform:rotate(360deg);color:#ff0}}

@-webkit-keyframes fade{from{opacity:.4}to{opacity:1}}

@keyframes fade{from{opacity:.4}to{opacity:1}}



/* Enhanced Responsive Design */

.page-master-menu .widget{border:1px solid var(--border-color)}

.page-master-menu .widget .inner{background-color:var(--background-card)}

.page-master-menu .widget h3{background:var(--primary-color);color:#fff}

.page-master-menu .widget.menu-serve-list{top:10px}

.page-master-menu .widget.menu-raking-users{top:10px}

.page-master-menu .widget.menu-raking-users .tag{top:0}

.page-master-menu .widget.menu-raking-users #load-ranking-container{display:block;padding:10px 0;font-size:14px;color:var(--accent-color)}

.section-special-items{margin-top:170px!important;border:1px solid var(--border-color)!important}

.section-special-items .title-new{color:var(--accent-color)!important;display:flex!important;width:fit-content;text-align:center;align-items:center}

.section-special-items .title-new h1{margin-left:12px}

.section-special-items .itemTabsAnchor a{color:var(--text-muted)!important}

.section-special-items .itemTabsAnchor a.active{color:var(--accent-color)!important}

.section-special-items .animElement{border:1px solid var(--border-color)!important}

.section-special-items div span{color:var(--text-primary)!important;margin-top:6px;font-size:12px}

.menu-section-fanpage{top:10px!important}



.mobile-nav{display:none}

.dnone{display:block!important}

.clearfix:after{content:"";clear:both;display:table}

.desktop,.mobile{display:flex;justify-content:center}

form.account thead{font-size:15px}

form.account tbody{font-size:14px}

.notify{color:#343a40;font-size:15px;background-color:#f28a1a33;padding:7px 10px;margin-bottom:10px;border-radius:5px}

#loadRanking{font-size:14px}

#captcha_img_src{cursor:pointer}



@media (max-width:1200px) {

    .container{width:100%;padding:0 4%}

    nav#menu{width:320px;height:100vh;padding:20px 0;background:rgba(255,255,255,0.98);backdrop-filter:blur(25px);text-align:left;z-index:9090;position:fixed;overflow-y:auto;top:0;left:0;box-shadow:var(--shadow-xl);border-right:1px solid var(--border-color);-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);-ms-transform:translateX(-100%);-o-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition:all var(--transition-medium);-moz-transition:all var(--transition-medium);-ms-transition:all var(--transition-medium);transition:all var(--transition-medium)}

    nav#menu ul{max-width:1000px;justify-content:space-evenly;padding:0 20px}

    nav#menu > ul > li > a{padding:20px 24px;font-size:15px}

    .menuopen nav#menu{-webkit-transform:translateX(0%);-moz-transform:translateX(0%);-ms-transform:translateX(0%);-o-transform:translateX(0%);transform:translateX(0%)}

    nav#menu:after{display:none}

    nav#menu ul{flex-direction:column;align-items:stretch}

    nav#menu ul li{width:100%;border-bottom:1px solid var(--border-color);display:block;position:relative}

    nav#menu ul li:last-child{border-bottom:none}

    nav#menu a{color:var(--text-primary);text-shadow:none;font-size:15px;font-weight:500}

    nav#menu > ul > li:after{display:none}

    nav#menu:hover > ul > li:after{display:none}

    nav#menu > ul > li > a{padding:16px 20px;text-align:left;border-radius:0}

    nav#menu > ul > li > a:before{display:none}

    nav#menu > ul > li > a:hover{background:var(--background-secondary);padding-left:24px}

    nav#menu > ul > li > ul{position:static;transform:none;width:100%;max-height:0;opacity:0;visibility:hidden;background:var(--background-secondary);border-radius:0;box-shadow:none;border:none;margin:0;transition:all var(--transition-medium)}

    nav#menu > ul > li:hover > ul{padding:0;max-height:300px;opacity:1;visibility:visible}

    nav#menu > ul > li > ul > li > a{padding:12px 40px;background:transparent;font-size:14px}

    nav#menu > ul > li > ul > li > a:hover{background:rgba(99,102,241,0.1);padding-left:44px}

    #menuClose{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);backdrop-filter:blur(5px);z-index:8080;-webkit-filter:opacity(0%);filter:opacity(0%);visibility:hidden;transition:all var(--transition-medium)}

    #menuClose:after{content:'×';font-family:"Inter",sans-serif;font-size:28px;line-height:40px;font-weight:300;color:#fff;position:absolute;top:20px;right:20px;display:block;width:40px;height:40px;text-align:center;background:rgba(255,255,255,0.1);border-radius:50%;cursor:pointer;transition:all var(--transition-medium)}

    #menuClose:hover:after{background:rgba(255,255,255,0.2);transform:scale(1.1)}

    .menuopen #menuClose{visibility:visible;-webkit-filter:opacity(100%);filter:opacity(100%)}

    header{height:auto}

    header .logo{position:relative;z-index:2;text-align:center;padding:50px 0 20px}

    header .logo img{max-width:90%;margin:0}

    header #menuAnchor{position:absolute;display:flex;align-items:center;top:0;left:0;padding:20px;z-index:100;cursor:pointer;transition:all var(--transition-medium)}

    header #menuAnchor:after{content:'MENU';font-size:13px;color:var(--text-primary);display:inline-block;margin-left:15px;font-weight:600;text-transform:uppercase;position:relative;letter-spacing:0.05em}

    header #menuAnchor:hover{background:rgba(99,102,241,0.05);border-radius:8px}

    header #menuAnchor span{width:24px;height:3px;background:var(--text-primary);position:relative;display:block;border-radius:3px;transition:all var(--transition-medium)}

    header #menuAnchor span:nth-child(2){margin:4px 0}

    header #menuAnchor span:nth-child(3){margin:0}

    .menuopen header #menuAnchor span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}

    .menuopen header #menuAnchor span:nth-child(2){opacity:0}

    .menuopen header #menuAnchor span:nth-child(3){transform:rotate(-45deg) translate(7px,-6px)}

    main{width:100%;display:inline-block;overflow:hidden}

    aside{float:left;width:100%}

    aside .widget{margin:0 0 4%}

    aside .widget h3{background:var(--primary-color);text-align:center;font-size:13px;font-weight:900;color:#fff;text-transform:uppercase;padding:12px}

    aside .widget .inner{padding:14px}

    aside .widget ul{list-style:none;margin:0;padding:0}

    aside #login{margin:0 0 4%;padding-top:15px}

    aside #login:before,aside #login:after{display:none}

    aside #login form{padding:0 0 10px}

    aside #login input{width:100% !important}

    .buttonsSocial a{width:48%;width:calc(50% - 4px)}

    .buttonsSocial a .icon{width:40px}

    .buttonsSocial a small{width:70%;width:calc(100% - 50px);display:inline-block}

    main section{width:100%;float:right}

    main section .box,main section .box.mid{max-width:100%;margin:0 0 4%}

    main section .box.guia{margin-top:46px}

    main section .box.guia > .title{font-size:18px;margin:-60px 0 0 -3%}

    main section .box .biglist{padding:8px 10px 5px}

    main section .box .biglist li{background:var(--background-secondary);border-radius:0;margin:0 0 3%;padding:0 20px 0 0}

    main section .box .biglist li i[class*="icon"]{margin:10px;-webkit-transform:scale(0.9);-moz-transform:scale(0.9);-ms-transform:scale(0.9);-o-transform:scale(0.9);transform:scale(0.9)}

    main section .box .biglist li strong{font-size:14px;margin:12px 0 3px}

    main section .box .biglist li p{font-size:13px}

    main section .box .biglist .recharge-left{width:100%;float:none;padding:0 10px}

    main section .box .biglist .recharge-right{width:100%;text-align:center}

    main section .box.itens{margin-top:46px}

    main section .box.itens > .title{font-size:18px;margin:-50px 0 0 2%}

    main .listsquare{display:block}

    main .listsquare li{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:4px;width:30%;height:80px;margin:0 1.5% 32px;display:inline-block;vertical-align:top}

    main .listsquare li img{vertical-align:top;max-height:68px;margin:5px}

    main #slideHome{width:100%;height:auto;margin:0 0 2%}

    main #slideHomeAnchor{width:100%;margin:0 0 4%}

    main #slideHomeAnchor .item{height:38px;line-height:38px}

    .itemTabsAnchor{margin:10px 0;padding:0 20px}

    .itemTabsAnchor a.active{color:var(--accent-color)}

    .itemTabsAnchor a{color:var(--accent-color);padding:6px 12px;margin:0;transition:all var(--transition-medium)}

    .itemTabsAnchor a:after{display:none}

    main section .cards{width:100%;text-align:center}

    footer{margin:0 0 10px}

    footer .text{margin:0;font-size:16px;padding:20px 0 80px}

    footer .bottom{height:auto;line-height:20px;text-align:center;padding:10px 0}

    footer .bottom .left{width:100%}

    footer .bottom .right{width:100%}

    main .banner{margin:0 0 4%}

    main .box.single{padding:15px}

    main .box.single .share{width:45px;padding:0 15px 0 0}

    main .box.single .content{width:calc(100% - 45px);padding:0 0 0 15px}

    main .box.single .content .title{margin:0 0 15px}

    main .box.single .content p,main .box.single .content ul{font-size:14px;margin:0 0 10px}

    main .box.list ul li.title{padding:14px 20px;font-size:14px}

    main .box.list ul li a{padding:12px 20px}

    main .box.list.pagenavi{padding:10px 10px 6px}

    main .box.list.pagenavi ul li{border:1px solid var(--border-color);border-radius:5px;margin:0 2px 4px 0}

    main .box.list.pagenavi ul li a{height:50px;line-height:50px;vertical-align:top;padding:0 20px}

    main .box.list.pagenavi ul li a.small{font-size:13px}

    main .box.servers{min-height:200px}

    main .box.servers .content{max-width:100%}

    main .box.servers .listtag{margin-bottom:25px}

    footer.servers{margin-top:0}

    footer.servers .text{font-size:12px;color:var(--text-primary);margin:0 0 20px}

    .render02,.render03{display:none}

    div.modal .content{width:90%}

    div.modal .box{padding:20px}

    div.modal .box .button{margin:5px auto}

    div.modal .box .cancel{width:100%}

}

@media only screen and (max-width: 768px) {

    body{background-attachment:scroll;background-size:cover}

    main section{width:100%;float:right}

    main section .box,main section .box.mid{width:100%}

    main section .box.guia{margin-top:46px;display:none}

    main .box.single{padding:15px;margin:0}

    main .box.single .share{display:none}

    main .box.single .content{width:auto;padding:0;border-left:none}

    main .box.single .content .title{font-size:15px;margin:0 0 15px}

    main .box.single .content h3{font-size:16px}

    main .box.single .content p,main .box.single .content ul{font-size:14px}

    main .box.single .content img{width:350px;text-align:center}

    main .box.list ul li.title{padding:14px 20px;font-size:14px}

    main .box.list ul li a{padding:12px 20px}

    main .banner img{width:100%}

    #master-qr-info{display:block;position:fixed;left:0;top:45%;z-index:1}

    #master-qr-info .block-sm{cursor:pointer}

    #master-qr-info .block-sm img{width:54px}

    #master-qr-info .block-more{position:relative;display:none}

    #master-qr-info .block-more .btn-close{position:absolute;top:0;right:-1px;cursor:pointer}

    #master-qr-info .block-more .btn-close svg{fill:#fff;margin:2px 5px}

    #master-qr-info.selected .block-sm{display:none}

    #master-qr-info.selected .block-more{background:var(--accent-color);display:flex;flex-direction:column;padding:35px 15px 15px}

    #master-qr-info.selected .block-more img{width:150px}

    .desktop{display:none}

    .mobile{display:flex}

    .container.mobile{justify-content:center;margin-top:20px;}

    .tabsContent .mobile{display:block!important}

    #qrImageContainer{padding:0}

    #qrImage{width:320px}

    .tabcontent{padding:6px 0}

    .page-master-menu{margin-top:25px}

    header .logo{padding:0}

    header .logo img{width:200px;margin:0}

    #qrImage{margin-top:0}

    main .listtag li a{font-size:13px}

    main .listsquare li{background:var(--background-secondary);border:1px solid var(--border-color);border-radius:4px;width:30%;margin:0 1.5% 32px;display:inline-block;vertical-align:top}

    main .listsquare li img{vertical-align:top;max-height:58px;margin:5px}

    main .listsquare li span{font-size:11px;font-weight:500}

    .button-functional-account .item{width:48%}

    form.detail-account .info{width:35%}

    .button-functional .item,.button-functional.acc .item{width:49.4%}

    .button-functional .item.green,.button-functional .item.darkgray{justify-content:space-evenly}

    .dnone{display:none!important}

    .mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:1000;display:flex;height:65px;background:var(--accent-dark);border-radius:1.5rem 1.5rem 0 0;box-shadow:0 -4px 6px -1px rgba(0,0,0,0.1),0 2px 4px -1px rgba(0,0,0,0.06)}

    .mobile-item{flex-grow:1;text-align:center;font-size:12px;display:flex;flex-direction:column;justify-content:center}

    .mobile-content.is-active img{filter: invert(17%) sepia(100%) saturate(7493%) hue-rotate(0deg) brightness(99%) contrast(118%)}

    .mobile-content{color:#fff;display:flex;flex-direction:column;align-items: center}

    .mobile-content img{margin:5px 0;width:24px;filter:brightness(110%);}

    .mobile-content img:hover{fill:red}

}

@media only screen and (max-width:576px) {

    .newsTabsAnchor a{font-size:12px;padding:0 8px;line-height:32px}

    .newsTabsAnchor{height:42px;padding:5px;margin-left:0}

    .itemTabsAnchor{float:none;width:100%;margin:10px 0 0;display:flex;flex-wrap:wrap;justify-content:center}

    .itemTabsAnchor a{font-size:13px;padding:4px 8px;border:1px solid var(--border-color);border-radius:20px;margin:2px}

    .itemTabsAnchor a:last-child{border:1px solid var(--border-color)}

    .slide-right-custom{width:100%}

    .slideshow-container{margin:0 0 10px}

    main section .tabsAnchor a{padding:0 .9nem}

    .overlay a{font-size:20px}

    .overlay .closebtn{font-size:40px;top:15px;right:35px}

    section .search{width:100%}

}

@media only screen and (max-width:300px) {

    .prevslide,.nextslide,.mySlides > .text{font-size:11px}

}

/* Enhanced Scrollbar */

::-webkit-scrollbar{width:8px}

::-webkit-scrollbar-track{background:var(--border-color)}

::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:4px}

::-webkit-scrollbar-thumb:hover{background:var(--primary-dark)}



/* Enhanced Selection */

::selection{background:var(--primary-color);color:white}

::-moz-selection{background:var(--primary-color);color:white}



/* Enhanced Animations */

.animElement{opacity:0;transform:translateY(20px);transition:all var(--transition-slow)}

.animElement.in-view{opacity:1;transform:translateY(0)}

.animElement.slide-left{transform:translateX(-20px)}

.animElement.slide-left.in-view{transform:translateX(0)}

.animElement.slide-right{transform:translateX(20px)}

.animElement.slide-right.in-view{transform:translateX(0)}

.animElement.just-show{transform:none}

.animElement.just-show.in-view{opacity:1}

.animElement.zoom-in{transform:scale(0.9)}

.animElement.zoom-in.in-view{transform:scale(1)}