/*
Theme Name: PINYEU
Theme URI: https://gamehayvl.com/
Description: themes by <a href="https://gamehayvl.com/" target="_blank">gamehayvl.1o</a>.
Author: gamehayvl.com
Author URI: https://gamehayvl.com/
Version: 2.3
Tags: blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, rtl-language-support, editor-style, custom-menu (optional)
*/

/* ----------------------------------------------------- START RESET CSS-------------------------------------------------------------- */
*{margin:0;padding:0;outline:none}
body{background:#f1f1f1;font-family:-apple-system,BlinkMacSystemFont,segoe ui,Roboto,Oxygen-Sans,Ubuntu,Cantarell,helvetica neue,sans-serif;font-style:normal;font-size:15px;color:#515151;position:relative;min-width:200px;}
h1, h2, h3, h4, h5, h6{font-size:medium;color:#272727}
h1 a{color:#595959}
h1 a:hover{text-decoration:none}
h3.loop{overflow:hidden;text-overflow:ellipsis;font-size:15px;margin-top:3px;margin-bottom:5px}
a:link, a:active, a:visited{color:#333333;text-decoration:none;}
a:hover{text-decoration:none;}
.clearfix{clear:both}
.pad,.tagcloud{padding:12px}
.prefix{font-size:11.5px;background:hsl(127,39%,55%);color:hsl(0,100%,100%);padding:2px 2px;display:block;position:absolute;right:10px;top:0;border-bottom-right-radius:4px;border-bottom-left-radius:4px;}
.center-title{display:block;text-align:center;padding:8px;line-height: 22px;}
.bolder-title{border-top:1px solid #e2e2e2;border-bottom:1px solid}
#body{display:block;max-width:1100px;min-width:200px;margin:auto;}
.fullhead{background:#222223;position: sticky;top: 0;z-index: 9999;}
.pagewidth{background:#F2F2F3;box-shadow:0 2px 2px rgba(0,0,0,0.03);border-bottom:1px solid #D9D9D9;}
header{background:#222222;font-size:14px;height:64px;max-width:1100px;position:relative;margin:auto;}
.end{padding:35px;}
.end_index{padding:26px;}
.end_cat{padding:25px;}
#head-menu li,#footer-menu li{display:inline-block}
#head-menu a,#head-menu a:hover,#footer-menu a,#footer-menu a:hover{color:#FFF;display:block;padding:6px}
#head-menu li:hover a{background:#253444;text-decoration:none}
.more ul{z-index:10;background:#253444;position:absolute;display:none}
.more:hover ul{display:block}
.more ul li{width:100%}
.more ul li a:hover{background:#CCCCCC!important}
.list{background:#fff no-repeat 5px center;padding:8px 0px 8px 20px;border-bottom:1px solid #E9E9E9;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.list2{white-space:nowrap;text-overflow:ellipsis;position:relative;height: 95px}
.list2 p{white-space:normal;}
.item{border-bottom:1px solid #E9E9E9;padding:12px 8px 12px 12px;overflow:hidden;background:#fff;min-height: 30px;height: 70px;}
.item p{font-size:12px;margin-bottom:0.25rem;overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical}
.btn_download{font-size:22px;position:absolute;z-index:2;right:5px;bottom:4px;width:22px;}
.btn_download:hover{background-position:-40px 6px;}
article:nth-child(odd){border-bottom:1px solid #e2e2e2;padding:0 0 12px;clear:both;line-height: 23px;}
article:nth-child(even){border-bottom:1px solid #e2e2e2;padding:0px;clear:both;background-color:#fcfcfc}
article p{max-height:36px;display:block;overflow:hidden;line-height:18px}
article a{color:#666}
article a:hover{color:#2CAAD3;text-decoration:none}
.photo{width:70px;float:left;margin:0 8px 0 0;height:70px;border-radius:19%;overflow:hidden;}
.info-game{background:#FFFFFF;overflow:hidden;display:flex;}
.info-game label{font-weight:700}
.average{display:block;overflow:hidden;width:66px;background: 0 -14px no-repeat}
.average span{display:block;text-indent:-9000px;background: 0 -1px no-repeat;height:13px}
.votes{display:none}
#content{line-height:1.6;background:#FFFFFF}
#content img.photobv{width:75px;height:75px;border-radius:19%;overflow:hidden;display:inline;margin: auto 12px;}
#content p{margin-bottom:15px;min-height:18px;}
#content img{max-width:100%;margin-bottom: 10px;height:auto;display:block;margin-left:auto;margin-right:auto}
#content ul,ol{margin:0px 5px 10px 30px;line-height: 26px;}
#content h3{font-size:18px;margin-bottom:14px;margin-top:16px;}
#content h2{font-size:22px;margin-bottom:16px;margin-top:16px;line-height:30px;}
#content h1{font-size:23px;margin-bottom:16px;margin-top:16px;line-height:32px;}
#content a{color:#428bca;}
#content iframe{margin-left:auto;margin-right:auto;max-width:100%;display:block;}
div#top-content { margin: 0px -12px; }
#content #top-content h1{font-size:16px;margin-bottom:0px;margin-top:-12px;line-height:25px;border-bottom: 1px solid #e2e2e2;padding: 12px;}
#wp_page a{margin:2px;box-shadow:inset 0 0 1px rgba(255, 255, 255, 0),1px 1px 1px;background:#E9E9E9;padding:3px 10px;color:#7B7979;text-decoration:none;border:#D3D0D0 solid 1px;border-radius:3px;}
#wp_page a:hover{background:-webkit-gradient(linear,0% 0%,0% 100%,from(#FBFBFB),to(#f0f0f0));}
#wp_page .current{border-radius:3px;margin:2px;box-shadow:inset 0 0 8px rgba(0,0,0,0.31),0 1px 0 rgba(255,255,255,0.8);padding:3px 10px;color:#fff;background:#363535;}
.bottom-content{background:#f6f6f6;border-top:1px solid #e2e2e2;padding:7px;font-size: 0.825rem;line-height: 24px;}
.bottom-content a{text-decoration:none;font-weight:300;padding: 5px;}
.details{padding:0!important;border-bottom:0!important}
.details .timeline{width:100%}
.comment p,.fun-story p,.details p{max-height:none!important}
button{background:url('images/seach.png') no-repeat center;padding:8px 8px;border:0;}
.seach input{background:black;color:#FFF;padding:5px;border:1px solid #363636;width:90%;box-shadow:inset 0 1px 2px rgba(46, 43, 43, 0.07);position:relative;border-radius:10px;height: 25px;}
.search-button{width:30px;height: 30px;position:absolute;right:3%;top:17px;}
.come_home{max-width:300px;line-height:35px;color:#FFF;text-align:center;display:block;margin-left:auto;margin-right:auto;background:#FB8C00;font-size:15px;padding:0 25px;margin-bottom:5px;}
.come_home:hover{background:#FFC107;text-decoration:none;margin-bottom: 16px;}
.file-download { background: rgb(249, 245, 234); padding: 16px 0px; }
.download-bv {color: #fff; background: #2A6525; font-size: 15px; margin-bottom: 16px; border-radius: 25px; display: flex; margin: 4px 16px; }
a.name-download { text-align: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: 1 1 auto; padding: 6px 8px;}
span.size-download { border-radius: 15px; background-color: rgb(206 235 202/31%); font-weight: 700; text-align: center; padding: 0px 10px; min-width: 4rem; margin: 10px;}
.download{line-height:40px;color:#FFF;text-align:center;display:block;margin-top:16px;margin-left:12px;margin-right:12px;background:#2A6525;font-size:15px;margin-bottom:16px;border-radius: 20px;}
.download:hover{background:#3ea031;text-decoration:none;}
.download-body{display: block; padding: 6px 6px; border: 1px solid #dee2e675!important; border-radius: 0.25rem!important;background: rgb(249, 245, 234);}
.icon_download{background:#43a047;border-radius:3px;float:right;padding:2px 10px;color:#fff;margin-top:18px;font-weight:bold;}
.icon_download:hover{background:#00c853;text-decoration:none}
.icon_view{background:url(assets/images/icon_view.png) no-repeat center left;padding-left:20px;font-size:11px;margin-right:4px}
.icon_play{padding-left:13px;font-size:11px;margin-right:4px;background:url(assets/images/item.png) no-repeat center left}
.icon_author{background:url(images/user.png) no-repeat center left;padding-left:20px;font-size:11px;margin-right:4px;}
.icon_share{background:url(images/share.png) no-repeat center left;padding-left:20px;font-size:11px;margin-right:4px}
.icon_time{background:url(images/clock.png) no-repeat center left;padding-left:20px;font-size:11px;margin-right:4px}
.download-tab{max-width:350px;display:block;margin-left:auto;margin-right:auto;border:#43a047 solid 1px;margin-bottom:5px;border-radius:6px;}
.download-tab ul{margin-left:4px !important}
.download-tab-title{display:block;font-weight:700;color:#FFF;background:#43a047;text-align:center;line-height:28px;border-top-left-radius:4px;border-top-right-radius:4px;}
.download-tab li{list-style:none;border-top:1px solid #E2E2E2;padding:4px 10px;background:url(assets/images/item.png) left 8px no-repeat}
.download-tab p{margin-bottom:0!important}
.download-tab a{font-weight:bold;}
.text-title { margin: 12px 0px; line-height: 22px; }
#mdtimer {margin-top: 16px;}
.sms-title{text-align:center;margin-bottom:5px}
.sms-content{border-bottom:#f9f9f9 solid 1px;text-align:center}
.sms{margin:auto;max-width:240px;padding:4px;color:#00A3FF;border:1px solid #E7E7E7;border-radius:3px;box-shadow:0px 0px 5px #ccc;margin-bottom:5px}
.sms:hover{border:1px solid #08DBDB;}
.gamehayandroid{background:#222222;padding:5px 4px;color:#DDDDDD;}
.gamehayandroid a{color:#999}
#footer{background:#3b3b3b;margin-top:20px;color:#CCCCCC;font-size:11px;line-height:1.2;overflow:hidden;padding:8px 8px 6px;}
#footer img{float:right;width:100px;}
#footer a{color:#CCCCCC;}
#footer a:hover{color:#EC534D!important;}
.ft{display:block;max-width:1100px;min-width:200px;margin:auto;}
.copyright{padding-top:3px}
.py{float:left;font-size:12px;padding:4px;}
.lienhe{float:right;font-size:12px;padding:4px 0px 4px 5px;}
.lienhe img{background:5px center;float:left;width:18px;}
@media only screen and (max-width:250px){.photo{display:none!important}
.nav_menu ul li{font-weight:400;font-size:14px;padding:8px 35px 8px 8px;list-style:none;text-decoration:none;border:#e2e2e2 solid 1px;border-top:0}
.nav_menu a{color:#666}
.title{background:#2CAAD3;padding:4px}
.details{display:none!important}
#head-menu a,#head-menu a:hover,#footer-menu a,#footer-menu a:hover{padding:6px}
#close,#open{display:none!important}
}
.thead{width:100%;background:#222;color:#fff;font-size:14px;height:35px;font-weight:bold;overflow:hidden;margin-top:10px;}
.thead a{font-weight:bolder;color:#FFF;}
.box-tow{background-color:#c00000;float:left;height:37px;vertical-align:middle;}
.box{border-style:solid;border-width:17px 0 20px 20px;border-color:transparent transparent transparent #c00000;float:left;}
a.view-more{padding-right:20px!important;float:right;font-weight:bold;}
h2.block-title{padding-left:5px;color:#595959;float:left;}
.foot{background-color:#444;padding:5px;font-size:small;}
.foot1{background-color:#444;padding:5px 5px 1px 5px;font-size:small;border-bottom:1px solid #E74946;}
.end_index{padding:25px;}
.breadcrumb-nen{background-color:#fbfbfb;margin-top:5px;}
.qdk_breadcrumb{text-shadow:#fff 1px 1px 1px;padding:0;border:1px solid #e5e5e5;white-space:nowrap;overflow:hidden;}
.qdk_breadcrumb
span.crumb{color:#909090;display:inline-block;padding:10px;}.crumb
a{text-decoration:none;color:#666}.crumb a:hover{color:#000}
.qdk_breadcrumb span.crumb::after {content: ' '; border-top: 2px solid #6c757d; border-right: 2px solid #6c757d; display: inline-block; vertical-align: middle; width: 0.3rem; height: 0.3rem; padding-right: 0px; margin-top: -0.25rem; margin-right: -0.9rem; margin-left: 0.3rem; transform: rotate( 45deg ); }
.xemthem{padding:4px 7px 1px 0px;border-bottom:3px solid #F3F3F3;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-weight:bold;}
.danhmuc{background:#08A8E8 url(menu.png) no-repeat center left;;color:#fff;font-size:14px;padding:6px;font-weight:bold;padding:5px 0px 5px 20px;border-bottom:1px solid #E9E9E9;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.danhmuc a{font-weight:bolder;color:#FFF;}
.info, .post_info .stats{font-size:11px;padding:2px;color:#888;margin-top:2px;margin-left:67px;}
.free{z-index:20;position:absolute;width:36px;height:36px;top:-1px;margin:0;background:url(images/ribbon_free.png) 0 0 no-repeat;}
#logo{float:left;margin-right:10px;width:60%;height:100%;}
#logo img{height:40px;max-width: 100%;margin: 12px auto 12px 6px;}
left{line-height:2px;float:left;margin-right:-33px;}
.seach{width:30%;float:right;height: 100%;display: flex;justify-content: right;}
.pylist{display:inline-block;border-right:1px solid #DDD;position:relative;}
.pylist a{color:#565759;font-weight:bold;font-size: 14px; padding: 7.5px 13px; display: list-item;}
.pylist:hover{background:#FFFFFF;}
.pylist:hover ul{display:block;}
.pylist:active ul{display:block;}
.pylist:visited ul{display:block;}
.pymenu{color:#565759;list-style:none outside none;width:1100px;margin:auto;height:35px;display: flex;}
ul.submenu{color:#023;list-style:none;display:none;width:220px;border-right:solid 1px #ccc;border-bottom:solid 1px #ccc;border-left:solid 1px #ccc;background:#fff;position:absolute;left:-1px;top:35px;z-index:999;box-shadow:0 1px 2px rgba(0,0,0,.3);}
ul.submenu li{height:35px;padding-left:10px;line-height:35px;}
ul.submenu li:hover{background:#f5f4f4}
.text-logo h1{display:inline-block;position:absolute;bottom:2px;left:10px;color:white;font-size:10px;text-shadow:0 0 4px #FFFFFF;}
#content .infobv{border-top:1px dashed #e2e2e2;background:#FFFFFF;padding-bottom: 6px;padding-top:12px;position: relative}
#content .infobv .info-left p{padding:6px 8px;line-height: 20px;margin-bottom:0px;}
#content .infobv .info-left{display:inline-block;}
#content .infobv .info-right{width:70px;float:right;margin-top: 30px;}
#content .infobv .info-right img{margin-bottom:0}
.infobv {padding: 12px 0px;border-top: 0.5px dashed #e2e2e2;background: #FFFFFF;}
.infobv p {padding: 8px;}
.infor-bv{border-top:1px dashed #e2e2e2;border-bottom:1px dashed #e2e2e2;background:#FFFFFF;padding-bottom: 6px;padding-top: 6px;margin-top: 5px;}
.infor-bv p {padding: 8px;}
.ads{border:1px dashed #FC0;line-height:20px;background-color:white;padding-left:4px;padding-right:4px;padding-bottom:12px;padding-top:12px;}
.pyphai{width:300px;float:right;}
.pytrai{width:780px;float:left;}
@media screen and (max-width:1100px){.pyphai{margin:0 auto;float:none;margin-top:10px;width:780px;}
.fb{display:none;}
#body{min-width:200px;}
header{width:780px;}
.pymenu{width:780px;}
.pytrai{width:780px;margin:0 auto;float:none;}
.pyphai .ads-web{display:none}
.sayhi{max-width:760px}
}
@media screen and (max-width:780px){.pyphai{margin:0 auto;float:none;margin-top:10px;width:auto;}
.pytrai{width:auto;margin:0 auto;float:none;}
header{width:auto;}
.pymenu{width:100%;}
.sayhi{max-width:100%}
}
.clear{clear:both;display:block;height:0;line-height:0;font-size:0;color:#fff;}
.ads{border:1px dashed #FC0;padding-left:4px;padding-right:4px;padding-bottom:12px;padding-top:12px;
line-height:20px;background-color:white;}
.fb{background:#fff;margin-top:5px;}
.gamehayandroid .textlink{max-width:1100px;min-width:200px;margin:auto;text-align: justify;padding: 6px;}
ul.sub-menu li{border-bottom:1px solid #e2e2e2;padding:12px 8px 12px 12px;list-style:none;background:#fff;}
li.sub-category{list-style:none;padding:8px;background:#fff;margin-top:5px;font-weight:700;}
.article{list-style:none;padding:12px;overflow:hidden;background:#fff;margin-top:5px;font-weight:700;}
.green{border-bottom:#4CAF50 solid 2px!important;}
.green a{color:#4CAF50}
.red{border-bottom:#c00000 solid 2px!important;}
.red a{color:#c00000}
.blue{border-bottom:#2CAAD3 solid 2px!important;}
.blue a{color:#2CAAD3}
.purple{border-bottom:#A13EDE solid 2px!important;}
.purple a{color:#A13EDE}
.yellow{border-bottom:#DCB51B solid 2px!important;}
.yellow a{color:#DCB51B}
.thongbao{border:1px dashed red;padding:4px;line-height:20px;background-color:white;margin-top:5px;}
table tbody tr th{text-align:left;}
.faq-download .faq-collapsible {
  color: #595959;
  cursor: pointer;
  padding: 18px;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
}

.faq-download .faq-active, .faq-collapsible:hover {
  background-color: #f9f9f9;
  color: #595959;
}

.faq-download .faq-content {
  padding: 0 32px;
  overflow: hidden;
  background-color: #f9f9f9;
  display:none;
}
.faq-download .faq-content p{
  margin: 0 0 18px 0;
  line-height: 22px;
}

.faq-download {
  border: 1px solid #dee2e6!important;
  background: #fff;
}
.alert-warning {
    color: #4c0000;
    background-color: #ffcdcd;
    border-color: #ffbaba;
    position: relative;
    padding: .75rem 1.25rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
    text-align: center!important;
}
th.w100 {
    min-width: 100px;font-weight: 350;
}
img.download-image {
    border-radius: 15%;
    margin: 6px auto 16px;
    display: block;
    width:90px;
    height:90px;
}
.language-switcher {
    margin-top: 10px;
}

.language-switcher select {
    padding: 5px;
    font-size: 14px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.language-switcher select:hover {
    border-color: #0073aa;
}
.mt-3,.my-3{margin-top:1rem!important}
.mr-3,.mx-3{margin-right:1rem!important}
.mb-3,.my-3{margin-bottom:1rem!important}
.ml-3,.mx-3{margin-left:1rem!important}
.mt-2,.my-2{margin-top:.5rem!important}
.mr-2,.mx-2{margin-right:.5rem!important}
.mb-2,.my-2{margin-bottom:.5rem!important}
.ml-2,.mx-2{margin-left:.5rem!important}
.ml-auto,.mx-auto{margin-left: auto!important;}
.mr-1,.mx-1 {margin-right: .25rem!important;}
.mb-1,.my-1 {margin-bottom: .25rem!important;}
.svg-5{width: 1.25rem;height: 1.25rem;}
svg {overflow: hidden;vertical-align:text-top;}
.font-weight-semibold {font-weight: 500!important;}
.d-flex{display: flex!important;}
.text-muted {color: #777!important;font-size: 0.85rem;font-weight: 400;display: inline-block}
.text-link-download {font-size: .85rem;}
.collapse:not(.show){display:none}
.collapsing{position:relative;height:0;overflow:hidden;transition:height .35s ease}
@media (prefers-reduced-motion:reduce){.collapsing{transition:none}
}
.btn{display:inline-block;font-weight:500;color:#212529;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.35rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}
@media (prefers-reduced-motion:reduce){.btn{transition:none}
}
.btn:hover{color:#212529;text-decoration:none}
.btn.focus,.btn:focus{outline:0;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}
.btn.disabled,.btn:disabled{opacity:.65}
a.btn.disabled,fieldset:disabled a.btn{pointer-events:none}
.btn-secondary,.btn-secondary:not(:disabled):not(.disabled):active:focus{color:#fff;background-color:#2A6525!important;border-color:#2A6525!important;border-radius: 20px;}
.btn-primary,.btn-primary:not(:disabled):not(.disabled):active:focus{color:#fff;background-color:#007bff!important;border-color:#007bff!important}
.btn-secondary svg,.btn-secondary:not(:disabled):not(.disabled):active:focus svg{fill:#fff}
table.info-top-topcontent {display: inline-block;padding: 10px 0px;line-height: 38px;}
.sayhi { padding: 10px; background: #fff; margin-top: 5px; margin-left: auto; margin-right: auto; background-position: right; background-repeat: no-repeat; background-size: contain; }
h1.sayhi-h1{font-size:19px;text-align:center;margin-bottom:10px;margin-top:6px}
h2.sayhi-h2{text-align:center;font-weight:600;margin:16px auto}
.sayhi p.text-notice{margin-bottom:9px;line-height:22px}
.phienban{padding:2px 5px;font-size:11px;background:#E6F5E7;color:#167E49;border-radius:4px}
.kichthuoc{padding:2px 5px;font-size:11px;text-transform:uppercase;background:#E0EDFF;color:#006DB8;border-radius:4px}
span.border{padding:2px 4px;font-size:13px;border-radius:5px;color:#fff;margin-right:.25rem}
.text-download {
    padding: 1rem;
    border-width: 1px;
    color: rgb(138, 109, 59) !important;
    background-color: rgb(252, 248, 227) !important;
    border-width: 1px !important;
    border-style: solid !important;
    border-color: rgb(250, 235, 204) !important;
    border-image: initial !important;line-height: 24px;
}
.text-center {text-align: center!important;}
.button-youtube {
    padding: 8px 12px;
    border-radius: 50rem!important;
    color: #fff;
    background-color: #f54545;
    border-color: #e84646;
    font-weight: 600;
    display: inline-block;
    border: 1px solid transparent;
}
.button-tiktok { padding: 8px 12px; border-radius: 50rem!important; color: #fff; background-color: #000000; border-color: #565656; font-weight: 600; display: inline-block; border: 1px solid transparent; }
.button-telegram {
    background-color: #17a2b8;
    padding: 8px 12px;
    border-radius: 50rem!important;
    color: #fff;
    font-weight: 600;
    display: inline-block;
    border: 1px solid transparent;
    border-color: #17a2b8;
}
span.tag-green { background: #30d614; color: #fff; padding: 2px 10px; border-radius: 12px; font-weight: 400; font-size: 0.82rem;}
.download-gg-border {height: 2.3rem; margin: auto; border: 1.5px solid #888; padding: 2px 10px; border-radius: 10px;}
.adsense{display: block;height: 280px;}
.fly-icon {
    width: 80px;
    position: fixed;
    right: 00px;
    top: 50%;
    opacity: 0;
    transition: opacity 2s ease-in-out;
    transform: translateY(-50%);
    z-index: 999;
    pointer-events: none;
}
.close-icon {
    position: absolute;
    top: -10px;
    right: 8px;
    cursor: pointer;
    font-size: 20px;
    font-weight: bold;
    border-radius: 50%;
    width: 23px;
    height: 23px;
    text-align: center;
    color: #969696;
    background: #c5c5c5cf;
}
.hidden {
  display: none;
}
.fly-icon.show {
  opacity: 1;
  pointer-events: auto;
}
img#randomImage {
    height: 80px;
}
/* Sidebar Menu Styles */
.sidebar {
    height: 100%;
    width: 0;
    position: fixed;
    top: 0;
    left: 0;
    background-color: #333;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
    z-index: 99999;
}

.sidebar a {
    padding: 8px 8px 8px 32px;
    text-decoration: none;
    font-size: 18px;
    color: white;
    display: block;
    transition: 0.3s;
}

.sidebar a:hover {
    color: #f1f1f1;
}

.sidebar .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

.openbtn {
    font-size: 20px;
    cursor: pointer;
    background-color: #333;
    color: white;
    padding: 10px 15px;
    border: none;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 1001;
}

.openbtn:hover {
    background-color: #444;
}

#main {
    transition: margin-left .5s;
    padding: 16px;
}

.dropdown {
    position: relative;
}

.dropdown-content {
    display: none;
    background-color: #444;
    padding-left: 40px;
}

.dropdown:hover .dropdown-content {
    display: block;
}

@media screen and (max-height: 450px) {
    .sidebar {padding-top: 15px;}
    .sidebar a {font-size: 18px;}
}
/* Tinh chỉnh header để khớp với viền và màu nền trong hình */
.product-header {
    display: flex;
    align-items: center;
    gap: 15px;
}

/* Điều chỉnh kích thước và viền của icon để giống hình */
.product-icon {
    width: 90px;
    height: 90px;
    border-radius: 12%; /* Điều chỉnh bo góc để giống icon trong hình */
    object-fit: cover;
    border: 2px solid #d9d9d9; /* Viền xám nhạt hơn */
}

/* Tinh chỉnh tiêu đề để khớp với font và màu trong hình */
.product-title {
    font-size: 20px; /* Giảm nhẹ font-size để khớp hơn */
    font-weight: 600;
    color: #333333; /* Màu chữ đậm hơn */
    margin: 0;
    line-height: 1.3;
    flex-grow: 1; /* Cho phép tiêu đề giãn ra */
}

/* Style cho container chính để khớp với viền và bo góc dưới */
.product-info-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0;
    background: #ffffff;
    border-radius: 8px; /* Bo góc toàn bộ container */
    overflow: hidden; /* Đảm bảo viền và bo góc áp dụng đúng */
}

/* Tinh chỉnh bảng thông tin để khớp với khoảng cách và màu */
.product-details {
    border: 1px solid #e0e0e0; /* Viền giống hình */
    border-radius: 8px; /* Bo góc dưới */
}

.product-table th,
.product-table td {
    padding: 8px 12px;
    font-size: 14px;
    color: #666666; /* Màu chữ nhạt hơn để giống hình */
}

.product-table {
    table-layout: fixed;
    width: 100%;
}

.product-table th {
    font-weight: 500;
    width: 120px;
    text-align: left;
    color: #444444; /* Màu tiêu đề đậm hơn */
}

.product-table td {
    word-break: break-word;
    color: #757575; /* Màu dữ liệu nhạt hơn */
    text-align:  right;
}
/* Style cho dòng Requires với biểu tượng Android */
.require-row td {
    display: flex;
    align-items: center;
    gap: 5px;
}

.require-row img {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    filter: brightness(0) saturate(100%) invert(48%) sepia(79%) saturate(2476%) hue-rotate(86deg) brightness(95%) contrast(86%); /* Màu xanh lá giống icon Android */
}

/* Responsive design tinh chỉnh */
@media screen and (max-width: 768px) {
    .product-header {
        text-align: center;
    }

    .product-icon {
        margin-bottom: 10px;
    }

    .product-title {
        font-size: 18px;
    }

    .product-table th,
    .product-table td {
        padding: 6px 8px;
        font-size: 13px;
    }
}
.simple-header {
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* buttons */
.btn-menu,
.btn-search {
    position: absolute;
    background: none;
    border: none;
    font-size: 22px;
    cursor: pointer;
    color: #333;
}

.btn-menu {
    left: 12px;
}

.btn-search {
    right: 12px;
}

/* logo */
.header-logo img {
    height: 36px;
}

/* search box */
.header-search {
    display: none;
    padding: 10px;
    border-bottom: 1px solid #eee;
    background: #fff;
}

.header-search input {
    width: 93%;
    padding: 8px 12px;
    font-size: 15px;
    border: 1px solid #ddd;
    border-radius: 6px;
}