@import url(https://fonts.googleapis.com/css?family=Titillium+Web:400,200,300,600,700);
body{background:#F4F4F6;font-family: 'Titillium Web', sans-serif;}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #fff;
  opacity: 1;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #fff;
  opacity: 1;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #fff;
  opacity: 1;
}
:-moz-placeholder { /* Firefox 18- */
  color: #fff;
  opacity: 1;
}
.btn{border-radius: 15px;padding: 7px 25px;transition: all 250ms ease-in-out;}
.btn-primary{background-color: #48639C;border-color: #48639C;text-shadow: none;font-weight: 300;}
.btn-primary.focus, .btn-primary:focus,.btn-primary:hover{background-color: #40588c;border-color: #40588c;}
.btn-default{background-color:#E8E7E7;border-color:#E8E7E7;text-shadow: none;font-weight:300;}
.btn-default.focus, .btn-default:focus,.btn-default:hover{background-color:#d6d6d6;border-color:#d6d6d6;}
.media-server-navbar{margin-bottom: 0px;padding:0px 0px 0px 15px;border-radius:0px;background:#13BB6B;border:0px;color:#fff;height:60px;box-shadow: 1px 1px 2px #ccc;position: fixed;width: 100%;z-index: 1999;top:0px;transition:all 250ms ease-in-out;}
.media-server-navbar .container-fluid{height:100%;}
.mserver-container{margin-top: 75px;}
.no-padding{padding:0px !important;}
.no-margin{margin:0px !important;}
.clear-fix{clear:both;}
.main-video-container{background-color: #f4f4f6;border-radius: 0px;margin-top: 25px;overflow: hidden;margin-bottom: 20px;background-color: #fff;padding: 10px;}
.main-logo{height: 60px;padding: 12px 30px;}
.custom-nav{margin-top: 0px;}
.custom-nav li .navbar-icon-buttons{height:25px;width: 25px;fill:#fff;}
.custom-nav li a{padding:17px;transition: all 250ms ease-in-out;}
.custom-nav li a:hover{background-color: rgba(255,255,255,0.1) !important;}
.serach-btn{background: #11B064;border: 0px;padding: 22px;outline: none;}
/*.upload-btn{background: #0EA65D;}*/
.playhome-btn{background: #0EA65D;padding:10px !important;}
.profile-info-dropdown{height: 40px;width: 40px;border-radius: 50%;background-color: #0b8e4f;text-align: center;font-size: 20px;line-height: 40px;color: #fff;font-weight: 200;}
.profile-info{width:340px;height:160px;background: #fff;position: absolute;right:0px;top:60px;-webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);box-shadow: 0 2px 10px rgba(0,0,0,.2);padding:15px;opacity: 0;visibility: hidden;transition:all 250ms ease-in-out;
    transform-origin: 0 0;-webkit-transform: rotateX(60deg);-moz-transform: rotateX(40deg);-o-transform: rotateX(40deg);transform: rotateX(40deg); }
.profile-info.visible{opacity: 1;visibility: visible;transform-origin: 0 0;-webkit-transform: rotateX(0deg)-moz-transform: rotateX(0deg);-o-transform: rotateX(0deg);transform: rotateX(0deg);z-index:9999;}
.main-section{overflow: hidden;margin-bottom: 15px;}
.main-section .letter-profile-pic{background: #06AF56;width:70px;height:70px;border-radius:50%;line-height: 70px;text-align: center;font-size: 33px;font-weight: 100;float: left;}
.main-section .profile-main-info-container{float:left;margin-left: 15px;}
.main-section .profile-main-info-container .profile-name{color: #333;font-size: 18px;padding: 12px 0 0px 0px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;max-width: 225px;}
.main-section .profile-main-info-container .profile-emailid{font-size: 14px;color: #999;max-width: 225px;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;font-weight: 100;}
.profile-info-dropdown.signedin img{display: none;}
.usersvg{width: 20px;height: 20px;margin-top: 10px;}
#main-serach{width:300px;float:right;height: 100%;padding:10px 20px;}
#main-serach .serach-textbox{height:100%;background:#13bb6b;border:1px solid #13bb6b;box-shadow: none;border-bottom-color: #fff;color:#fff;font-size: 20px;outline:none;font-weight: 200;}
.mobile-dropdown-menu-btn{margin-right: 30px;margin-top: 20px;}
#navbar{border:0px;}
.navbar-inverse .navbar-toggle{border-color: #0d9a57;}
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover{background-color: #0d9a57;}
.main-video-holder{position: relative;display: block;float: left;width: 100%;}
.main-video-holder video{width: 100%;background: #000;height: 100%;}
.main-video-information{width:100%;color:#141414;padding-top: 15px;display: block;float: left;}
.main-video-information .video-title{
  padding: 4px 0px;
  font-size: 22px;
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  text-shadow: -1px 1px 2px rgba(125, 125, 125, 0.83);
}
.main-video-information .video-history{font-size: 12px;color:#808080;font-weight: 300;}
.main-video-information .view-container{height:50px;width:50px;background: #0FBEF0;border-radius:50%;display: block;margin-top: 10px;padding: 12px;}
.main-video-viewsicon{width:25px;height:25px;}
.main-video-viewcount{display: block;line-height: 70px;padding: 0px 10px;font-size: 20px;font-weight: 300;}
.upnext-video-thumnail-container{width:100%;height:250px;background-color: #141414;overflow: hidden;position: relative;}
.upnext-videos{background: #fff;padding:30px 0;}
.upnext-video-thumnail-container img.main{width: 100%;height: auto;}
.footer-media{background: #222222;height: 50px;color: #5E5D5D;padding: 13px;font-size: 17px;position: relative;font-weight: 300;width: 100%;bottom: 0px;}
.floating-video-details{height:30px;position: absolute;background: rgba(0,0,0,0.7);right:15px;bottom:55px;border-radius:2px;padding: 3px 0;}
.floating-video-details span{padding:0px 5px;font-size: 16px;color:#e2e2e2;}
.floating-video-details span.hd-label{padding:0 0 0 10px;font-weight: bold;}
.video-overlay{position: absolute;width:100%;height:100%;top:0px;bottom: 0px;right:0px;left:0px;background: rgba(0,0,0,0.2); /* For browsers that do not support gradients */background: -webkit-linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,1)); /* For Safari 5.1 to 6.0 */background: -o-linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,1)); /* For Opera 11.1 to 12.0 */background: -moz-linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,1)); /* For Firefox 3.6 to 15 */background: linear-gradient(rgba(0,0,0,0.0), rgba(0,0,0,1)); }
.main-video-overlay{position: absolute;width:100%;height:100%;top:0px;bottom: 0px;right:0px;left:0px;background: rgba(0,0,0,0.4);}
.video-thumb-details{height:80px;width:100%;position: absolute;bottom:0px;right:0px;left:0px;}
.video-thumb-title{font-size: 20px;color:#fff;padding:8px 15px;width: 100%;height: 45px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;font-weight: 300;}
.video-thumd-video-detail{padding:0px 15px;font-weight: 200;}
.video-thumd-video-detail span{padding:0px 5px;font-size: 15px;color: #fff;}
.thumb-overlay-icon{width:20px;height:20px;}
.date-icon{color:#EEB12D;}
.time-icon{color:#0FBEF0;}
.views-count-container{position: absolute;top:0px;right:0px;background: #0FBEF0;padding:4px 10px;top:10px;right:10px;border-radius: 2px;}
.views-count-container span{padding:0px 2px;color:#fff;font-size: 16px;font-weight: 300;}
.views-count-container-icons{width:20px;height:20px;}
.play-main{width:120px;height:120px;border-radius: 50%;background: rgba(255,255,255,0.3);position: absolute;top:50%;margin-top: -60px;left:50%;margin-left:-60px;text-align: center;padding-top: 37px;cursor: pointer;}
.main-play-icon{width:45px;height:45px;}
.my_video-dimensions{width:auto !important;height:480px !important;}
.video-desc{font-size: 16px;padding: 10px 0 0 0;margin-top: 10px;}
.video-tags{font-size: 16px;padding: 15px 0;display: block;float: left;width: 100%;}
.video-tags span.tag{display: block;padding:3px 15px;margin-right: 5px;border-radius: 2px;color:#808080;border:1px solid #CCC;font-weight: 300;}
.display-table-container{display: table;float:right;}
.display-table-container span{display: table-cell;}
.view-icon-container{vertical-align: top;}
#vfile{display: none;}
.upload-label{display: block;height: 100px;width: 100px;background: #333;border-radius: 50%;margin:0 auto;position: relative;transition: all 250ms ease-in-out;cursor:pointer;}
.upload-label:hover{box-shadow: 1px 1px 6px #666;}
.upload-label:before{content:'';background: url('../Images/upload.png')no-repeat;position: absolute;display: inline-block;width:40px;height: 40px;background-size: 40px 40px;top: 30px;left: 30px;}
.upload-table{
  /*margin-top: 30px;*/
}
.upload-table.table>tbody>tr>td, .upload-table.table>tbody>tr>th, .upload-table.table>tfoot>tr>td, .upload-table.table>tfoot>tr>th, .upload-table.table>thead>tr>td, .upload-table.table>thead>tr>th{    border-top: 0px;}
.upload-table.table-striped>tbody>tr:nth-of-type(odd){background-color: #f4f4f6;}
.progress{margin-top: 20px;}
span.select2.select2-container{width:100% !important;}
span.select2.select2-container .select2-container--default.select2-container--focus .select2-selection--multiple{border: 1px solid #ccc;}
.video-preview{margin-top: 20px;}

.main-video-holder button.vjs-big-play-button{
  border: 0px;height: 100px;width: 100px;
  border-radius: 50%;background: rgba(255,255,255,0.3) !important;
}
.main-video-holder button.vjs-big-play-button:before{
  color: #000000 !important;
  padding-top: 28px;font-size:50px;
}
.vjs-menu-button-popup .vjs-menu{bottom: 15px !important;}
/*----- select2 Customization------*/
.select2-dropdown{z-index:9999 !important;}
.media-server-navbar .selection .select2-selection{height:35px;overflow-y: auto;overflow-x:hidden;}
#select2-searchTags-results .select2-results__option--highlighted[aria-selected]{background-color: rgba(19,187,107,0.8);color: white; }
#select2-searchTags-results .select2-results__option--highlighted[aria-selected=true]{background-color: rgba(221,221,221,0.7);}
.media-server-navbar .select2-selection--multiple{border: 0px !important;border-bottom: 2px solid #fff !important;background-color: transparent !important;    border-radius: 2px !important;}
.media-server-navbar .select2-selection__choice{background-color: transparent !important;border-color: #fff !important;}
.media-server-navbar .select2-selection__choice .select2-selection__choice__remove{color:#fff !important;}
#select2-searchTags-results .select2-results__option .select2-results__option--highlighted{}
/*#videoPrev #my_video{width:100% !important;height:500px;margin-bottom: 20px;display: none;}*/
.desc-tags{list-style: none;padding: 0px;}
.desc-tags .item{float: left;background-color: #13bb6b;padding: 3px 13px;border: 1px solid #0fa15c;margin-left: 10px;border-radius: 13px;margin-bottom: 5px;color: #09482a;font-weight: 300;}
.desc-tags .item:first-child{margin-left: 0px;}
#overlay-loader-wrapper{margin-bottom: 20px;}
#overlay-loader-wrapper .upload-loader{background-color: #000000;border:1px solid #000;width: 100%;height: 500px;}
.no-video-container{min-height: calc(100vh - 60px);padding-top: 20%;box-sizing: border-box;}
body.navbar-hidden .media-server-navbar{top:-61px;opacity: 0;}
.action-section .btn-default{width: 149px; padding: 10px;}
.action-section .btn-default:last-child{margin-left: 8px;}
/*----------Loader---------------*/
@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.loading {
	border-radius: 50%;
	width: 50px;
	height: 50px;
	border: 0.25rem solid rgba(255, 255, 255, 0.2);
	border-top-color: white;
	animation: spin 1s infinite linear;
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
}
.loading-label{color:#4a4a4a;text-align: center;margin: auto;position: absolute;left: 7px;top: -80px;bottom: 0;right: 0;height:20px;}
/*-------Custom Media Query------*/
@media (min-width:768px)
{
   .custom-nav{float:right;}
}
@media (max-width:768px)
{
   .custom-nav{margin:0px;}
   .custom-nav li a:hover, .custom-nav li a:focus, .custom-nav li a:active{background-color: #0d9a57 !important;}
   .serach-btn:before{content:'Serach';position: absolute;display: inline-block;left: 70px;font-size: 16px;color:#fff;font-weight: 200;top: 25px;font-size: 20px;}
   .upload-btn:before{content:'Upload';position: absolute;display: inline-block;left: 70px;font-size: 16px;color:#fff;font-weight: 200;top: 25px;font-size: 20px;}
   .playhome-btn:before{content:'Home';position: absolute;display: inline-block;left: 70px;font-size: 16px;color:#fff;font-weight: 200;top: 25px;font-size: 20px;}
   .custom-nav li .navbar-icon-buttons{height: 20px;width: 20px;}
   .main-video-container{margin-top: 17px !important;}
   #main-serach{float:none !important;width:100%;background: #13bb6b;padding: 10px 65px;}
   #main-serach .serach-textbox{width:100%;}
   .upnext-video-thumnail-container{height:250px !important;}
   .profile-info{width:100%;height:auto;padding:0px;position: relative;top:0px;display: none;}
   .profile-info.visible{display: block;box-shadow: none;}
   .profile-info .main-section{display: none;}
   .profile-info .action-section .btn-default{width:100%;margin:0px !important;border-radius: 0px;background-color: #11B064;border-color: #11B064;color:#fff;    padding: 13px 25px 13px 80px;text-align: left;}
}
@media (max-width:991px){
    .upnext-video-thumnail-container{margin-bottom: 20px;height:350px;}
    .main-video-container{margin-top: 10px;}
}
.thumbnail-img-overlay {
    cursor: pointer;
}
.hide {
    display:none;
}

/* addded by dinu */
/* skeleton loading */
@keyframes placeholderanimation {
  0% {
      background-position: -468px 0;
  }

  100% {
      background-position: 468px 0;
  }
}

.loading-content .actual-content {
  visibility: hidden;
  opacity: 0;
  transition: opacity 1s ease;
}

.loading-content .background-masker {
  animation-duration: 1s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: placeholderanimation;
  animation-timing-function: linear;
  background: #f6f7f8;
  background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
  background-size: 800px 104px;
}

.upnext-video-thumnail-container .actual-content{
  display: block;
  float: left;
}

.my-container{
  display: block;
  position: relative;
  float: left;
  width: 100%;
  padding: 20px;
  background-color: #fff;
  margin-bottom: 40px;
}
#hash-tags .links{
  cursor: pointer;
  color: #bb2525;
  text-decoration: none;
  position: relative;
  padding-right: 10px;
}
#hash-tags .links:after{
  position: absolute;
  content: "/";
  right: 0;
  top: 0;
}
#hash-tags .links:last-child:after{
  content: '';
}
.change_status {
  cursor: pointer;
}
.change_status:hover {
  text-decoration: underline;
}
.reset-search {
  position: absolute;
  margin-left: -10px;
  margin-top: 10px;
  display: none;
}
.main-video-holder button.vjs-big-play-button {
  transition:.2s;
  z-index:1000;
}

.main-video-holder-zoom {
  z-index: 1000;
  -webkit-transition: all 600ms ease-in !important;
  -webkit-transform: scale(1.2) !important;
  -ms-transition: all 600ms ease-in !important;
  -ms-transform: scale(1.2) !important; 
  -moz-transition: all 600ms ease-in;
  -moz-transform: scale(1.2)!important ;
  transition: all 600ms ease-in !important;
  transform: scale(1.2) !important;
}

.main-video-holder-zoom-out {
  z-index: 1000;
  -webkit-transition: all 600ms ease-out !important;
  -webkit-transform: scale(1) !important;
  -ms-transition: all 600ms ease-out !important;
  -ms-transform: scale(1) !important; 
  -moz-transition: all 600ms ease-out;
  -moz-transform: scale(1)!important ;
  transition: all 600ms ease-out !important;
  transform: scale(1) !important;
}

.main-video-holder button.vjs-big-play-button:hover {
  opacity:.9 !important;
}

/* css animations */

.upnext-video-thumnail-container {
  transition:.2s;
}

.upnext-video-thumnail-container-zoom {
  -webkit-transition: all 600ms ease-in !important;
  -webkit-transform: scale(1.1) !important;
  -ms-transition: all 600ms ease-in !important;
  -ms-transform: scale(1.1) !important; 
  -moz-transition: all 600ms ease-in;
  -moz-transform: scale(1.1)!important ;
  transition: all 600ms ease-in !important;
  transform: scale(1.1) !important;
}
.upnext-video-thumnail-container-zoom-out {
  z-index: 1000;
  -webkit-transition: all 600ms ease-out !important;
  -webkit-transform: scale(1) !important;
  -ms-transition: all 600ms ease-out !important;
  -ms-transform: scale(1) !important; 
  -moz-transition: all 600ms ease-out;
  -moz-transform: scale(1)!important ;
  transition: all 600ms ease-out !important;
  transform: scale(1) !important;
}

@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

.videobutton {
  border: 0;
  background: transparent;
  box-sizing: border-box;
  width: 0;
  height: 74px;
  border-color: transparent transparent transparent #202020;
  transition: 100ms all ease;
  cursor: pointer;
  border-style: solid;
  border-width: 37px 0 37px 60px;
}

.select2-results__options::-webkit-scrollbar {
  width: 5px;
}

/* Track */
.select2-results__options::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 5px;
}

/* Handle */
.select2-results__options::-webkit-scrollbar-thumb {
  background: #0d9a57; 
  border-radius: 5px;
}
.upload-progress-status {
  /* position: fixed;
  top: 2%;
  right: 25%; */
  padding: 8px;
  font-family: Arial;
  background: #0b5a31;
  border: 1px dotted #0f6d3c;
  color: #fff;
  z-index: 2000;
  opacity: 0.8;
  font-weight: bold;
  display: none;
  width: 225px;
  float: right;
  margin-top: 10px;
}

/* Handle on hover */
.select2-results__options::-webkit-scrollbar-thumb:hover {
  background: rgb(179, 179, 199); 
}
.description-panel{
  display: block;
  float: left;
  width: 100%;
  margin-top: 10px;
}
.description-panel .panel{
  border: none;
  box-shadow: none!important;
}
.description-panel .panel-heading{
  background-color: transparent;
}
.description-panel .panel-body,.description-panel .panel-heading{
  padding-left: 0;
}
.description-panel .panel-heading a{
  text-decoration: none;
}
.main-video-background-masker{
  display: block;
  float: left;
}
.description-panel .description{
  font-size: 17px;
  line-height: 1.2;
  color: #3a3a3a;
  word-break: break-all;
}

.description-panel label{
  display: block;
  width: 100%;
  font-weight: 700;
  font-size: 16px;
  color: #000;
  font-family: 'Raleway', sans-serif;
}

.video-header{
  display: block;
  float: left;
  width: 100%;
  padding-bottom: 20px;
  border-bottom: 1px solid #e6e6e6;
}