@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');
*{
    padding:0;
    margin:0;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}
body {
    background-color: #FBFBFB;
    color: #1d2124;
    width:100%;
}
p{
  margin-bottom:0;
}

.body-container .container{
  max-width:1018px;
}

.search {
  padding-top:24px;
}
.search .select-bg {
  position: relative;
  background: #f4f7ff;
  color: #212b36;
  border: 1px solid #6F6F6F;
  border-right: 0;
  font-size:14px;
  height: auto;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  background: url(images/chevron_down.svg)right .75rem center/10px no-repeat;
  display: none;
}
.search .select-bg:focus {
  box-shadow: none;
}
.search.input-group>.custom-select:not(:first-child), .input-group>.form-control:not(:first-child){
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.search>.select-bg, .search>.search-input>.search-form, .search>.advanced>.advanced-search>.search-inner>.search-input>.search-form, .search>.advanced>.advanced-search>.search-inner>.search-input>.input-group-append>.btn-primary{
  font-size:14px;
  height:55px;
  box-shadow: none;
  border: 1px solid #6F6F6F;
}

.search-input.input-group-lg>.input-group-append>.btn.btn-play{
  background-color: #2B68E8;
  border: 1px solid #2B68E8;
  color: #FFFFFF;
  font-size: 14px !important;
  padding: 16px 32px;
}
.search-input.input-group-lg>.input-group-append>.btn.btn-play:hover{
  background-color: #003FC4;
}
.search-input .btn-play:focus{
  box-shadow: none;
}
.search .btn:focus, .btn-primary:focus{
  box-shadow: #00000000 !important;
}
.btn-apply{
  background-color: #6F6F6F;
  border: 1px solid #6F6F6F;
}

.video-section{
  display:flex;
  flex-wrap:wrap;
  margin-top:20px;
}
.video-section .video{
  width: calc(72% - 20px);
  margin-right:20px;

}
.video-section>.video> video{
  border-radius: 6px;
  width:100%;
  height: 100%;
  object-fit: fill;
}
.video-section .table{
  width:28%;
	margin-bottom: 0!important;
}
.table th, .table td {
  border:0;
}
.table thead th {
  border-bottom:0;
  background-color: #F4F7FF;
  border-radius: 6px 6px 0 0;
  font-size: 16px;
}
.table{
  border-radius: 6px;
  border: 1px solid #E6E6E6;
  margin-bottom: 0
}

.video-section .table .metrics{
  font-size:14px; width: 100%;
}
.video-section .table .metrics tr{
   border-bottom: 1px solid #E6E6E6;
}
.video-section .table .metrics tr:last-child{
   border-bottom: 0px;
}
.video-section .table .metrics th{
  padding: 16px 10px;
}
.video-section .table .metrics td:last-child{
  color:#14C171;
  text-align: right;
}
.video-levels{
  background-color: #F4F7FF;
  border-top: 1px solid #E6E6E6;
  border-bottom:1px solid #E6E6E6;
  width: 100%;
  padding:10px;
  margin-top:40px;
  margin-bottom:10px;
}
.resolutions {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.resolutions .playing-res{
  /* padding:10px 20px; */
  padding:7px;
  margin:10px 10px 0px 10px;
  /* background-color: #14C171; */
  border-radius: 6px;
  color:#FFFFFF;
  font-size:11px;
}
.audio-lang{
  display: flex;
  flex-wrap: wrap;
  width:100%;
}
.audio-lang .lang-card{
  /* padding:10px 20px; */
  padding:7px;
  /* margin:10px; */
  font-size:11px;
  /* background-color: #8B8B8B; */
  border-radius: 6px;
  color:#FFFFFF;

}
.selected-lang{
  padding-left:10px;
}
.resolutions .active, .audio-lang .active{
  background-color: #205FF0;
}


div#lvlscontrols {
    display: flex;
    padding: 0px;
}

div#audioTrackLabel {
  display: inline-flex;
}

@media screen and (max-width: 1366px) {

.video-section .table .metrics td{
   padding: 6px 12px;
}
.video-section .table .metrics th{
  padding: 10px 10px;
}
.video-levels{
  margin-top:20px;
}
}

@media screen and (max-width: 1024px){
  .body-container .container{
    max-width: 100%;
    padding:0 30px;
  }

}


@media screen and (max-width: 991px) {

  .video-section .video {
    margin-right: 0px;
    width:100%;
}
  .video-section .table {
    width: 100%;
    margin-top:20px;
}
  .video-section .table .metrics{
    width: 100%;
  }
}
.video-section .table .metrics th, .video-section .table .metrics tr td {
    text-align: left;
    padding: 10px;
}
.player-sec p, .player-sec table{
	margin: 0!important;
}
.player-sec .search .btn-play {
    height: 100%!important;
    padding: 0 40px!important;
}
@media screen and (max-width: 600px){
	.resolutions {
      display: block;
	}
	.player-sec #lvlscontrols{
		display: block;
		column-count: 2;
	}
}

.player-change-btns {
    text-align: center;
}
.player-change-btns button {
    padding: 10px 40px;
    border-radius: 7px;
}
#qualitySelector button{
	padding: 7px 15px;
    margin: 0 10px 0;
    border-radius: 6px;
    font-size: 11px;
    line-height: normal;
}