*{
    margin: 0;
    padding: 0;
  }
  body {
    
    font-family: 'Times New Roman', sans-serif;
    background-color:whitesmoke;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    box-sizing: border-box;
    height: 100vh;
    overflow-x: hidden;
  }
  .sub_svg{
    width: 50px; 
    height:50px;
  }
  
  /*.user_number{*/
  /*  margin:20px;*/
  /*  position: absolute;*/
  /*  margin-top: -90px;*/
  /*  color: #573d9b;*/
  /*  font-size: small;*/
  /*  font-family:'Times New Roman', Times, serif;*/
    
  /*}*/
  hr{
    text-align:start;
    margin-left: auto;
    margin: 2px;
    width: 100%;
    
    
  }
  
  .logo{
            
    position:absolute;
    margin-top:-13px;
    text-decoration: none;
    width:60px;
    height:60px;
    border: #00000000 solid 0px;
    border-radius: 100%;
  }
  .title{
    font: optional;
    font-size: 14px;
    color:#6b6868;
    text-overflow: clip; 
    text-overflow: ellipsis;
    word-break: keep-all;
    word-break: break-all;
   
  }
  #load-box{
    position: fixed;
    bottom: 0;
    font-size: 12px;
    width: 100px;
    height:30px;
    border: none;
    margin-bottom: 0;
    margin-left:178vh;
    z-index: 1000;
    background-color: #583d9b3b;
    cursor: pointer;
  }
  #load-box:hover{
    background-color: #573d9b;
  }
  
  #more{
    display:none;
    width:1%;
   
  }
  #load-video{
    border-radius:20px;
    margin-left:20px;
    height: 20%;
    padding-top: 50px;
    color: hsl(0, 0%, 0%);
    margin-bottom:5px;
    background-color:rgba(255, 255, 255, 0); 
    display:inline-table;
    width:400px;
    
  }
  .profile_back{
    width: 100%;
    margin:5px;
    text-decoration: solid;
    background-color:  rgba(255, 255, 255, 0);
    max-width: 100%;
  } 
  .user_p{
    font-size: 20px;
    color: #000000;
    margin-left:20px;
    
  }
  .count_sub{
    font-size: 10px;
    color: #000000;
    margin-left:25px;
  }
  #profile_img{
    width: 100px;
    height: 100px;
    border: 0px solid #ffffff00;
    border-radius: 100%;
    margin-left:30px;
  }
  #desc{
    margin: 5px;
    color: #2c2727;  
    font-size: 14px;
    text-overflow: clip;
    text-overflow: ellipsis;
    word-break: keep-all;
    word-break: break-all; 
    
  }
  
  
  
  h1{
    position: absolute;
    margin: 10px;
    font-size: 30px;
    color: rgb(0, 0, 0);
    margin-top: -1px;
    margin-left: 65px;
    font-family:'Times New Roman', Times, serif; 
    
  } 
  
    
  h2{
    text-align: center;
    font-size:20px;
  }
  ul h3{
    color: hsl(0, 0%, 0%);;
    font-size: 60px;
    margin-top: -20px;
    list-style-type: none;
    
  }
  h3{
    text-align: center;
    font-size: 30px;
    margin-top: 50px;
  } 
  
  #log{
    margin-left: 85%;
    margin-top: -180px;
    color: #190823;
    width:100px;
    height: 100px;
    border: #00000000 solid 1px;
    border-radius: 100%;
    
  } 
    .overlay {
      height: 100%;
      width: 0;
      position: fixed;
      z-index: 1;
      top: 0;
      left: 0;
      background-color: rgba(0, 0, 0, 0.878);
      overflow-x: hidden;
      transition: 0.5s;
    }
    h6 {
      font-size: 14px;
      text-align:center;
      top:-20%;
      }
    .overlay-content {
      position: relative;
      top: 15%;
      width: 100%;
      text-align: center;
      margin-top: 30px;
      text-decoration: none;
     
    }
    .overlay i {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          margin-left:46%;
          transition: 0.3s; 
      }
      .overlay a img {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          margin-left:46%;
          transition: 0.3s; 
      }
    .overlay a {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          text-align: center;
          transition: 0.3s;
    }
  
      
    
    .overlay a:hover, .overlay a:focus {
      color:#000000 ;
      border-radius: 20px;
      width: 100%;
      height: 50px;
      font-size: 20px;
      background-color: rgb(130, 101, 216);
      box-sizing: border-box;
      box-shadow: 0px 0px 0px 0px;
      transform: matrix(120deg);
      transition: 0.3s;
  
    }
    
    .overlay .closebtn {
      position: relative;
      font-size: 20px;
      top: 30px;
      margin-left: 82%;
      color: #573d9b;
      width: 60px;
      height:50px;
    }

    @media screen and (max-height: 4500px){ 
      .overlay button{font-size: 30px}
  }
      .overlay .closebtn {
      font-size: 20px;
      top: 30px;
      right: 30px;
      margin-right: 30px;
      color: #573d9b;
      width: 60px;
      height:50px;
     
    }
  
   #ul_li {
      font-size: 15px;
      color: #614848;
      margin: 0px;
      list-style-type: none;
      width:300px;
  }
  
  #ul_li_2 {
      font-size: 15px;
      color: #614848;
      margin-left: 25%;
      margin-top: -12%;
      list-style-type: none;
  }
  
  #video_12{
    margin-left:5%;
    color: hsl(0, 0%, 0%);
    margin-bottom:5px;
    background-color:rgb(255, 255, 255); 
    display:inline-table;
    width:800px;
    }
  .video_13{ 
    border-radius: 15px;
    background-color: #000000;
    margin:0px 0px 10px 0px;
  
  }
  
  
  .video_home_box {
      border-radius: 10px 10px 0px 0px;
  }
  
  .video_home_box:hover {
      word-wrap: break-word;
      background-color: #f0f0f000;
      border: 0px solid #ffffff00;
      border-radius: 10px;
      box-shadow: 0px 1px 0px 0px;
      display: inline-table;
      transition: 0.10s;
      text-align: left;
      
      transform: scale(0.1.0.1,0.1.0.1);
  }
  .box_video {
      margin-top: -150%;
      margin-left: 76%;
      text-align: left;
      color: hsl(0, 0%, 0%);
      background-color: rgba(255, 255, 255, 0);
      height: 2000px;
      overflow-y: scroll;
      overflow-x: hidden;
      overflow: visible;
      display: list-item;
  
  }
  
  .video_list {
      margin-left:10px;
      color: hsl(0, 0%, 0%);
      margin-bottom: 5px;
      border-radius:20px;
      background-color: rgba(255, 255, 255, 0);
      display: inline-table;
      max-width: 200px;
      padding-top: 60px;
      
  }
  .imgvideo_box{
    width:40px;
    height:40px;
    margin: 2px;
    border: none;
    border-radius: 100%;
    margin-right:100%;
    margin-top:-25px;
  }
  #ul_li3{
    font-size:15px;
    color: #614848;
    margin: 5px;
    list-style-type: none;
   
    
  }
  
  
  #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left: 20px;
    border: none;
    z-index: 1000;
    background-color: #583d9b3b;
    cursor: pointer;
  }
  #load:hover{
    background-color: #7857cc;
  }
  
  #video{
   
    height: 40%;
    padding-top: 50px;
    color: hsl(0, 0%, 0%);
    margin-bottom:5px;
    background-color:rgba(255, 255, 255, 0); 
    display:inline-table;
    width: 100%;
    border-radius: 10px 10px 0px 0px;
    cursor: pointer;
  }
  /*#video:hover{*/
  /*  word-wrap:break-word;*/
  /*  display:inline-table;*/
  /*  transition: 0.10s;*/
  /*  text-align: left;*/
  /*  transform: scale(0.1.0.1,0.1.0.1); */
  /*}*/
  
  
  
  #imgvideo{
    width: 50px;
    height: 50px;
    
    margin-top:-20px;
    margin-right:100%;
    border-radius: 100%;
    border: solid rgba(0, 0, 0, 0) 1px;
  }
  
  .imgvideo{
    width: 50px;
    height: 50px;
    margin-top:-4%;
    margin-right: 85%;
    border-radius: 100%;
    border: solid rgba(0, 0, 0, 0) 1px;
  }
  p{
    font-size: 12px;
    margin: 5px;
    color: hsl(262, 46%, 60%);
    padding-bottom: 10px;
    padding-left: 20px;
    padding: 10px;
    text-decoration: none;
    text-transform: capitalize;
    text-rendering: auto;
    text-align:start;
    position: relative;
    line-height: 200%;
  }
  
  .user{
    font-size: 15px;
    color: hsl(0, 0%, 0%);
    margin-left:15%;
  }
  .user_sub{
    font-size: 20px;
    color: hsl(0, 0%, 0%);
    margin-left: -5%;
    margin:5px;
  }
  #user_name{
    font-size: 15px;
    color: hsl(0, 0%, 0%);
    margin-left:16%;
   
    
    
  }
  .user_name{
    font-size: 15px;
    color: #000000;
    margin-left:5vh;
    margin-top:-5%;
    
  }
  
  .user_name_comment{
    font-size: 15px;
    color: #000000;
    margin-left:10%;
    margin-top:-7%;
  }
  .user_name_replay{
    font-size: 15px;
    color: #000000;
    margin-left:10%;
    margin-top:-4%;
  }
  .register{
    width: 100%;
    margin:auto;
    
    border: 1px rgba(0, 0, 0, 0) solid;
    border-radius: 20px;
    box-shadow:  -2px -3px 6px 2px;
    background-color: #693aa7;
    
   
    
  }
    
  
  input{
    width:100%;
    height: 40px;
    padding: auto ;
    margin-left: 10px;
    margin: 10px;
    border-radius: 30px;
    
    font-size: 20px;
    text-align: center;
    color: rgb(0, 0, 0);
    
    outline: 0;
    background-color: #ffffff;
    margin-bottom: -30px;
    
  }
    
  
  
  .login{
    width: 100%;
    margin:auto;
    border: 1px rgba(0, 255, 255, 0.074) solid;
    border-radius: 20px;
    box-shadow:  -2px -3px 6px 2px; 
    background-color: #693aa7;
  
  }
  #PasswordReset {
    width:50%;
    height: 35px;
    font-size:10px;
    margin:35px;
    text-align: center;
    border: 1px rgba(0, 255, 255, 0.074) solid;
    border-radius: 20px;
    box-shadow:  -2px -3px 6px 2px;
    background-color: #5a3075;
  
  }
  a{
    text-decoration: none;
    color: black;
    cursor: pointer;
    font-size: 20px;
  }
  
  
  .Passwordchange{
    width: 100%;
    margin:auto;
    border: 1px rgb(0, 0, 0) solid;
    border-radius: 20px;
    background-color: #693aa7;
  
  }  
  .btn{
    width: 30%;
    font-size: 15px;
  }
  button{
    width: 20%;
    height: 40px;
    border: 1px solid;
    border-radius: 30px;
    margin-top: 20px;
    font-size: 20px;
    text-align: center;
    color: black;
    background-color: #5a3075;
    margin: 10px;
    margin-left: 40px;
    font-family: 'Times New Roman', Times, serif;
    box-shadow:  0px 0px 0px 0px ;
    cursor: pointer;
    text-decoration: none;
    
  }
    
  .Editprofile{
    width: 100%;
    margin:auto;
    border: 1px rgba(0, 0, 0, 0.074) solid;
    border-radius: 20px;
    /* box-shadow:  -2px -3px 6px 2px; */
    background-color: #693aa7;
  }
  .forgetpassword{
    width: 100%;
    margin:auto;
    margin-top: 10px;
    border: 1px rgb(0, 0, 0) solid;
    border-radius: 20px;
    box-shadow:  -2px -3px 6px 2px;
    background-color: #693aa7;
  
  } 
  .but{
    width: 20%;
    font-size: 15px;
  }
  .SetaNewPassword{
    width: 100%;
    margin:auto;
    border: 1px rgba(0, 255, 255, 0.074) solid;
    border-radius: 20px;
    box-shadow:  -2px -3px 6px 2px;
    background-color: #693aa7;
  
  } 
  #button{
    width: 50%;
    height: 40px;
    border: 1px solid;
    border-radius: 30px;
    margin-top: 20px;
    font-size: 20px;
    text-align: center;
    color: black;
    background-color: #5a3075;
    margin: 10px;
    margin-left: 40px;
    font-family: 'Times New Roman', Times, serif;
    box-shadow:  -2px -3px 6px 2px ;
    cursor: pointer;
    text-decoration: none;
  }  
  ul ol{
    width: 50%;
    margin:20px;
    list-style-type: none;
    border: 1px rgba(0, 255, 255, 0.074) solid;
    border-radius: 20px;
    box-shadow:  -2px -3px 6px 2px;
    background-color: rgb(48, 6, 75);
  }
  .un_sub{
    position: relative;
    width: 140px;
    height: 40px;
    border: 1px solid #00000000;
    border-radius: 30px;
    margin-top: 10px;
    font-size: 18px;
    text-align: center;
    color: rgb(0, 0, 0);
    background-color: rgb(60, 255, 0);
    margin: 10px;
    margin-left: 30px;
    font-family: 'Times New Roman', Times, serif;
    box-shadow:  0px 0px 0px 0px ;
    cursor: pointer;
    text-decoration: none;
  
    
  }
  
  .nav_imag{
    width:100px;
    height: 100px;
    border: #00000000 solid 1px;
    border-radius: 100%;
  }
  .sub{
    position: relative;
    width: 140px;
    height: 40px;
    border: 1px solid #00000000;
    border-radius: 30px;
    margin-top: 10px;
    font-size: 18px;
    text-align: center;
    color: rgb(0, 0, 0);
    background-color: rgb(255, 0, 0);
    margin: 10px;
    margin-left: 30px;
    font-family: 'Times New Roman', Times, serif;
    box-shadow:  0px 0px 0px 0px ;
    cursor: pointer;
    text-decoration: none;
  }
  
  .padding {
    padding: 3rem !important;
  }
  
  .user-card-full {
    overflow: hidden
  }
  
  .card {
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);
    box-shadow: 0 1px 20px 0 rgba(69, 90, 100, 0.08);
    border: none;
    margin-bottom: 10px
  }
  
  .m-r-0 {
    margin-right: 0px
  }
  
  .m-l-0 {
    margin-left: 0px
  }
  
  .user-card-full .user-profile {
    border-radius: 5px 0 0 5px
  }
  
  
  
  .user-profile {
    padding: 10px 
  }
  
  .card-block {
    padding: 1.25rem
  }
  .m-b-25 img{
    width:50px;
    height:50px;
    margin: 2px;
    margin-left:5px;
    margin-top:-35px;
  }
  div .m-b-25{
      width:10%;
  }
  #dit{
    margin: -25px;
    font-size: 17px;
  }
  .img-radius {
    border-radius: 100px;
    
  }
  #m-b-27 img{
    width: 40px;
    height: 40px;
    margin-top: -40px;
    margin-right: 85%;
  }
  .img-radius-replay{
    
    border-radius:100px;
  }
  
  .card .card-block p {
    line-height: 25px;
  }
  
  @media screen and (min-width: 1400px) {
    p {
        font-size: 20px;
    }
  }
  
  .card-block {
    padding: 1.25rem;
  }
  
  .b-b-default {
    border-bottom: 1px solid #ffffff;
  }
  
  .m-b-20 {
    margin-bottom: 20px;
  }
  
  .p-b-5 {
    padding-bottom: 5px !important;
  }
  
  .card .card-block p {
    line-height: 25px;
  }
  
  .m-b-10 {
    margin-bottom: 10px;
  }
  
  .text-muted {
    color: #919aa3 !important;
  }
  
  .b-b-default {
    border-bottom: 1px solid #6600ff;
  }
  
  .f-w-600 {
    font-weight: 600;
  }
  
  .m-b-20 {
    margin-bottom: 20px;
  }
  
  .m-t-40 {
    margin-top: 100px;
  }
  
  .p-b-5 {
    padding-bottom: 5px !important;
  }
  
  .m-b-10 {
    margin-bottom: 10px;
  }
  
  .m-t-40 {
    margin-top: 20px;
  }
  
  .user-card-full .social-link li {
    display: inline-block;
    
  }
  
  .user-card-full .social-link li a {
    font-size: 20px;
    margin: 0 10px 0 0;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  

  .delete_video{
    width: 0px;
    height: 0px;
    border: none;
    display:flex;
    font-size: 15px;
    margin-left: 95%;
    margin-top: -15%;
    cursor: pointer;
    text-decoration: none;
  } 
  .edit_video{
    
    border: 0px solid black;
    display:flex;
    font-size: 10px;
    margin-left: 82%;
    margin-top: -3.5%;
    cursor: pointer;
    text-decoration: none;
  }
  .scroll{
    width: 100%;
    height: 2000px;
    overflow-y:scroll;
    overflow-x: hidden;
    overflow: visible;
    display:list-item; 
  
  } 
  
  
  #ul_li3{
    font-size:15px;
    color: #614848;
    margin: 5px;
    list-style-type: none;
    display:inline-table;
  }
  #load_video_home{
    border-radius:20px;
    margin-left:15px;
    height: 20%;
    padding-top: 50px;
    color: hsl(0, 0%, 0%);
    margin-bottom:5px;
    background-color:rgba(255, 255, 255, 0); 
    display:inline-table;
    width:400px;
    
  }
  #more{
    display:none;
    width:400px;
   
  }
  .video{
    padding-top: 2px;
    height: 40%;
    color: hsla(143, 100%, 50%, 0);
    margin-bottom:5px;
    background-color:rgba(0, 0, 0, 0); 
    display: inline-table;
    margin:5%;
    padding:2px;
    text-align: left;
    cursor: pointer;
    width:400px;
    border-radius: 10px 10px 0px 0px;
  } 
  .video_reels{
    padding-top: 2px;
    height: 40%;
    color: hsla(143, 100%, 50%, 0);
    margin-bottom:5px;
    background-color:rgba(0, 0, 0, 0); 
    display: inline-table;
    margin:5%;
    padding:2px;
    text-align: left;
    cursor: pointer;
    width:400px;
    border-radius: 10px 10px 0px 0px; 
  }
  /*.video:hover{*/
  /*word-wrap:break-word;*/
  /*background-color: #f0f0f000;*/
  /*display:inline-table;*/
  /*transition: 0.10s;*/
  /*text-align: left;*/
  /*transform: scale(1.1,1.1); */
  /*margin: 10%;*/
  /*} */
  
.video_home{
    
    border-radius: 10px 10px 0px 0px;
    width:400px;
  }
  @media only screen and (max-width:1200px){
  .video .video_home{
      padding-top: 1px;
      padding:10px;
      margin:auto;
      display: inline-table;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
      width:100%;
      height: 60%;
      margin-left:-6%;
  }
   
  
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  }
  @media only screen and (max-width:1024px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
     margin-left:0;
  }
  div .video{
      width: 100%;
      margin:0 auto;
      padding:10px;
      margin-left:18%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  .video_reels{
      width: 100%;
      margin:0 auto;
      margin-left:-5%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #ul_li{
      margin-left:5%;
  }
  div .class{
      margin-left:5%;
  }
  }
  
  @media only screen and (max-width:992px){
  div .video_home{
     width:100%;
     margin:0 auto;
     padding:2px;
     border-radius: 10px 10px 0px 0px;  
     cursor: pointer;
  }
  div .video{
      width: 100%;
      margin:0 auto;
      padding:2px;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  .video_reels{
      width: 100%;
      margin:0 auto;
      padding:10px;
      margin-left:5%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:12%;
  }
  
  }
  @media only screen and (max-width:768px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 141%;
      margin:0 auto;
      margin-left: 0;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  .video_reels{
      width:198%;
      display:inline-table;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #ul_li{
      margin-left:5%;
  }
  div .class{
      margin-left:5%;
  }
  div .imgvideo{
      margin-left:2%;
  }
  div #video{
      width:140%;
      margin:0 auto;
      margin-left:-3%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-30px;
      margin-left:120%;
  }
  div .edit_video{
      margin-top:30px;
      margin-left:110%;
  }
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left: 9%;
  }
  }
  @media only screen and (max-width:640px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 130%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 166%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:131%;
      margin:0 auto;
      margin-left:-3%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:110%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:95%;
  } 
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:12%;
  }
  }
  @media only screen and (max-width:600px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 130%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 156%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:130%;
      margin:0 auto;
      margin-left:-20px;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:110%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:95%;
  } 
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:12%;
  }
  }
  @media only screen and (max-width:576px) {
  div .video_home{
     width: 100%;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 123%;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 150%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:123%;
      margin:0 auto;
      margin-left:-20px;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:95%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:85%;
  }
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  }
  .user{
      margin-left:12%;
  }
  }
  
  @media only screen and (max-width:467px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 111%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 123%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:111%;
      margin:0 auto;
      margin-left:-20px;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:90%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:80%;
  }
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  
  .user{
      margin-left:12%;
  }
  }
  @media only screen and (max-width:430px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 98%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 113.5%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:105%;
      margin:0 auto;
      margin-left:-3%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:80%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:70%;
  }  
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:15%;
  }
  }
  @media only screen and (max-width:425px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 106%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 112.5%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:106%;
      margin:0 auto;
      margin-left:-20px;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:85%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:70%;
  }
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  
  .user{
      margin-left:14%;
  }
  }
  @media only screen and (max-width:412px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 105%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 109%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:105%;
      margin:0 auto;
      margin-left:-20px;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:85%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:75%;
  } 
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:15%;
  }
  
  }
  @media only screen and (max-width:390px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 98%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 103.5%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:102%;
      margin:0 auto;
      margin-left:-20px;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:80%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:70%;
  }  
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:15%;
  }
  }
  @media only screen and (max-width:375px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 100%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 100%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:101%;
      margin:0 auto;
      margin-left:-3%;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:80%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:70%;
  }  
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:15%;
  }
  }
  @media only screen and (max-width:360px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 98%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 96%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #video{
      width:98%;
      margin:0 auto;
      margin-left:-20px;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:80%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:70%;
  }  
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:15%;
  }
  }
  @media only screen and (max-width:320px){
  div .video_home{
     width: 100%;
     margin:0 auto;
     margin-left:0;
     border-radius: 10px 10px 0px 0px;
     cursor: pointer;
  }
  div .video{
      width: 93%;
      margin:0 auto;
      padding:2px;
      margin-left:0;
  }
  .video_reels{
      width: 86%;
      margin:0 auto;
      margin-left:-8%;
      border-radius: 10px 10px 0px 0px;
      cursor: pointer;
  }
  div #ul_li{
      margin-left:5%;
  }
  div .imgvideo{
      margin-left:5%;
  }
  div #video{
      width:93%;
      margin:0 auto;
      margin-left:-20px;
  }
  div .delete_video{
      margin-bottom:-55px;
      margin-left:80%;
  }
  div .edit_video{
      margin-top:55px;
      margin-left:65%;
  } 
  button #load{
    width: 100px; 
    height:30px;
    font-size:14px;
    margin-left:30px;
    border: none;
    z-index: 1;
    background-color: #583d9b3b;
    cursor: pointer;
  } 
  .user{
      margin-left:18%;
  }
  }
  
  .video_search{
    margin: 2px;
    color: hsl(0, 0%, 0%);
    margin-bottom:-20px;
    margin-top:-5%;
    background-color:rgba(255, 255, 255, 0); 
    padding:35px;
    border: 1px solid #ffffff00;
    width:530px;
    cursor: pointer;
    border-radius:10px;  
  }
  #ul_li_2{
    font-size:15px;
    color: #614848;
    margin: 5px;
    margin-top:5%;
    margin-left:10px;
    list-style-type: none;
  }
  #video_sub{
    
    margin: 2px;
    color: hsl(0, 0%, 0%);
    margin-bottom:5px;
    background-color:rgba(255, 255, 255, 0); 
    display:flex;
    padding:35px;
    border: 1px solid #ffffff00;
    border-radius:10px;
    max-width: 100%;
    cursor: pointer;
    
    
    
  }
  .video_home:hover{
    word-wrap:break-word;
    background-color: #f0f0f000;
    border: 0px solid #ffffff00;
    border-radius: 10px;
    box-shadow: 0px 1px 0px 0px;
    display:inline-table;
    transition: 0.10s;
    text-align: left;
    transform: scale(0.1.0.1,0.1.0.1); 
   
  } 
  
  .vid_25{
    margin-right:20%;
    margin-top: -5%;
  
  }
  div .download-btn{
   
    width: 5%;
    margin-left: 93%;
    margin-top: -14%;
    cursor: pointer;
  
  }
  div .download-btn i{
     font-size:40px; 
  }
  span .ditaile_span{
      margin-top:60%;
  }
  .detail_title{
    font-size: 16px;
    color: #000000;
    margin-top:-90%;
    margin-left:3%;
  }
  #btn_1{
    margin-left:70%;    
    margin-top: -120px;
    cursor: pointer;
    }  
  .btn_lik_dis_lik{
    position: relative;    
    border: solid 1px;
    color: rgba(255, 222, 173, 0);
    width:105px;
    margin-left: 76%;  
    font-size: 10px;
    margin-top:5px;
    cursor: pointer;
  }
  .desc_input_1{
    width: 100%;
    height: 100%;
    border:none;
    border-radius: 20px;
    box-shadow:0px 1px 0px 0px;
    text-decoration: none;
    align-items: baseline;
    display: flex;
    position: relative;
    background-color: whitesmoke;
    color: #000000;
    resize: none;
    font-size: 16px;
    outline: none;
    overflow: hidden;
  
  }
  .form_body{
    width: 100%;
    padding:40px;
    margin: 0 auto;
    padding-top: 5px;
    color: hsl(0, 0%, 0%);
    margin-bottom:50px;
    background-color: #693aa7;
    display:inline-table;
    border: 0px solid rgba(117, 98, 227, 0);
    border-radius: 20px;
    text-align: center;
  }
  .bt{
    width: 30%;
  }
  .share_btn{
    border:solid 1px;
    color: rgba(255, 222, 173, 0);
    width: 35px;
    height: 35px;
    position:relative;
    font-size: 30px;
    margin-left: 85%;
    margin-bottom: 8%;
    cursor: pointer;
    
  }
  
  .share_options{
    position:relative;
    margin-top: -45%;
    bottom: 30%;
    left: 30%;
    width: 300px;
    height: 400px;
    transform-origin: 20px;
    transform: scale(0);
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    background-color:rgba(84, 59, 148, 0.523);
    font-family: 'roboto';
    transition: 0.5s;
    transition-delay: 0.5s;
    z-index: 2;
  }
  .share_options.active{
    transform: scale(1);
    transition-delay: 0s;
  }
  .social_media{
    
    width: 250px;
    height: 120px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px 0px;
  }
  #social_media_btn{
    width: 50px;
    height: 50px;
    border: none;
    border-radius: 50%;
    line-height: 50px;
    background-color: rgba(255, 222, 173, 0);
    margin: 10px 10px;
    cursor: pointer;
    text-align: center;
    
  }
  
  .user_box{
    font-size: 15px;
    color: hsl(0, 0%, 0%);
    margin-left:15%;
  }
  
  
  .link-container{
    position: relative;
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    border-radius: 40px;
    background-color: #ffffff;
    overflow: hidden;
    padding: 0 10px;
    
    
  }
  
  .copy_btn{
    position: absolute;
    right: 0;
    cursor: pointer;
    background-color: #000000;
    color: #f0f0f0;
    height: 10%;
    width: 30%;
    text-transform: capitalize;
    font-size: 16px;
    margin-top: -10px;
  }
  .container{
   
    margin: -48px;
  }
  #img-btn-like-comment{
    font-size: 5%;
    margin-left:10%;
   
  }
  #img-btn-unlike-comment{
    font-size: 5px;
    
  }
  .comment{
    width: 12%;
    height: 10%;
    padding:10px;
    margin-left: 87%;
    margin-top:10px;
    border:0px solid whitesmoke;
    font-size:16px;
    border-radius: 30px; 
    box-shadow: 0px 0px 9px 0px;
    background-color: #5a3075;
    color: black;
    cursor: pointer;
  }
  .reset-input-commrnt{
    width: 10%;
    height: 10%;
    padding:10px;
    margin-left: 80%;
    margin-top:-20px;
    border:0px solid whitesmoke;
    font-size:16px;
    border-radius: 30px; 
    box-shadow: 0px 0px 9px 0px;
    background-color:whitesmoke;
    color: black;
    cursor: pointer;
    
  
  }
  .replaycomment{
    width: 12%;
    height: 10%;
    padding:10px;
    margin-left: 87%;
    border:0px solid whitesmoke;
    font-size:16px;
    border-radius: 30px; 
    box-shadow: 0px 0px 9px 0px;
    background-color: #5a3075;
    color: black;
    cursor: pointer;
    
  }
  
  .input-comment{
    border:none;
    box-shadow:0px 1px 0px 0px;
    text-decoration: none;
    align-items: baseline;
    width:100%;
    height:1em;
    display: flex;
    position: relative;
    background-color: whitesmoke;
    color: #000000;
    resize: none;
    font-size: 16px;
    outline: none;
    overflow: hidden;
    
  }
  ul li.comment-1{
    color: #000000;
    padding: auto;
    font-size: 12px;
    margin-right: 5px;
    text-overflow: clip; 
    text-overflow: ellipsis;
    word-break: keep-all;
    word-break: break-all; 
    list-style-type: none;
    margin-left:5%;
  }
  ul li.comment-replay{
    color: #501414;
    padding: auto;
    font-size: 12px;
    margin-right: 5px;
    text-overflow: clip; 
    text-overflow: ellipsis;
    word-break: keep-all;
    word-break: break-all; 
    list-style-type: none;
    margin-left:5%;
  }
  li{
      font-size:12px;
      margin-left:5%;
  }
  ul li .date-time{
    font-size: 10px;
    color: #6e6666;
    list-style-type: none;
    
  
  }
  #tags{
    font-size: 12px;
    color: #000b45;
    text-overflow: clip; 
    text-overflow: ellipsis;
    word-break: keep-all;
    word-break: break-all; 
  
  }
  #m-b-26 img{
    width: 50px;
    height: 50px;
    margin-top: -20px;
    margin-right: 85%;
  }
  @media only screen and (min-width:1320px){
  div #load-box{
      margin-left:83%;
  }   
  }
  @media only screen and (max-width:1200px){
  
      div #video_12{
          margin:2 auto;
          overflow-x: hidden;
      } 
      div .video_13{
          
          margin:0 auto;
          border-radius: 15px;
          background-color: #000000;
      }
       #ul_li {
          font-size: 15px;
          color: #614848;
          margin: 0px;
          list-style-type: none;
          width:115%;
          
      }
  
   
  
  }
  @media only screen and (max-width:1024px){
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
  
      div .video_13{
          width:100%;
          margin:0 auto;
          border-radius: 15px;
          background-color: #000000;
      }
  }
  
  
  @media only screen and (max-width:992px){
  .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:93.5%;
          margin:0 auto;
      }
      div .video_13{
          width:93.5%;
          margin:0 auto;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-12%;
      }
      div #btn_1{
          width:20%;
          margin-left:55%;    
          margin-top: -5%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 60%;
          margin-top:2%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-20%;
          bottom: 30%;
          left: 0;
          width: 400px;
          height: 230px;
          display:flex;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:2px;
          display:flex;
      } 
      div .copy_btn{
          height:16%;
          margin-left:35%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 80%;
        margin-top: -14%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:-3%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:67%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:67%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-2%;
      }
      .m-b-25{
          margin:10%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-bottom:-2%;
      }
      div .user_name_replay{
          margin:5%;
          margin-bottom:-2%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-8%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-8%;
      }
      ul li{
          margin:5%;
          margin-bottom:12%;
      }
  }
  @media only screen and (max-width:800px){
  
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:93.5%;
          margin:0 auto;
      }
      div .video_13{
          width:93.5%;
          margin:0 auto;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-12%;
      }
      div #btn_1{
          width:20%;
          margin-left:50%;    
          margin-top: -6%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 60%;
          margin-top:2%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-28%;
          bottom: 30%;
          left: 0;
          width: 400px;
          height: 230px;
          display:flex;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:2px;
          display:flex;
      } 
      div .copy_btn{
          height:16%;
          margin-left:35%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 80%;
        margin-top: -15%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:-3%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:67%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:67%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin:12%;
          margin-top:2%;
      }
      div .user_name_comment{
          margin:5%;
          margin-bottom:-2%;
      }
      div .user_name_replay{
          margin:5%;
          margin-bottom:-2%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-8%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-8%;
      }
      ul li{
          margin:5%;
          margin-bottom:12%;
      }
  }
  @media only screen and (max-width:768px){
  
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-12%;
      }
      div #btn_1{
          width:20%;
          margin-left:65%;    
          margin-top: -6%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 72%;
          margin-top:2%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-30%;
          bottom: 30%;
          left: 0;
          width: 400px;
          height: 230px;
          display:flex;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:2px;
          display:flex;
      } 
      div .copy_btn{
          height:16%;
          margin-left:35%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 92%;
        margin-top: -30%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:3%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:67%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:67%;    
      }
      ul li.comment-replay{
          margin-top:-8%;
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin-left:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin:12%;
          margin-top:2%;
          margin-left:-3%;
      }
      div .user_name_comment{
          margin:5%;
          margin-bottom:-2%;
      }
      div .user_name_replay{
          margin:5%;
          margin-bottom:-2%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-8%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-8%;
         
      }
      .replay_datetime{
          margin-top:-4%;
      }
      ul li{
          margin:5%;
          margin-bottom:12%;
      }
      div .video_search{
          width:122%;
          margin-left:-5%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:2%;
      }
      .hide_comment{
          margin-left:-20%;
      }
     
  }
  @media only screen and (max-width:600px){
  
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-12%;
      }
      div #btn_1{
          width:20%;
          margin-left:55%;    
          margin-top: -6%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 67%;
          margin-top:2%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-42%;
          bottom: 30%;
          left: 0;
          width: 400px;
          height: 230px;
          display:flex;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:2px;
          display:flex;
      } 
      div .copy_btn{
          height:16%;
          margin-left:35%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 90%;
        margin-top: -40%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:6%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:67%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:67%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin:12%;
          margin-top:2%;
          margin-left:-3%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-12%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-9%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-4%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-8%;
      }
      ul li{
          margin:5%;
          margin-bottom:12%;
      }
      div .video_search{
          width:130%;
          margin-left:-8%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
      }
      .hide_comment{
          
          margin-left:-45%;
      }
     
  }
  @media only screen and (max-width:576px) {
  
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width:100%;
          padding-top: 60px;
          
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      }
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
  
       .overlay i {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          margin-left:40%;
          transition: 0.3s; 
      }
      .overlay a img {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          margin-left:40%;
          transition: 0.3s; 
      }
      
      div .vid_25{
          margin-top:-20%;
      }
      div #btn_1{
          width:20%;
          margin-left:58%;    
          margin-top: -3%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 70%;
          margin-top:8%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-45%;
          bottom: 30%;
          left: 0;
          width: 400px;
          height: 230px;
          display:flex;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:2px;
          display:flex;
      } 
      div .copy_btn{
          height:16%;
          margin-left:35%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 90%;
        margin-top: -32%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:3%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:72%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:72%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:2%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-12%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-9%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-5%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-8%;
      }
      ul li{
          margin:5%;
          margin-bottom:12%;
      }
      div .video_search{
          width:130%;
          margin-left:-9%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:3%;
      }
      .hide_comment{
          margin-left:-45%;
      }
  
  }    
  
  @media only screen and (max-width:467px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:89%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
  
       .overlay i {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          margin-left:43%;
          transition: 0.3s; 
      }
      .overlay a img {
          padding: 8px;
          text-decoration: none;
          font-size: 20px;
          color: #ffffff;
          display:flex;
          flex-wrap: wrap;
          margin-left:43%;
          transition: 0.3s; 
      }
          div .vid_25{
          margin-top:-20%;
      }
      div #btn_1{
          width:20%;
          margin-left:50%;    
          margin-top:-8%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 67%;
          margin-top:-16%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-35%;
          bottom: 30%;
          left: 0;
          width: 400px;
          height: 230px;
          display:flex;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:2px;
          display:flex;
      } 
      div .copy_btn{
          height:16%;
          margin-left:35%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 88%;
        margin-top: -46%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:5%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:73%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:73%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-10%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-8%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-8%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-8%;
      }
      ul li{
          margin:5%;
          margin-bottom:12%;
      }
      div .video_search{
          width:139%;
          margin-left:-12.5%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:3%;
          margin-left:5%;
      }
      .hide_comment{
          margin-left:-80%;
      }
  }
  @media only screen and (max-width:430px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-16%;
      }
      div #btn_1{
          width:20%;
          margin-left:50%;    
          margin-top: -1%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 68%;
          margin-top:1%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-55%;
          bottom: 30%;
          left: 0;
          width: 365px;
          height: 230px;
          display:flex;
      }
      div .link-container{
          margin-left:0;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:0;
          display:flex;
      } 
      div .copy_btn{
          height:18%;
          margin-left:85%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 90%;
        margin-top: -56%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:8%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:67%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:67%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-14%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-11%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-8%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-6%;
      }
      ul li{
          margin:5%;
          margin-top:3%;
      }
      div .video_search{
          width:141%;
          margin-left:-14%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
          margin-left:3%;
      }
      .hide_comment{
          margin-left:-80%;
      }
  }
  @media only screen and (max-width:425px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-16%;
      }
      div #btn_1{
          width:20%;
          margin-left:43%;    
          margin-top: -1%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 62%;
          margin-top:1%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-55%;
          bottom: 30%;
          left: 0;
          width: 365px;
          height: 230px;
          display:flex;
      }
      div .link-container{
          margin-left:0;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:0;
          display:flex;
      } 
      div .copy_btn{
          height:18%;
          margin-left:85%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 88%;
        margin-top: -56%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:8%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:72%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:72%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-13%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-10%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-5%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-6%;
      }
      ul li{
          margin:5%;
          margin-top:5%;
      }
      div .video_search{
          width:141%;
          margin-left:-14.5%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
          margin-left:3%;
      }
      .hide_comment{
          margin-left:-95%;
      }
  }
  @media only screen and (max-width:412px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-16%;
      }
      div #btn_1{
          width:20%;
          margin-left:43%;    
          margin-top: -1%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 60%;
          margin-top:1%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-60%;
          bottom: 30%;
          left: 0;
          width: 365px;
          height: 230px;
          display:flex;
      }
      div .link-container{
          margin-left:0;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:0;
          display:flex;
      } 
      div .copy_btn{
          height:18%;
          margin-left:85%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 85%;
        margin-top: -57%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:9%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:73%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:73%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-14%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-7%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-7%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-6%;
      }
      ul li{
          margin:5%;
          margin-top:3%;
      }
      div .video_search{
          width:142.5%;
          margin-left:-15%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
          
      }
      .hide-comment{
          margin-left:-98%;
      }
  }
  
  
  @media only screen and (max-width:375px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-25%;
      }
      div #btn_1{
          width:20%;
          margin-left:46%;    
          margin-top: -1%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 63%;
          margin-top:1%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-65%;
          bottom: 30%;
          left: 0;
          width: 365px;
          height: 230px;
          display:flex;
      }
      div .link-container{
          margin-left:0;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:0;
          display:flex;
      } 
      div .copy_btn{
          height:18%;
          margin-left:85%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 89%;
        margin-top: -57%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:7%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:73%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:73%;    
      }
      div #desc{
          margin-left:5%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-13%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-7%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-7%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-6%;
      }
      ul li{
          margin:5%;
          margin-top:-6%;
      }
      div .video_search{
          width:147.5%;
          margin-left:-17.5%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
      }
      .hide-comment{
          margin-left:-17%;
          margin-top:-15%;
      }
  }
  @media only screen and (max-width:360px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:88%;
          margin-left:-5%;
      }
      div .video_13{
          width:100%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
          margin-top:-19%;
      }
      div #btn_1{
          width:35%;
          margin-left:44%;    
          margin-top: -1%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 63%;
          margin-top:1%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-70%;
          bottom: 30%;
          left: 0;
          width: 365px;
          height: 230px;
          display:flex;
      }
      div .link-container{
          margin-left:0;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:0;
          display:flex;
      } 
      div .copy_btn{
          height:18%;
          margin-left:85%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 88%;
        margin-top: -66%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:9%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:73%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:73%;    
      }
      div #desc{
          margin-left:2%;
          
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:5%;
          margin-top:-5%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:5%;
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-13%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-8%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-7%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-6%;
      }
      ul li{
          margin:5%;
          margin-top:-5%;
      }
      div .video_search{
          width:150.5%;
          margin-left:-19%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
      }
      .hide_comment{
          margin-left:-98%;
      }
  }
  @media only screen and (max-width:320px){
      .video_list {
          margin-left:10px;
          color: hsl(0, 0%, 0%);
          margin-bottom: 5px;
          border-radius:20px;
          background-color: rgba(255, 255, 255, 0);
          display: none;
          visibility: hidden;
          max-width: 100%;
          padding-top: 60px;
      }
      .box_video {
          visibility: hidden;
          overflow-y: hidden;
          overflow-x: hidden;
          overflow: hidden;
          display: none;
      } 
      #video_12{
          width:89%;
          margin-left:-5%;
      }
      div .video_13{
          width:89%;
          margin-left:0;
          border-radius: 15px;
          background-color: #000000;
      }
      div .vid_25{
       
          margin-top:-17%;
      }
      .detail_title{
         font-size:12px; 
      }
      div #btn_1{
          width:40%;
          margin-left:33%;    
          margin-top: -10%;
          cursor: pointer;
      }
      div .share_btn_12{
          width:12%;
          margin-left: 50%;
          margin-top:-9%;
          cursor: pointer;
    
      }
      div .social_media{
          width:100%;
          height:50%;
          left:0;
      }
      div .share_options{
          position:relative;
          margin-top:-65%;
          bottom: 30%;
          left: 0;
          width: 365px;
          height: 230px;
          display:flex;
      }
      div .link-container{
          margin-left:-14;
      }
      img{
          left:0 auto;
          margin-top:5%;
          width:30px;
          height:30px;
      }
      div #social_media_btn{
          width:30px;
          height:30px;
          padding:2px;
          left:0;
          display:flex;
      } 
      div .copy_btn{
          height:18%;
          margin-left:82%;
      }
      div .download-btn {
   
        width: 5%;
        margin-left: 76%;
        margin-top: -58%;
        cursor: pointer;
  
      }
      
      div .ditaile_span{
          margin-top:8%;
          margin-left:2%;
      }
     
      form .comment{
          font-size:14px;
          width:25%;
          margin-left:63%;
      }
      form .replaycomment {
          font-size:14px;
          width:25%;
          margin-left:63%;    
      }
      div #desc{
          margin-left:1%;
          margin:1%;
      }
      label{
          margin-left:5%;
      }
      div .user_name{
          margin:7%;
          margin-top:-7%;
      }
      .m-b-25{
          margin-left:-3%;
          margin-top:2%;
          
      }
      div .user_name_comment{
          margin:5%;
          margin-top:-13%;
      }
      div .user_name_replay{
          margin:5%;
          margin-top:-7%;
      }
      #m-b-27{
          margin:5%;
          margin-top:-4%;
      }
      .like-comment-btn{
          margin:5%;
          
      }
      .comment-1{
          margin:5%;
          margin-top:-6%;
      }
      ul li{
          margin:5%;
          margin-top:-5%;
      }
      div .video_search{
          width:158%;
          margin-left:-22.5%;
      }
      div #video_sub{
          display:inline-table;
          width:100%;
          margin-left:-5%;
      }
      div #ul_li_2{
          margin-top:-5%;
      }
      .hide_comment{
          margin-top:-12%;
          margin-left:-140%;
      }
  }
  
  
  .hide-btn{
      width: 30px;
      height: 30px;
      margin-left: 65%;
      margin-top:1.5%;
      
  }
  .messages {
    list-style: none;
    margin: 1em 0 2em;
    padding: 0;
  }
  
  .messages div {
    padding: 1em;
    width: 100%;
    line-height: 2.0em;
  }
  
  .messages div.info, .messages div.debug {
    background-color: #d0ebff;
  }
  
  .messages div.success {
    background-color: #b2f2bb;
  }
  
  .message li.warning {
    background-color: #ffec99;
  }
  
  .messages li.error {
    background-color: #ffe3e3;
  }