body{
	font-size:19px;
}
table{
	width: 50%;
	margin: 30px auto;
	border-collapse: collapse;
	text-align: left;
}
tr{
	border-bottom: 1px solid #cbcbcb;
}
th, td{
	border: none;
	height: 30px;
	padding: 2px;
}
tr:hover{
	background: #f5f5f5;
}
form{
	width: 45%;
	margin: 50px auto;
	text-align: left;
	padding: 20px;
	border: 1px solid #bbbbbb;
	border-radius: 5px;
}
.input-group{
	margin: 10px 0px 10px 0px;
}
.input-group label{
display: block;
text-align: left;
margin: 3px;
}
.input-group input{
	height: 30px;
	width: 93px;
	padding: 5px 10px;
	font-size: 16px;
	border-radius: 5px;
	border: 1px solid gray;
}
.btn{
	padding: 10px;
	font-size: 15px;
	color: white;
	background: #5f9ea0;
	border: none;
	border-radius: 5px;
}
.msg{
	margin: 30px auto;
	padding: 10px;
	border-radius: 5px;
	color: #3c763d;
	background: #dff0d8;
	border: 1px solid #3c763d;
	width: 50%;
	text-align: center:

}
.edit_btn{
	text-decoration: none;
	padding: 2px 5px;
	background: #2E8B57;
	color: white;
	border-radius: 3px;
}
.del_btn{
	text-decoration: none;
	padding: 2px 5px;
	background: #2E8B57;
	color: white;
	border-radius: 3px;
	background: #800000;
}

#videos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2em;
  }
  .video-player {
    width: 100%;
    height:300px;
    background-color: black;

  }
  
  video {
    width: 100%;
    border:2px solid greenyellow;
    background-color: rgb(63, 62, 62);

  }

  textarea{
    height: 50px;
    width: 100%;
  }
  
  .step{
    background-color: beige;
    padding: 10px;
    margin: 10px;
  }

  .step p{
    margin: 0;
  }


@media screen and (max-width:800px) {
    body{
      width: 100%;
    }
}