body{
font-family: 'Sarabun', sans-serif;
background:#fbfbff;
overflow-x: hidden;

}
body::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

body::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

body::-webkit-scrollbar-thumb
{
	background-color: #000000;
}
.live{
	transition-property: background;
    transition-duration: 1s;
    transition-timing-function: ease;
    transition-delay: 0s;
	background:#757575;
}
.live:hover{
	background:#3a3a3a;
}
.bg-image{width:100%;height:100%;position:fixed;display:block;z-index:-100;position:fixed;top:0;left:0;-webkit-filter:brightness(60%);filter:brightness(60%);background-attachment:fixed;background-position:center;background-repeat:no-repeat;background-size:cover;}
.bg-image-overay{width:100%;height:100%;position:fixed;display:block;z-index:-99;position:fixed;top:0;left:0;background-attachment:fixed;background-position:center;background-repeat:no-repeat;background-size:cover;}
nav > .nav.nav-tabs{

  border: none;
    color:#fff;
    background:#272e38;
    border-radius:0;

}
nav > div a.nav-item.nav-link,
nav > div a.nav-item.nav-link.active
{
  border: none;
    padding: 18px 25px;
    color:#fff;
    background:#272e38;
    border-radius:0;
}

nav > div a.nav-item.nav-link.active:after
 {
  content: "";
  position: relative;
  bottom: -60px;
  left: -10%;
  border: 15px solid transparent;
  border-top-color: #007bff ;
}
.tab-content{
    line-height: 25px;
    border: 1px solid #272e38;
    border-top:5px solid #007bff;
    border-bottom:5px solid #007bff;
    padding:30px 25px;
}

nav > div a.nav-item.nav-link:hover,
nav > div a.nav-item.nav-link:focus
{
  border: none;
    background: #007bff;
    color:#fff;
    border-radius:0;
    transition:background 0.20s linear;
}
.card{
height: 370px;
margin-top: auto;
margin-bottom: auto;
width: 400px;
background-color: rgba(0,0,0,0.5) !important;
}

.social_icon span{
font-size: 60px;
margin-left: 10px;
color: #FFC312;
}

.social_icon span:hover{
color: white;
cursor: pointer;
}

.card-header h3{
color: white;
}

.social_icon{
position: absolute;
right: 20px;
top: -45px;
}

.input-group-prepend span{
width: 50px;
background-color: #007bff;
color: white;
border:0 !important;
}

input:focus{
outline: 0 0 0 0  !important;
box-shadow: 0 0 0 0 !important;

}

.remember{
color: white;
}

.remember input
{
width: 20px;
height: 20px;
margin-left: 15px;
margin-right: 5px;
}

.login_btn{
color: white;
background-color: #007bff;
width: 100px;
}

.login_btn:hover{
color: black;
background-color: white;
}

.links{
color: white;
}

.links a{
margin-left: 4px;
}
.tags{
position: absolute;padding: 0px 5px;text-align: center;color: #FFFFFF;z-index: 999;letter-spacing: 1.2px;background-color: #007bff;top: 0px;left: 25px;
}
.view{
color: #707579;letter-spacing: 0.5px;font-size: 0.8rem;margin-bottom:15px;
}
.package-head {
    background-color: #f71735;
    border-bottom: 6px solid #f8455d;
    text-align: center;
    padding: 7px;
}
.package-body {
    background-color: #757575;
    -webkit-box-shadow: 0px 5px 10px -5px #171717;
    -moz-box-shadow: 0px 5px 10px -5px #171717;
    box-shadow: 0px 5px 10px -5px #171717;
}
.package-bar{
background-color: #3a3a3a;
    border-bottom: 1px solid #171717;
    border-top: 1px solid #171717;
}
.package-bar2 ul li:nth-child(odd) {
    background-color: #3a3a3a;
    border-bottom: 1px solid #171717;
    border-top: 1px solid #171717;
}

@media (min-width: 1600px) {
  .livefix{
	max-height:760px;overflow-y: scroll;
	}
}
@media (max-width: 1600px) {
  .livefix{
	max-height:360px;overflow-y: scroll;
	}
}
.livefix::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}

.livefix::-webkit-scrollbar
{
	width: 6px;
	background-color: #F5F5F5;
}

.livefix::-webkit-scrollbar-thumb
{
	background-color: #000000;
}