.footer {left: 0; bottom: 0; width: 100%; background-image: linear-gradient(#444444, #000000); color: white; text-align: center; }

.header {position: fixed; left: 0; top: 0; width: 100%; background-image: linear-gradient(#000000, #0000ff, #ffffff, #ff0000, #000000); color: white; text-align: right; }

.iframe-container {overflow: hidden; padding-top: 56.25%; position: sticky; margin-bottom: 130px;}
.iframe-container iframe {border: 0; height: 100%; left: 0; position: absolute; top: 0; width: 100%;} 
iframe {margin-top: 110px; width: 600px; height: 400px;}
body {background-image: linear-gradient(#6699cc, white); background-attachment: fixed; text-align: center; font-family: tahoma;}
.main {width: 75%; border-radius: 25px; border: 2px solid #777777; padding: 15px; background-image: linear-gradient(#dddddd, white);}
.main-watch {width: 80%; padding: 25px; margin-top: 20px; border-radius: 25px; border: 2px solid #777777;background-image: linear-gradient(#dddddd, white);}
.main-tv {width: 80%; position: absolute; padding: 25px; margin-top: 20px; margin-left: 20px; border-radius: 25px; border: 2px solid #777777;background-image: linear-gradient(#dddddd, white);}
 
table {margin-top: 110px; border-radius: 25px; border: 2px solid #777777;background-image: linear-gradient(#dddddd, white);}
td {padding: 25px;}

img.logo {float: left; margin: 10px;}
img.badge {height: 100px; margin: 10px;}
img.link {height: 80px; margin: 10px;}

.biggreenbutton {width:25%; text-align: center; border-radius: 15px; border: 2px solid #777777; padding: 5px; background-image: linear-gradient(#00FF00, white);}
.bigbluebutton {width:25%; text-align: center; border-radius: 15px; border: 2px solid #777777; padding: 5px; background-image: linear-gradient(#0000FF, white);}
 
 a.one:link {font-size: 24px; color: #000000; text-decoration: none;} 
 a.one:visited {font-size: 24px; color: #000000; text-decoration: none;}
 a.one:hover {font-size: 24px; color: #000000; text-decoration: underline;}
  
.menu {margin-top: 25px; margin-right: 100px;}

h1 {color:black;}
h2 {color:black;}

li {font-weight: bold; color:black; text-align: left; list-style-type: none;};

video {width: 100%; height: auto;}

.col-md-12 {position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px;}

.btn:not(:disabled):not(.disabled) {cursor: pointer;}

.btn-primary {color: #fff; background-color: #007bff; border-color: #007bff;}

.btn-success {color: #fff; background-color: #5cb85c; border-color: #4cae4c;}

.btn {display: inline-block; padding: 6px 12px; margin-bottom: 0; font-size: 20px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; user-select: none; background-image: none; border: 1px solid transparent; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-radius: 4px; }

.btn {transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; }
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
.navbar-dark .navbar-toggler-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
    
.navbar-dark .navbar-toggler {color: #103971; border-color: #103971; background: #103971;}

.collapse:not(.show) {display: none;}

.navbar {position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding-top: .5rem; padding-bottom: .5rem;}

.navbar-toggler {padding: .25rem .75rem; font-size: 1rem; line-height: 1; background-color: #d9d5be; border: 1px solid #103971; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: transparent; border-radius: .25rem; transition: box-shadow .15s ease-in-out;}

.navbar-dark .navbar-nav .nav-link {color: #212529;}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {color:#6699cc;}

/************** CUSTOM ***********************/
.tvseries-show {display: flex;}

.back-btn {background: #ff0000; color: #fff; border-radius: 4px; padding: 8px 25px; white-space: nowrap; transition: 0.3s; font-size: 14px; font-weight: 400; display: inline-block; width: 100px; text-decoration: none;}

.back-btn:hover {background: #0000ff; color: #fff;}

.see-more-btn {background: #0000ff; color: #fff; border-radius: 4px; padding: 8px 15px; white-space: nowrap; transition: 0.3s; font-size: 14px; font-weight: 400; display: inline-block; width: 230px; text-decoration: none;}

.see-more-btn:hover {background: #ff0000; color: #fff;}

.img-logo {max-height: 80px; max-width:280px;} 

.tv-series {width:115px; height:163px; }

.col-tv-series {margin-right:30px; margin-left:30px}


/*********** width:170px -> XS: flipper, loneranger **************/

.movie-video-col-xs {width:170px; height:168px}

/*********** width:200px -> S: lucyshow **************/

.movie-video-col-s {width:200px; height:168px}

/*********** width:220px -> M: dragnet, flash, sinatra, sherlockholmes, spacepatrol, andygriffith, dickvandyke  **************/

.movie-video-col-m {width:220px; height:168px}

/*********** width:230px -> L: lassie, beverlyhillbillies, annieoakley, bonanza  **************/

.movie-video-col-l {width:230px; height:168px}



.dropdown-menu {position: absolute; top: 100%; z-index: 1000; display: none; min-width: 10rem; padding: .5rem 0; margin: 0; margin-top: 0px; font-size: 1rem; color: #103971; text-align: left; list-style: none; background-color: #fff; background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); border-radius: .25rem;}

/************** MOBILE DEVICES ***********************/

@media (width: 360px) {
.tvseries-show {display: grid;}
.tvseries-title {padding-bottom:20px;}
.img-logo {text-align:center;max-height: 80px; max-width:150px;}
}

@media (width: 375px) {
.tvseries-show {display: grid;}
.tvseries-title {padding-bottom:20px;}
.img-logo {text-align:center;max-height: 80px; max-width:150px;}
}

@media (width: 384px) {
  .tvseries-show {display: grid;}
  .tvseries-title {padding-bottom:20px;}
  .img-logo {text-align:center;max-height: 80px; max-width:150px;}
}

@media (max-width: 393px) {
  .tvseries-show {display: grid;}
  .tvseries-title {padding-bottom:20px;}
  .img-logo {text-align:center;max-height: 80px; max-width:150px;}
}
  
@media (width: 412px) {
  .tvseries-show {display: grid;}
  .tvseries-title {padding-bottom:20px;}
  .img-logo {text-align:center;max-height: 80px; max-width:150px;}
  .see-more-btn {white-space: nowrap; display: inline-block; width: 230px;}
}
@media (width: 414px) {
  .tvseries-show {display: grid;}
  .tvseries-title {padding-bottom:20px;}
  .img-logo {text-align:center;max-height: 80px; max-width:150px;}
  .see-more-btn {white-space: nowrap; display: inline-block; width: 230px;}
}

@media (width: 428px) {
  .tvseries-show {display: grid;}
  .tvseries-title {padding-bottom:20px;}
  .img-logo {text-align:center;max-height: 80px; max-width:150px;}
}

@media (max-width: 500px) {
  img.link {height: 55px; margin: 20px;}
}

@media (width: 810px) {
  .tvseries-show {display: inline-flex;}
  .tvseries-title {padding-bottom:20px;}
  .img-logo {text-align:center;max-height: 80px; max-width:150px;}
  .col-tv-series {margin-right:20px; margin-left:20px}
}

@media (width: 991px) {
  .dropdown-menu .dropdown-menu{margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem;}
  }

@media all and (min-width: 992px) {
  .dropdown-menu li{position: relative;}
  .dropdown-menu .submenu{display: none; position: absolute; left:100%; top:-7px;}
  .dropdown-menu .submenu-left{right:100%; left:auto;}
  .dropdown-menu > li:hover{ background-color: #f1f1f1 }
  .dropdown-menu > li:hover > .submenu{display: block;}
}	

@media (min-width: 992px) {
  .col-md-12 {width: 100%; float: left;}
}