/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
#masthead {
    background-color: #063b42;
}
.off-canvas .nav-vertical>li>a {
    padding-bottom: 15px;
    padding-top: 15px;
}
.flex-col .hide-for-medium .flex-center, .flex-col .hide-for-medium .flex-center video {
    width: 100%;
}
.header-block a {
    display: grid;
}
.page-id-4716 div.row.row-large.row-divided, .page-id-4716 #main #content header, #comments {
     display: none; 
}
.page-id-4716 .swiper-button-prev,
.page-id-4716 .swiper-button-next {
    display: none; /* Or opacity: 0; or pointer-events: none; */
}
.league-info p {
     margin: 0 !important; 
}
.match-info {
    padding: 10px !important;
}
span.red-text {
    color: red;
}
@media only screen and (min-width: 49em) {
    li.post-meta .meta-item {
        top: 7px;
    }
    li.post-meta a {
        color: #334862;
        font-weight: 700;
        font-style: normal;
    }
    .category-8 .page-wrapper {
        padding-bottom: 30px;
        padding-top: 130px;
    }
        .match-info, .match-detail {
    display: block !important;
    }
    .mobile-swiper-container .swiper-wrapper {
        height: 165px;
    }
    .league-info {
    text-align: center;
    width: 100% !important;
    position: relative;
    display: block !important;
    float: left;
    min-width: 330px;
    /*border: 1px red solid;*/
    margin: 0px;
    font-weight: bold;
}
.match-detail {
    display: block !important;
    position: relative;
    /*border: 1px blue solid;*/
    float: left;
    align-items: center;
        text-align: center;
        min-width: calc(100%/3);
        max-width: calc(100%/3);
    }
    .match-detail p{
        float: left;
        /*border: 1px solid;*/
        width: 100%;
        display: block;
        float: left;
        margin: 0;
    }
    .home-team, .away-team {
        /*border: 1px green solid;*/
        position: relative;
        display: block !important;
        float: left;
        font-size: 12px;
        min-width: calc(100%/3);
        max-width: calc(100%/3);
        flex: 1;
        /*display: flex;*/
        /*flex-direction: column;*/
        align-items: center;
        text-align: center;
        margin-top: 0;
        margin-bottom: 0;
    }
    /*************** CSS POSTS HERE  ***************/
/*    .mag-box .posts-items {*/
/*    clear: both;*/
/*    margin: 0 -2%;*/
/*}*/
/*    .miscellaneous-box .posts-items li:first-child, .miscellaneous-box .posts-items li:nth-child(2) {*/
/*    clear: both;*/
/*}*/
ul.post-root-item {
    display: table-row;
    border: 1px solid rgb(169,184,195) !important;
}
ul.post-root-item, ul.posts-items {
    list-style-type: none;
}
.mag-box .posts-items {
    width: 100%;
    margin: auto;
}
li.post-sub-item {
    width: 100% !important;
    font-size: 1.25em;    
    margin-bottom: 5px !important;
    background-color: #f0f0f0 !important;
}
.mag-box .posts-items li {
    width: calc(100% / 3);
    margin: 0;
    float: left;
    /*margin-top: 24px;*/
    padding: 0 5px;
}
/*.miscellaneous-box li:not(:first-child) .post-thumb {*/
/*    margin: 0 0 5px !important;*/
/*}*/

/*.mag-box li:not(:first-child) .post-thumb {*/
/*    float: left;*/
/*    margin-right: 15px;*/
/*}*/
.post-thumb {
    position: relative;
    height: 100%;
    display: block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
    transition: opacity 0.2s;
}
.mag-box .post-meta {
    margin: 0 0 3px;
}
/*.post-meta, .post-meta a:not(:hover) {*/
/*    color: #666;*/
/*}*/
.post-meta {
    margin: 10px 0 8px;
    font-size: 12px;
    overflow: hidden;
}
.trending-post.trending-sm {
    display: block;
    width: 14px;
    height: 14px;
    line-height: 15px;
    font-size: 12px;
    float: left;
    top: 3px;
    position: relative;
}
.trending-post.tie-icon-bolt {
    width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    font-size: 12px;
    background: #F64E4E;
    color: #ffffff;
    border-radius: 100%;
    z-index: 4;
    display: inline-block;
}
.post-meta .meta-item {
    margin-right: 8px;
    display: inline-block;
}
.post-meta .meta-item {
    margin-right: 8px;
    display: inline-block;
}
.tie-alignright {
    float: right;
}
.post-meta .tie-alignright .meta-item:last-child {
    margin: 0 !important;
}

.post-meta .meta-item {
    margin-right: 8px;
    display: inline-block;
}
    /*************** END CSS POSTS  ***************/
    .page-id-4716 .entry-content {
        padding-bottom: 0;
        padding-top: 0;
    }
    .page-id-4716 .page-wrapper {
        padding-bottom: 0px;
        padding-top: 10px;
    }
    .page-id-4716 #main #content h2 {
        border-left: 5px #ff9d00 solid;
        padding-left: 10px;
        color: #063b42;
        width: 100% !important;
        float: left;
    }
    .footer {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 45px;
        background-color: #fafafa;
        border-top: 1px solid #ddd;
        z-index: 5;
        table-layout: fixed;
        display: none !important;
        flex-flow: row nowrap;
        justify-content: space-around;
        padding: 0 3%;
        box-sizing: border-box;
    }
    .nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a {
        color: #fafafa !important;
    }
    .mfp-content .nav-column>li>a,.mfp-content .nav-dropdown>li>a,.mfp-content .nav-vertical-fly-out>li>a,.mfp-content .nav>li>a {
        
    }
    .nav-dropdown-has-border .nav-dropdown {
        background-color: #063b42;
    }
    .nav>li {
        min-width: 100px;
    }
    .nav > li > a {
        color: #fafafa
    }
    .nav-box>li.active>a, .nav-pills>li.active>a {
        background-color: #ff9d00;
        border-radius: 10px 0px;
        line-height: 30px !important;
        box-shadow: 3px 0px deepskyblue;
    }
}

@media only screen and (max-width: 48em) {
    .match-info, .match-detail {
    display: block !important;
    }
    .mobile-swiper-container .swiper-wrapper {
        height: 165px;
    }
    .league-info {
    text-align: center;
    width: 100% !important;
    position: relative;
    display: block !important;
    float: left;
    min-width: 330px;
    /*border: 1px red solid;*/
    margin: 0px;
    font-weight: bold;
}
.match-detail {
    display: block !important;
    position: relative;
    /*border: 1px blue solid;*/
    float: left;
    align-items: center;
    text-align: center;
    min-width: calc(100%/3);
    max-width: calc(100%/3);
    }
    .match-detail p{
        float: left;
        /*border: 1px solid;*/
        width: 100%;
        display: block;
        float: left;
        margin: 0;
    }
    .home-team, .away-team {
        /*border: 1px green solid;*/
        position: relative;
        display: block !important;
        float: left;
        font-size: 12px;
        min-width: calc(100%/3);
        max-width: calc(100%/3);
        flex: 1;
        /*display: flex;*/
        /*flex-direction: column;*/
        align-items: center;
        text-align: center;
        margin-top: 0;
        margin-bottom: 0;
    }
    ul.post-root-item {
    display: table-row;
    border: 1px solid rgb(169,184,195) !important;
    }
    ul.post-root-item, ul.posts-items {
        list-style-type: none;
    }
    .mag-box .posts-items {
        width: 100%;
        margin: auto;
    }
    li.post-sub-item {
        width: 100% !important;
        font-size: 14px;    
        margin-bottom: 5px !important;
        background-color: #f0f0f0 !important;
        
    }
    .posts-items li.post-item, li.post-sub-item {
        margin-left: 0 !important;
    }
    .page-id-4716 .entry-content {
        padding-bottom: 0;
        padding-top: 0;
    }
    .page-id-4716 .page-wrapper {
        padding-bottom: 0px;
        padding-top: 5px;
    }
    .page-id-4716 #main #content h2 {
        border-left: 5px #ff9d00 solid;
        padding-left: 10px;
        color: #063b42;
    }
    #header {
        padding: 0;
    }
    div.post-sidebar, div.blog-share ,footer.entry-meta, div.entry-author.author-box {
        display: none;
    }
    .taxonomy-description {
        padding-top: 110px;
    }
    .header-bottom-nav.mobile-nav li:first-child, .header-bottom-nav.mobile-nav li:nth-child(2), .header-bottom-nav.mobile-nav li:nth-child(3), .header-bottom-nav.mobile-nav li:nth-child(4), .header-bottom-nav.mobile-nav li:nth-child(5) {
         width: calc(100%/5)!important;
    }
    #main-menu li {
        width: 100%;
        text-align: left;
    }
    .nav>li>a>i.icon-menu {
        font-size: 13px;
        content: url(/wp-content/uploads/mobile/menu.png);
        width: 50% !important;
    }
    
    .nav>li {
        list-style: none;
        margin: auto !important;
        padding: 0px 5px !important;
        min-width: 75px !important;
    }
    .nav>li.active>a {
        color: #063b42 !important;
        font-size: 13px;
    }
    .header-bottom-nav > li > a {
        font-size: 13px;
        line-height: 16px;
    }
    .nav>li.active {
        background-color: #ff8a00;
    }
    .nav>li, .nav>li>a {
        display: inline-block;
        text-align: center;
    }
    #logo {
        margin-left: calc((100% - 169px)/2);
    }
    .container {
        padding: 0;
    }
    .nav-center {
        background-color: #ffa800;
    }
    .header-block {
        background-color: #fafafa;
        margin: 0 !important;
    }
    .flex-left {
        margin-right: auto;
        left: 5px;
        position: absolute;
    }
    #masthead .flex-col.show-for-medium.flex-left {
        left: 0px;
    }
    #masthead .mobile-nav li {
        width: 24px;
        padding: 0 !important;
    }
    .logo-left .logo {
        margin-left: 30px;
        margin-right: 30px;
    }
    .nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a {
        color: #063b42;
        font-size: 13px !important;
    }
    .btn_home {
        background-image: url(/wp-content/uploads/mobile/football.png);
        width: 95px;
    }
    .btn_news {
        background-image: url(/wp-content/uploads/mobile/result.png);
        width: 95px;
    }
    .btn_keo {
        background-image: url(/wp-content/uploads/mobile/search.png);
        width: 95px;
    }
    .btn_tip {
        background-image: url("/wp-content/uploads/mobile/tips.png");
    }
    .footer a {
        background-color: #ffd480;
        color: #063b42;
        font-weight: bold;
        font-size: 14px !important;
    }
    .footer a div {
        height: 24px;
        flex: 0 0 auto;
        margin: 2px auto 1px;
        white-space: nowrap;
        background-size: 25%;
        background-repeat: no-repeat;
        background-position: center;
    }
    /*************** ADD MOBILE ONLY CSS HERE  ***************/
    .widget-visible iframe {
        bottom: 50px !important !important;
        height: 32px !important;
        width: 32px !important;
    }
    .footer {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 45px;
        background-color: #ffd480;
        border-top: 1px solid #ddd;
        z-index: 5;
        table-layout: fixed;
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-around;
        padding: 0 3%;
        box-sizing: border-box;
    }
    .badge {
        z-index: 0 !important;
    }
}