@font-face{
    font-family:"Sarun's JackSparrow";
    src:url("Sarun's JackSparrow.ttf");
}
.font{
      font-family:"Sarun's JackSparrow";
}
.bgwhite{background-color: #FFFFFF;border:none;}
.bgblue{background-color:	#00BFFF;}
.bgred{background-color: 	#DC143C;}
.bggray{background-color:#EEEEEE;}
.bgblack{background-color:#181818;}
.front{padding:15px;}
.logo{font-size:200px;
color: #f4511e;}

/*.row{margin-top:5px;}*/
.border-red{border:1px solid #FF0000;}
.border-blue{border:1px solid #0000FF;}

.mr-top30{margin-top:30px;}
.mr-bottom10{margin-bottom:10px;}
.mr-bottom30{margin-bottom:30px;}
.pd0{padding:0px;}
.pd5{padding-top:5px;}
.pd10{padding-top:10px;}
.pd20{padding-top:20px;}
.pd30{padding-top:30px;}
.pd40{padding-top:40px;}
.pd45{padding-top:45px;}
.pd46{padding-top:46px;}
.pd50{padding-top:50px;}
.pd60{padding-top:60px;}
.pd70{padding-top:70px;}
.pd80{padding-top:80px;}
.fred{color:red;}
.fgreen{color:green;}
.fgray{color:gray;}
.fyellow{color:yellow;}
.fblue{color:blue;}
.fwhite{color:white;}
.fblack{color:black;}
.display-none{  display:none; }
.img-center{display: block;
  margin-left: auto;
  margin-right: auto;}
#display-mobile{   display:none;   }

#display-mobile-search{	display:none;	}
#display-mobile .active,.imggrid.active{background-color: #077fe9;}
.mobile-font{font-size:10px;}
.flex{    flex-direction: row;}
.flex-row
{
    display: -ms-flexbox; /* IE 10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE 10 */
    flex-wrap: wrap;
}

.flex-column{
  width:33%;
  flex: 1 1 33%;
  padding:4px;
}   

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: red;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: red;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: red;
}
.adjust-content{justify-content: space-between;}
#error{max-width:550px;margin:0px auto;margin-top:80px;}
img.card-header{padding:0px;}
.line-clamp
{
	display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.detailcontent
{
	 display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.content img
{
    max-width:100%;
    height:auto;
    display:block;
    margin:0px auto;
    width:100%;
  
}
.content .title-detail
{
    position: absolute;
    bottom: 0;
    width: 96%;
    background: rgba(0,0,0,.6);
    color: #FFF;
    box-sizing: border-box;
    padding: 12px;
    margin: 0px;
    font-size: 20px;
}
.content .title-detail1
{
    position: absolute;
    bottom: 0;
    width: 92%;
    background: rgba(0,0,0,.6);
    color: #FFF;
    box-sizing: border-box;
    padding: 12px;
    margin: 0px;
    font-size: 20px;
}
.mrbt
{   margin-bottom:1rem; }
.menu3rd
{
    padding-right:0px;
    padding-left:0px;
}
.card-title
{
    max-height: 68px;
    
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.text-color
{
    color: #fa8b23;
    text-decoration: none;
}
.mw1000{max-width:1000px;margin:auto;}
#coverimg{display:none;}
#video{display:unset;}
.footer>ul{list-style-type: none;padding:0px;}
#resultsearch ul{list-style-type: none}
#resultsearch ul li{background-color:white;padding:5px;}
#resultsearch ul li:hover{background-color:yellow;}
/*.imgproduct{height:auto;}*/
.limitwidth{width:30%;margin:0px;padding-bottom:10px;}
.img-product{width:100%;}
/*.line-height{height:48px;}*/
#text_before_footer iframe{width:100%;}
#youtube iframe{width:100%;height:40vh;}
iframe{width:100%;height:500px;}
.mobile_menu{width:100%;}
.flex{display:flex;}
.navbar-dark .navbar-nav .nav-link{ color: #fa8b23; }
.img-search{height:34px;}
.subname{  font-size:11px; padding:0px; margin:0px; }
ul li a:hover {text-decoration: underline; color: #fa8b23;}
.mrg10{margin-top:10px;margin-bottom:10px;}

.fix-marker li::marker{font-size: 1rem;}
.wrapmenu{flex-flow: row wrap;}

#warning-message { display: none; }
@media only screen and (orientation:portrait){
    #wrapper { display:none; }
    #warning-message { display:block; }
   
}
@media only screen and (orientation:landscape){
    #warning-message { display:none; }
    /*.bg-image{
        transform: rotate(90deg);
        transform-origin: right top;
        width: 100vh;
        height: 100vw;
        overflow-x: hidden;
        position: absolute;
        top: 100%;
        right: 0;
    }*/
}
@media screen and (max-width: 576px)
{	
	
	.mobile-search-menu{display:flex;}
	.w100{width:100%;}
	
    .content .title-detail,.content .title-detail1
    {   width:91%; }
    #video
    { display:none; }
    #coverimg
    { display:unset; }
    .mrbt
    { height:192px;   }
    /*.img-product{height:45vh;}*/
    /*.img-product-name,.img-product-button{width:50%;}*/
    .img-product-button{text-align:right;}
    .line-height{height:auto;}
    #mid-menu-left{width:20%;}
    #mid-menu-right{width:80%;}
    #top-menu-left{width:60%;}
    #top-menu-right{width:40%;}
    .mobile_menu{width:50%;}
    .display-flex
    {  
        /*display: -webkit-inline-box;*/
        align-items: center;
        /*justify-content: center;*/
        flex-flow: row wrap;
        align-content: center;
    }
    #display-mobile{   display:unset;   }
    .card-body{padding: .25rem;}
    h4,h5{font-size:unset;}
    .mw1000{margin:unset;}
    .bg_league
    {
        max-height:1018px;
        height:1018px;        
    }
    .display_league
    {
        top:calc(100% - 89%);
        /*left:calc(100% - 94%);
        max-width:calc(100% - 11%);*/
        max-height:calc(90% - 12%);
    }
    #display-mobile-search{	display:block;	}
    .mobile-menu{display:block;}
}
/*@media screen and (max-width: 768px) and  */

@media screen and (min-width: 576px) and (max-width:767px)
{	
    .mobile-menu{display:block;}
    .mobile-search-menu{display:flex;}
    .w100{width:100%;}
	#display-mobile-search{ display:block;   }
    .content .title-detail
    {   width:96%; }
    .content .title-detail1
    {   width:92%;}
    #video
    { display:none; }
    #coverimg
    { display:unset; }
    .mrbt
    { height:192px;   }
    .mrbt
    {   height:auto;    }

    .img-product-button{text-align:right;}
    .line-height{height:auto;}
    #mid-menu-left{width:33%;}
    #mid-menu-right{width:50%;}
    #top-menu-left{width:60%;}
    #top-menu-right{width:40%;}
    .mobile_menu{width:50%;}
    #display-mobile{   display:unset;   }
    .card-body{padding: .25rem;}
    h4,h5{font-size:unset;}
    .bg_league
    {
        max-height:1018px;
        height:1018px;
    }
    .display_league
    {
        top:calc(100% - 89%);
        left:5%
    }
    .show_score
    {
        height:795px;
        width:90%;
    }
    .display-flex
    {  
        /*display: -webkit-inline-box;*/
        align-items: center;
        /*justify-content: center;*/
        flex-flow: row wrap;
        align-content: center;
    }
}
/* and */
@media screen and (min-width: 767px)and (max-width: 992px)
{	

	
    .mrbt
    {   margin-bottom:0px ;
        height:auto;
    }
     #video
    { display:unset; }
    #coverimg
    { display:none; }
    
    .limitwidth
    { width:unset; }
   /*.img-product{height:60vh;}.imgproduct
    {height:600px;}*/
    .line-height{height:48px;}
    .img-product-name,.img-product-button{width:50%;}
   	.img-product-button{    text-align:right;   }
    .col4{ max-width: 33.333333%; }
    #display-mobile{   display:unset;   }
     .bg_league
    {
        max-height:1400px;
        height:1400px;
    }
    .display_league
    { 
        top:calc(100% - 89%);
        left:5% ;/* กรณีจอ 1024*/
       
    }
    .show_score
    {
        height:1052px;
        width:90%;  /*กรณีจอ 1024*/
    }
    .mobile-search-menu{display:flex;}
	.w100{width:80%;}
	
    .display-flex
    {  
        /*display: -webkit-inline-box;*/
        align-items: center;
        /*justify-content: center;*/
        flex-flow: row wrap;
        align-content: center;
    }
    .mobile_menu {width:50%;}

}

@media screen and(min-width: 1200px)
{

 .container {max-width: 1210px; }
 .display_league{
    top:10%;
    left:5%;
 }
 .bg_league{    height:1372px;  }
 .show_score{
    max-height: 92vh;
    width:90%;
 }

}

