body{
    background-color: #0d0d0d;
    position: relative;
}
a{
  text-decoration: none;
  color: inherit;
}
.loading{
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  background-color: #181c22;
  z-index: 100;
}
.loader {
  width: 50px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: 
    radial-gradient(farthest-side,#4d4c4a 94%,#0000) top/8px 8px no-repeat,
    conic-gradient(#0000 30%,#4d4c4a);
  -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 8px),#000 0);
  animation: l13 1s infinite linear;
}
@keyframes l13{ 
  100%{transform: rotate(1turn)}
}
.top{
  background-color:black;
  color: white;
  position: fixed;
  border-radius: 50%;
  font-size: 15px;
  width: 40px;
  height: 40px;
  right: 15px;
  bottom: 15px;
}
.sidebar{
 height: 100vh;
 background-color: #0d0d0d;
 z-index: 100;
 top: 0;
}
 ul li {
  list-style: none;
}
.sidebar-control{
  right: -27%;
  top: 0;
  background-color: white;
  height: 100vh;
  z-index: 10;
  width: 70px;
}
.types ul li a{
  transition: color 0.5s;
}
.social span{
  color: hsl(354, 56%, 42%)!important;
}
.types ul li a:hover{
  color:#b02a37!important ;
}
.sidebar-control img{
  width: 40px ;
  height: 50px;
  object-fit: contain;
  margin-inline: auto;
}
.form-control:focus {
  box-shadow: none;
  border: white 1px solid;
}
.hidden-layer {
  background-color: #181c22d8;
 opacity: 0 !important;
 transition: opacity 1s;
 width: fit-content;
}
.cont-div:hover .hidden-layer {
  opacity: 1 !important;
}
 .cont-div:hover .title {
  animation:fadeInDown 1s ;
} 

.cont-div:hover .movie-dis {
  animation: flipInX 1s;
}
.w-fit{
    width: fit-content;
}
.cont-div:hover .hidden-layer ul li{
  animation:fadeInUp 1s ;
}
.cont-div img{
    transition: all 1s;
    height: 550px;
    object-fit: contain;
}
.cont-div:hover img{
    transform: rotate(5deg)  scale(1.25) ;
}
.input{
    width: 48%;
}
.inputs input{
    border: none;
    border-bottom: solid 2px white;
    background-color: transparent;
    padding: 10px;
    color: white;
    width: 100%;
}
.inputs input:focus{
    outline: none;
}
.inputs input::placeholder{
    text-align: center;
    font-size: 17px;
    font-weight:200;
}