/*
Theme Name: Giovang
Theme URI: 
Author: Dev
Author URI: https://wordpress.org
Version: 1.3
*/

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: #F7FCFF1A;       /* Background of the track */
}

::-webkit-scrollbar-thumb {
  background: #F7FCFF4D;          /* Color of the thumb */
  border-radius: 6px;        /* Round corners */
}

::-webkit-scrollbar-thumb:hover {
  background: #555;          /* Color when hovering */
}
body{
    overflow-x: hidden;
    color: #F7FCFFB2;
    font-size: 14px;
}
img{
    max-width: 100%;
    height: auto;
}
h1{
	font-size: 28px;
}
h2{
	font-size: 22px;
}
h3{
    font-size: 18px;
}
h4{
    font-size: 16px;
}
a{
    text-decoration: none;
}
h1, h2, h3, h4, h5, h6{
    color: #fff;
}
h1, h2, h3, h4, h5, h6, b, strong{
    font-weight: 700;
}
.fw-semibold{
    font-weight: 600;
}
table, iframe{
    width: 100%;
}
blockquote { border-left: 4px solid #fff; color: #F7FCFFB2; background: #141517; padding: 1rem 1.5rem; margin-bottom: 1.25rem; border-radius: 0 1rem 1rem 0; font-style: italic;}
table {
    border-collapse: collapse;
    margin-bottom: 15px;
}
table td, table th {
    padding: 10px;
    border: 1px solid #262626;
}
table tr th {
    background: #141517;
    color: #fff;
}
table tr:nth-child(even) td {
    background: #14191d;
}
table tr:hover td{
    background: #1d2327;
}
.aligncenter {
    margin: 20px auto;
}
.wp-caption-text {
    padding: 5px;
}
.image-cover{
    padding-top: 65%;
    position: relative;
    overflow: hidden;
}
.image-cover img{
    bottom: 0;
    font-family: "object-fit: cover;";
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 50%;
    object-position: 50% 50%;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}
.aligncenter {
    text-align: center;
}
.wp-caption-text {
    font-style: italic;
}
.rank-math-breadcrumb p{
    margin: 0;
}

#header.fixed-header{
    background-color: #121212;
    position: fixed !important;
    left: 0;
    right: 0;
    top: 0;
    max-width: 100%;
    z-index: 9999;
    border-radius: 0;
    margin: 0 !important;
}
.logo-site{
	margin-bottom: -10px;
	display: block;
}
.breadcrumbs {
    color: #fff;
}
.breadcrumbs a {
    text-decoration: none;
}
#toc_container.toc_black {
    background: #28292E;
    border-color: #28292E;
    border-radius: 15px;
}
#toc_container .toc_list a {
    color: #C7DEF5;
    font-weight: 600;
    font-size: 16px;
    padding: 10px;
    display: block;
    border-radius: 10px;
}
#toc_container .toc_list a:hover{
    background: #1C2127;
    text-decoration: none;
}
.toplists-page a{
	color: #fff;
}
.toplists-page .toplist-row .btn-outline-warning:hover {
    color: #fff;
}
.toplist-row .promotion_text h4{
	font-size: 16px;
}
.topfive-card .promotion_text h4, .toplist-row .promotion_text ul li{
	font-size: 14px;
}
.topfive-card .promotion_text h4{
    font-weight: 500;
}
.topfive-card h4.name-brand{
    margin: 0 !important;
    margin-right: 6px !important;
}
.topfive-card .promotion_text ul li{
	font-size: 10px;
}
.topfive-card .promotion_text ul li:before, .toplist-row .promotion_text ul li:before{
	content: "";
	width: 10px;
	height: 10px;
	background: url('assets/images/icon-check-tl.png') no-repeat center center;
	background-size: contain;
}
.toplist-row .promotion_text ul li:before{
	background-image: url('assets/images/icon-check-green-tl.png');
	    top: 6px;
}
.topfive-card, .topfive-card .bg-dark {
    background: #121212 !important;
}
.topfive-card .rank-badge, .toplist-row .rank-badge {
    background: url(assets/images/bg-number-normal-tl.svg) no-repeat center center;
    background-size: contain;
    font-size: 14px;
    text-align: center;
    padding: 0px 16px 3px;
    left: 10px;
    top: 0px;
}
.toplist-row .rank-badge {
    top: -8px;
    left: 15px;
}
.nhacai-star span.fw-bold {
    color: #fff;
    font-weight: 400 !important;
}
.devvn-topfive-wrapper .swiper-wrapper .swiper-slide, .devvn-topfive-wrapper .topfive-card  {
    height: 100%;
}
.topfive-card .btn{
	font-weight: 500 !important;
	position: relative;
	border: 0;
    font-size: 14px;
}
.topfive-card .btn-wrapper{
	background: linear-gradient(to top, #5F5F5F, transparent);
	padding: 1px;
	padding-top: 0;
	border-radius: 99px;
}
.devvn-toplist-wrapper .toplist-row {
    background: #202023CC !important;
    border-radius: 15px !important;
}
.devvn-toplist-wrapper .toplist-row .name-brand{
	font-size: 24px !important;
}
.toplists-home {
	background: #171717;
    border-radius: 15px;
}
.toplists-home .title-box *{
	font-size: 14px;
	color: #fff;
	font-weight: 600;
	text-transform: capitalize;
}
.toplists-home .title-box h2 {
    background: #171717;
    padding: 0px 20px;
    display: inline-block;
    position: relative;
    z-index: 1;
}
.toplists-home .title-box {
    margin-bottom: 20px;
    position: relative;
}
.toplists-home .title-box:before, .toplists-home .title-box:after {
    content: "";
    height: 1px;
    position: absolute;
    left: 0;
    width: 50%;
    background: linear-gradient(to left, #D9D9D9, transparent);
    top: 9px;
}
.toplists-home .title-box:after {
    background: linear-gradient(to right, #D9D9D9, transparent);
    left: auto;
    right: 0;
}
.toplists-home .swiper-pagination span.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #fff !important;
    width: 40px;
    border-radius: 99px;
}
.toplists-home .swiper-pagination span.swiper-pagination-bullet {
    background: #F7FCFF4D;
}
.toplists-home .swiper-pagination {
    text-align: right;
}
.toplist-row .btn-outline-warning{
	 background: linear-gradient(to right, #B4822C, #F4E076, #C49839);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  border-color: #C49839;
}
.toplist-row .btn-outline-warning:hover {
    background: linear-gradient(to right, #B4822C, #F4E076, #C49839);
}
.toplist-row .btn-secondary{
	border: 0 !important;
}
.devvn-toplist-wrapper{
	margin-top: 15px;
}
.toplist-row .p-3 {
    padding: 10px !important;
}
.toplist-page h1.entry-title:before{
    content: "";
    background: url(/wp-content/themes/GioVang/assets/images/icon-toplist-page.svg) no-repeat center center;
    background-size: contain;
    width: 27px;
    height: 27px;
    display: inline-block;
}
.football-widget-section h1.entry-title{
    font-size: 18px;
        display: flex;
    align-items: center;
    gap: 5px;
}
.football-widget-section h1.entry-title:before{
    background-image: url(assets/images/icon-calendar.png);
    width: 24px;
    height: 24px;
}

.devvn-toplist-wrapper .toplist-row:nth-child(1) .rank-badge,
.devvn-topfive-wrapper .swiper-slide:nth-child(1) .topfive-card .rank-badge{
	background-image: url(assets/images/bg-number-tl.svg)
}
.devvn-toplist-wrapper .toplist-row:nth-child(2) .rank-badge,
.devvn-topfive-wrapper .swiper-slide:nth-child(2) .topfive-card .rank-badge{
	background-image: url(assets/images/bg-number-silver-tl.svg)
}
.devvn-toplist-wrapper .toplist-row:nth-child(3) .rank-badge,
.devvn-topfive-wrapper .swiper-slide:nth-child(3) .topfive-card .rank-badge{
	background-image: url(assets/images/bg-number-cu-tl.svg)
}
.menu-footer .nav a {
    text-decoration: none;
}
.menu-footer .nav {
    gap: 20px;
    margin-bottom: 20px;
    margin-top: 5px;
}
.footer-content a {
    color: #F7FCFFB2;
}
.social-footer .nav{
	gap: 10px;
}
.title-footer {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 10px;
}
ul.menu-lienket li a {
    text-decoration: none;
    color: #F7FCFFB2;
    padding: 5px;
    display: block;
}
ul.menu-lienket li a:hover, .footer-content a:hover{
    color: #fff;
}
ul.menu-lienket {
    padding: 0;
    list-style: none;
}
#footer.text-light{
	color: #F7FCFFB2 !important;
	background: #121212 !important;
}
#mobile_menu_toggler{
    float: right;
    width: 34px;
    height: 34px;
    display: none;
    cursor: pointer;   
}
#mobile_menu {
    display: none;
    background-color: #121212;
    padding: 0px;
    z-index: 100000;
    position: absolute;
    width: 100%;
    top: 100%;
    left: 0;
}
#mobile_menu a.slot-image {
    margin: 10px;
    display: inline-block;
}
@media (max-width: 991px){
    #mobile_menu_toggler {
        display: block;
    }
}
#mobile_menu ul li i{
    width: 32px;
    height: 32px;
    text-align: center;
    font-size: 10px;
    line-height: 30px;
    margin-right: 10px;
    color: #FFEB39;
    z-index: 9;
    position: absolute;
    right: 0;
}
.m_nav_ham {
    width: 24px;
    height: 2px;
    background: #FFEB39;
    margin: 5px auto;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -ms-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.m_nav_ham_1_open {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    margin-top: 13px;
}
.m_nav_ham_2_open {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    margin-top: -7px;
}
.m_nav_ham_3_open {
    opacity: 0;
}
#mobile_menu ul {
    margin: 0;
    list-style: none;
        padding: 0;
    width: 100%;
    float: left;
}
#mobile_menu ul li {
    margin: 0;
    text-align: left;
    width: 100%;
    float: left;
}
#mobile_menu > ul > li a {
    background: #161A1F;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}
#mobile_menu > ul > li > a:hover{
    background: #2d3540;
}
#mobile_menu ul ul li  a:hover{
    background: #171717;
}
#mobile_menu > ul > li  ul li a{ 
    background: transparent;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
}
#mobile_menu ul li a {
    color: #ccc;
    font-size: 14px;
    line-height: 1.7em;
    display: block;
    position: relative;
    padding: 12px 30px;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.3);
    -webkit-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.2s ease-out;
    text-transform: uppercase;
}
#mobile_menu ul ul li a {
    padding: 10px 50px;
}
#mobile_menu ul ul ul li a {
    padding: 10px 70px;
}
#mobile_menu ul li a:hover {
    color: #eee;
}
#mobile_menu ul li ul {
    display: none;
}
#primarymb-menu li a{
    text-align: left;
}
#primarymb-menu li img{
    display: none;
}
#mobileBottomNav{
    background: #212121;    
    box-shadow: inset 0px 2px 2px #383838;
    padding: 10px;
}
#mobileBottomNav li:nth-child(3) a {
    background: linear-gradient(180deg, rgba(0, 140, 255, 0.49) 0%, rgba(38, 78, 255, 0.49) 100%);
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    color: #fff;
}
#mobileBottomNav li a{
    text-align: center;
    text-transform: capitalize;
    font-size: 10px;
    color: #F7FCFFB2;
    width: 70px;
    height: 70px;
    /* font-family: 'Roboto Condensed', sans-serif; */
    font-weight: 500;
    letter-spacing: -0.25px;
}
#mobileBottomNav li.active a {
    color: #fff;
}
#mobileBottomNav li a img.inactive {
    display: block;
}
#mobileBottomNav li a img.active {
    display: none;
}
#mobileBottomNav li:nth-child(3).active a{
    background: linear-gradient(to bottom, #008CFF, #264EFF);
}
#mobileBottomNav li.active a img.inactive {
    display: none;
}
#mobileBottomNav li.active a img.active {
    display: block;
}
#posts-container .post-item {
    border-radius: 10px;
    overflow: hidden;
    background: #202023CC !important;
}
span.widget-title {
    text-transform: uppercase;
    color: #fff;
    font-weight: 700;
    margin-bottom: 10px;
    display: block;
    font-size: 18px;
}
span.widget-title span{
background: linear-gradient(to right, #B4822C, #F4E076, #C49839);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.rpt-widget, .content-single, .taxonomy-description {
    background: #202023CC;
    border-radius: 10px;
    padding: 15px;
    color: #fff;
}
.content-single .wp-caption {
    width: 100% !important;
}
.rpt-widget .rpt-meta, .rpt-widget li a {
    color: #fff;
}
.rpt-widget li {
    border-bottom: 1px solid #333;
}
.rpt-widget li:last-child{
    border: 0;
    padding-bottom: 0;
}
.rpt-widget li:first-child{
    padding-top: 0;
}
.main-content-section .content-home{
    border-radius: 20px;
    background: #1F1F1F;
}
.main-content-section .toc-content-wrapper .col-inner{
    border-radius: 18px;
    background: #28292E99;
}
#toc_container_custom .toc_list_custom{
    list-style: none;
    padding: 0;
    margin: 0;
}
#toc_container_custom .toc_list_custom>li {
    margin-bottom: 8px;
    list-style: none;
    margin-left: 0
}

#toc_container_custom .toc_list_custom>li a {
    font-weight: 400;
    color: #F7FCFFB2;
    display: flex;
    align-items: center;
    padding: 9px 15px;
    border-radius: 12px;
    text-decoration: none;
    background: #141517;
}
#toc_container_custom .toc_list_custom>li a:hover {
    background-color: #F7FCFF1A;
    color: #fff;
}

#toc_container_custom .toc_list_custom>li:first-child a {
    font-weight: 700;
}

#toc_container_custom .toc_list_custom>li:last-child {
    margin-bottom: 0;
}
#toc_container_custom .toc_list_custom>li a.active {
    background-color: #F7FCFF1A;
    color: #fff;
    font-weight: 700;
}
.overlow-content{
    overflow: auto;
}
.toc-content .overlow-content .fcontent-section{
    background-color: #141517;
    border-radius: 12px;
    padding: 10px;
    margin-bottom: 1rem;
}
.fcontent-section .wp-caption {
    width: 100% !important;
}
.overlow-content a {
    color: #F7FCFFB2;
    text-decoration: underline;
}
span.title-toc {
    font-size: 18px;
    margin-bottom: 15px;
    display: block;
    font-weight: 700;
    color: #fff;
}
.post-item h3{
    font-size: 14px;
}

article.post-item{
    background: #141517;
    border-radius: 10px;
}
.section-posts .box-news{
    background: #1F1F1F;
    border-radius: 20px;
}
.post-item img {
    border-radius: 10px;
}
.post-item.featured-post h3{
    font-size: 20px;
}
a.xem-them-link{
    color: #F7FCFFB2;
}
span.sp-card__date small {
    font-size: 10px;
}
.football-widget-section .embed-fixture .fixture-container{
    background: transparent;
}
.football-widget-section .box-fillter-date {
    border-radius: 20.932px;
}
.football-widget-section .embed-fixture .fixture-container .box-fillter-type .type-item:hover, .football-widget-section .embed-fixture .fixture-container .box-fillter-type .type-item.active{
    border-radius: 12px;
}

.football-widget-section .type-item{
    position: relative;
}
.football-widget-section .type-item:before{
        content: "";
    position: absolute;
    left: 1px;
    top: 0;
    background: #262727;
    height: 100%;
    width: 1px;
}
.football-widget-section .type-item:hover + .type-item:before, .football-widget-section .type-item.active + .type-item:before,
.football-widget-section .type-item:hover:before, .football-widget-section .type-item.active:before{
    display: none;
}
.football-widget-section .embed-fixture .fixture-container{
    max-width: 100%;
}
.single-post .fixture_football_h2h .fixture-h2h-wrapper .fixture-h2h-content__match, 
.single-post .fixture_football_recent .fixture-h2h-wrapper .fixture-h2h-content__match,
.single-post .fixture_football_h2h .fixture-h2h-wrapper, 
.single-post .fixture_football_recent .fixture-h2h-wrapper {
    border-color: #333 !important;
}
.single-post .fixture_football_h2h .fixture-h2h-wrapper .fixture-h2h-content__league, 
.single-post .fixture_football_recent .fixture-h2h-wrapper .fixture-h2h-content__league {
    background-color: #333;
    border-bottom: 1px solid #333;
}
@media(max-width: 880px){
	.toplist-row .rank-badge{
		top: 0;
	}

    header#header {
        background: transparent;
        height: auto;
        box-shadow: none;
    }
    #header .slot-image {
        font-size: 11px;
        height: auto;
        gap: 5px;
        width: max-content;
    }
    #header .slot-image img {
        width: 30px;
    }
    #mobile_menu_toggler {
        padding-top: 5px;
        margin-left: 8px;
    }
    #footer{
        padding-bottom: 120px !important;
    }
    ul.menu-lienket li a{
        padding-left: 0;
    }
    .medium-text-center{
        text-align: center !important;
    }
    .medium-text-center .nav{
        justify-content: center;
    }
    .medium-text-center .nav li{
        display: inline-block;
    }
   
    .devvn-toplist-wrapper .toplist-row .name-brand{
        font-size: 16px !important;
    }
    .main-content-section .toc-content-wrapper .col-inner{
        margin-bottom: 10px;
    }
    #toc_container_custom .toc_list_custom>li a{
        font-size: 12px;
    }
}
@media (max-width: 600px){
    h1 {
        font-size: 26px;
    }
    h2{
        font-size: 20px;
    }
    h3{
        font-size: 16px;
    }
    h4{
        font-size: 14px;
    }
    .post-item h3 {
        font-size: 10px;
        margin-bottom: 2px;
    }    
    article.post-item {
         padding: 10px !important;
         gap: 10px !important;
    }
    article.post-item p.card-text {
        font-size: 10px;
        margin-bottom: 0px;
    }
    .toplist-row .p-3.promotion_text {
        padding-top: 0px !important;
    }
    .toplist-row .promotion_text h4, .toplist-row{
        font-size: 12px;
    }
    .toplist-row .promotion_text ul li{
        font-size: 10px;
    }
    .devvn-toplist-wrapper .toplist-row .name-brand{
        font-size: 14px !important;
        margin-right: 6px;
    }
    .toplist-row .btn {
        font-size: 10px;
        padding: 5px !important;
    }
    .toplist-row .promotion_text h4{
        display: none;
    }
    .toplist-row .pb-md-0{
        padding-bottom: 0 !important;
    }
    .topfive-card .promotion_text h4{
        display: none;
    }
    .topfive-card.card .card-footer .btn {
        font-size: 10px;
        padding: 6px;
        border-radius: 8px !important;
        font-weight: 700;
    }
    .topfive-card.card .card-footer .btn-wrapper{
        border-radius: 8px !important;
    }
    .topfive-card.card .card-footer {
        width: 23%;
        padding: 6px 0 0 !important;
    }
    .topfive-card.card .card-body{
        width: 61%;
        font-size: 10px;
    }
    .topfive-card h4.name-brand{
        font-size: 12px;
    }
    .topfive-card.card .card-img-top {
        width: 16%;
        padding: 0 !important;
    }
    .topfive-card.card {
        flex-flow: row;
        background: transparent !important;
        align-items: flex-start;
        border: 0;
    }
    .topfive-card .rank-badge, .toplist-row .rank-badge{
        font-size: 12px;
    }
    .topfive-card .rank-badge{
        left: 0;
        top: -8px;
    }
    .topfive-card.card .card-footer .btn.btn-cuocngay{
        background: #F7FCFF4D !important;
    }
    .devvn-topfive-wrapper.swiper .swiper-wrapper .swiper-slide {
        padding: 8px;
        background: #F7FCFF1A;
        border-radius: 10px;
    }
    .devvn-topfive-wrapper.swiper .swiper-wrapper {
        display: flex;
        flex-flow: column;
        gap: 10px;
    }
    .toplist-page h1.entry-title {
        font-size: 16px;
    }
    .is-tlp {
        display: none !important;
    }
    .toplists-page .nhacai-star.is-tlp {
        display: flex !important;
        font-size: 10px;
    }
    .toplists-page .nhacai-star.is-tlp span.fw-bold {
        margin-right: 5px !important;
    }
    .toplists-page .nhacai-star {
        display: none;
    }
    .toplists-page .btn-secondary {
        display: none;
    }
    .toplists-page .toplist-row .btn-outline-warning {
        background: #5F5F5F;
        border-color: #5F5F5F;
        -webkit-background-clip: unset;
        border-radius: 4px !important;
        color: #F7FCFF4D;
    }
}