body {
    /*background-color: #f4edb2 !important;*/
}

.footer-copyright {
    font-color: red !important;
    font-weight: bold;
}

.action {
    /*width: 190px;*/
}

.action > a {
    /*float: left;*/
    display: block;
    margin-right: 10px;
}

/* playlist thumbnail */
.playlist-thumbnail{
   position: relative;
   margin-bottom: 5px !important;
}

.playlist-caption {
    width: 50%;
    height: 100%;
    top: 0;
    left: 50%;
    position: absolute;
    background: black;
    opacity: 0.3;
}

.playlist-caption p{
  color : white;
  font-size: 1.2em;
  margin : 5px 10px;
}

/*note on create and edit package */
.note{
  margin: 15px 0;
}

.note span{ 
    font-size: 14px;
    
}

.note i{
  color : #e9aa3a;
}
/*end of css for note on create and edit package */

.card__padding {
  padding-bottom: 10px;
}

.card__content {
  position: relative;
}

/* card meta */
.card__meta time {
  font-size: 1em;
  color: #bbb;
  margin-left: 5px;

}

.card__meta a {
  font-size: 1em;
  display: block;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-left: 5px;
}


.list-group-item img {
  width: 18%;

}

.list-group-item span{
   padding-left: 20px;
}

.user-playlist{
   border : 1px dashed #fbd490;
   min-height: 80px;
}


/*icons css*/
@media (max-width: 768px) {
    .brand-logo {
        width: 80px;
        padding-bottom: 5px;
    }

    .sidebar-brand {
        margin-top: 3px;
        margin-left: 7px;
    }

    .navbar-mobile li.logo {
        margin-top: 5px;
    }

    .btn-margin-right-10px {
      margin-right: 5px;
    }
}

@media (min-width: 768px) {

  .btn-margin-right-10px {
    margin-right: 10px;
  }

    .brand-logo {
        width: 100%;
        margin-top: 40px;
    }
}

ul.sidebar-nav li i {
    color: #B08C77;
}

ul.sidebar-nav .title {
    color: #B08C77 !important;
    font-weight: bold;
}

li.active i {
    color: #DC9016 !important;
}

li.active .title {
    color: #DC9016 !important;
    font-weight: bold;
}

li.dropdown li {
    color: #DC9016 !important;
}

/*.btn-success, .pagination li.active span {
    background-color: #DC9016 !important;
    border-color: #DC9016 !important;
    box-shadow: none !important;
    font-weight: bold;
}*/

.pagination > li.active > a, .pagination > li.active > span {
    border: 0;
    border-bottom: 2px solid #f1592c;
    background-color: #f1592c;
}

.pagination > .active > a, .pagination > .active > span, 
.pagination > .active > a:hover, .pagination > .active > span:hover, 
.pagination > .active > a:focus, .pagination > .active > span:focus{
    border: 0;
    border-bottom: 2px solid #f1592c !important;
    background-color: #f1592c !important;
}

.btn-danger {
    /*background-color: #BA2379 !important;
    border-color: #BA2379 !important;*/
}


/*btn floating*/
.btn-floating a i {
    color: #DC9016 !important;
}

/*.navbar .navbar-collapse .navbar-nav {
    height: 50px;
}

.navbar {
    padding-bottom: 0px;
    margin-bottom: -20px;
}

.navbar-collapse img, .navbar-collapse div.icon {
    width: 40px !important;
    height: 40px !important;
}*/

/*li.notification a.dropdown-menu, li.profile {
    top:120% !important;
}*/

li.profile div.dropdown-menu ul {
    width: 100%;
}

#sidebar {
  min-height: 120vh;
  /*max-height: 700px;*/
}

div.sidebar-menu {
  /*min-height: 120%;*/
}


.search-field {
    float: right;
    width: 100%;
    height: 35px;
    margin: 0 0 0 8px;
    padding: 0 8px;
    border : 1px #0d162b solid;
    /*font-family: 'Open Sans', Arial, sans-serif;*/
    /*font-size: 16px;*/
    color: #888;
    /*font-style: italic;*/
    font-weight: 400;
    background: #fff;
    /*border: 1px solid #ccc;*/
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px; 
    border-radius: 3px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#ffffff));
    background-image: -webkit-linear-gradient(top, #f5f5f5, #ffffff);
    background-image: -moz-linear-gradient(top, #f5f5f5, #ffffff);
    background-image: -ms-linear-gradient(top, #f5f5f5, #ffffff);
    background-image: -o-linear-gradient(top, #f5f5f5, #ffffff);
    background-image: linear-gradient(top, #f5f5f5, #ffffff);
    -moz-box-shadow: 0 1px 1px #e2e2e2 inset, 0 1px 0 #fff;
    -webkit-box-shadow: 0 1px 1px #e2e2e2 inset, 0 1px 0 #fff;
    box-shadow: 0 1px 1px #e2e2e2 inset, 0 1px 0 #fff;
   }

/* filter row for table */
   .search_row {
      border-bottom: 2px solid #ccc;
      border-top: 1px solid #E7EDEE;
   }




@media (min-width: 768px) {

  #navbar {
    margin-bottom: 10px;
  }

  #navbar, #navbar > div , #navbar > div > div, #navbar ul.nav {
    height: 50px !important;
  }

  body .app-container {
    padding-left: 160px;
    margin-right: -20px;
  }

  #navbar > div > div > ul.nav.navbar-nav.navbar-right > li > a > img {
    width: 35px;
    height: 100%;
  }

  li.section {
    padding: 0px !important;
    border: 0px !important;
    margin: -8px -8px -8px 0px !important;
  }

  li.section > i {
    color: grey !important;
    font-size: 90% !important;
    padding: 0px !important;
  }

}

td.action a.btn {
  width: 60px;
  padding-bottom: 10px;
}


/*overwrite auto suggestion */
  .autocomplete-suggestions{
    background-color: #C9F1D7 !important;
  }

  .autocomplete-suggestion{
    padding: 10px 30px !important;
    border-bottom: 1px solid #FFFFFF !important;
  }
.navbar .navbar-collapse .navbar-nav > li a, .navbar .navbar-collapse .navbar-nav > li a:hover, .navbar .navbar-collapse .navbar-nav > li a {
  color: #0d162b;
}

#navbar > div > div > ul.nav.navbar-nav.navbar-right > li > div > a {
  border: 1px solid #0d162b;
  box-shadow: none; 
}

.navbar .navbar-collapse .navbar-nav > li a, .navbar .navbar-collapse .navbar-nav > li div {
  margin-top: 3px;
}


.btn-channel {
  width: 100%;
}

.required-field{
   color : #f02336;
}

#search-on-navbar {
/*  width: 250px; */
  height: 40px;
  /*margin-right: 45px;*/
  /*border-radius: 2px;*/
  /*border: 1px solid #0d162b;*/
  /*padding-left: 10px;*/
}

#navbar > div > div > ul.nav.navbar-nav.navbar-left > li.navbar-title {
  padding-left: 10px;
}



.select3{ 
    width: 100%;
    height: 40px;
    padding-left: 10px;
    border-radius: 3px;
    border : 1px #0d162b solid;
    /*font-style: italic;*/
    background-color: white;
}
#card-tab-brower-os > div.card-header {
  overflow: hidden;
}

#card-tab-brower-os > div.card-header > ul {
  overflow: hidden;

}

#navbar > div > div > ul.nav.navbar-nav.navbar-left > li.navbar-title {
  text-transform: uppercase;
  color:  #f1592c;
  font-weight: bold;
  font-size: 20px;
}

@media screen and (min-width: 768px) and (max-width: 991px){
    #navbar > div > div > ul.nav.navbar-nav.navbar-left > li.navbar-title {
        font-size: 16px;
    }
}



/*custom btn border only and no background */


.btn-success{
	text-transform: uppercase;
	color: #0ca97b !important;
	/* padding-left: 0px !important;*/
	/* font-size : 14px;*/
	background: transparent !important;
	border-color: #0ca97b !important; 
	border-bottom-width: 2px !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important; 
	font-weight: bold;
}.btn-success:visited,.btn-success:hover,.btn-success:active,.btn-success:focus{
	color: #0ca97b !important;
}

.btn-warning{
	text-transform: uppercase;
	color: #f9a006 !important;
	background: transparent !important;
	border-color: #f9a006 !important;
	border-bottom-width: 2px !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
	font-weight: bold;
}.btn-warning:visited,.btn-warning:hover,.btn-warning:active,.btn-warning:focus{
	color: #f9a006 !important;
}

.btn-primary{
	text-transform: uppercase;
	color: #046ad2 !important;
	background: transparent !important;
	border-color: #046ad2 !important;  
	border-bottom-width: 2px !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;  
	font-weight: bold;
}.btn-primary:visited,.btn-primary:hover,.btn-primary:active,.btn-primary:focus{
	color: #046ad2 !important;
}
.btn-danger{
	text-transform: uppercase;
	color: #f02336 !important;
	border-color: #f02336 !important; 
	background: transparent !important;
	border-bottom-width: 2px !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
	font-weight: bold;
}.btn-danger:visited,.btn-danger:hover,.btn-danger:active,.btn-danger:focus{
	color: #f02336 !important;
	outline: 0px !important;
}

.btn-info{
	text-transform: uppercase;
	color:  #f1592c !important;
	border-color:#f1592c !important ;
	background: #ffffff !important;
	border-bottom-width: 2px !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
	font-size: 14px;
	font-weight: bold;
}

.btn-default{
	text-transform: uppercase;
	color: #f9a006 !important;
	background: transparent !important;
	border-color: #f9a006 !important;
	border-bottom-width: 2px !important;
	-webkit-box-shadow: none !important;
	-moz-box-shadow: none !important;
	box-shadow: none !important;
	font-weight: bold;
}.btn-default:visited,.btn-default:hover,.btn-default:active,.btn-default:focus{
	color: #f9a006 !important;
}

  /*end of custom btn */

/*
  .navbar-right{
    margin-right: -8px !important;
  }*/


/*.card-navy {
  background-color: #0d162b;
  color: white !important;
}*/


/* flex box for ie for login page */

  .app-login .app-body .app-block .app-form{
      flex:  auto;
  }

/*for ie 11 */
/*_:-ms-fullscreen, :root .app-login .app-body .app-block{
     margin-top: 220px !important;
    }*/

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
     /* IE10+ CSS styles go here */
     .app-login .app-body .app-block{
        margin-top:  220px !important;
     }
}


/* -- custom css for homepage line chart -- */
.card.card-blue{
   background-color: #FFF !important;
}

.card.card-blue.card-chart .card-header {
  background-color: #FFF !important;
  color: #0d162b !important;
}

.card-banner .ct-series-a .ct-bar, .card-banner .ct-series-a .ct-line, .card-banner .ct-series-a .ct-point {
    stroke: #0d162b !important;
}

.card-banner .ct-label {
    fill: #0d162b !important;
    color: #0d162b  !important;
}


#card-video-hit .card-header .card-title .title{
  background-color: #0d162b  !important;
  color: #FFF !important;
}

.card-banner .ct-grid {
    stroke: rgba(13, 22, 43, 0.2);
}

.chartist-tooltip{
  background-color: #0d162b  !important;
}

.chartist-tooltip:before{
   border-top-color: #0d162b !important;
}

  .card-banner .ct-series-a .ct-area {
      fill:  #0d162b !important;
  }
/*end of css of homepage line chart */

/* -- custom css of mini card homepage */
.card.card-green-light .card-body .content .value{
   color : #35afb6 !important;
}

.card.card-green-light .card-body .icon{
  color: #35afb6 !important;
}

.card.card-green-light:hover {
    background-color: #35afb6; 
}
.card.card-green-light:hover .card-body .icon {
     color: #FFF !important;
      background-color: rgba(255, 255, 255, 0.1); }
  .card.card-green-light:hover .card-body .content .title, .card.card-green-light:hover .card-body .content .value {
    color: #FFF !important;}

/*-- end of css of mini card homepage */


/*start of css for report chart */ 

 .card-chart .card-header .card-title .title{
   background-color: #0d162b  !important;
   color: #FFF !important;
 }

 .ct-chart-hits .ct-series-a .ct-line, .ct-chart-hits .ct-series-a .ct-point{
      stroke: #0d162b !important;
  }

 .ct-chart-bandwidth .ct-series-a .ct-line, .ct-chart-bandwidth .ct-series-a .ct-point{
      stroke: #0d162b !important;
  }

   .ct-chart-storage .ct-series-a .ct-line, .ct-chart-storage .ct-series-a .ct-point{
      stroke: #0d162b !important;
  }

  .ct-chart-hits .ct-label, .ct-chart-bandwidth .ct-label, .ct-chart-storage .ct-label {
    fill: #0d162b !important;
    color: #0d162b  !important;
  }

 .ct-chart-hits .ct-grid,.ct-chart-bandwidth .ct-grid, .ct-chart-storage .ct-grid {
    stroke: rgba(13, 22, 43, 0.2);
  }

  .ct-chart-hits .ct-series-a .ct-area, .ct-chart-bandwidth .ct-series-a .ct-area, .ct-chart-storage .ct-series-a .ct-area {
      fill:  #0d162b !important;
  }
/*end of css fore report chart */