#myInput, #myInput2, #myInput3, #myInput4 {
  background-image: url('/assets/searchicon.png'); /* Add a search icon to input */
  background-size: 20px 20px;
  background-position: 10px 12px; /* Position the search icon */
  background-repeat: no-repeat; /* Do not repeat the icon image */
  width: 100%; /* Full-width */
  font-size: 16px; /* Increase font-size */
  padding: 12px 20px 12px 40px; /* Add some padding */
  border: 1px solid #ddd; /* Add a grey border */
  margin-bottom: 12px; /* Add some space below the input */
}

/* Split the screen in half */
.split {
  height: 100%;
  width: 50%;
  position: fixed;
  z-index: 1;
  /* top: 0;  */
  overflow-x: hidden;
  padding-top: 20px;
}

/* Control the left side */
.left {
  left: 0;
  background-color: #e2dbd12b;
}

/* Control the right side */
.right {
  right: 0;
  background-color: #ffffff;
}

/* If you want the content centered horizontally and vertically */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.centered-60{
      top: 60%;
}
/* Style the image inside the centered container, if needed */
.centered img {
  width: 100%;
}

.down-right{
  position: absolute;
  top: 10%;
  left: 30%;
  transform: translate(-30%, -30%);
  text-align: justify;
}

html,
body {
  height: 110%;
}

#page-content {
  flex: 1 0 auto;
}

#sticky-footer {
  flex-shrink: none;
  height: 10%;
  background-color: #ffffff;
}

.green {
    background-color: #e6e1da;
}

.abs-center-x {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

h1 {
    overflow: hidden;
    text-align: center;
    padding-bottom: 30px;
}
h1:before,
h1:after {
    background-color: #000;
    content: "";
    display: inline-block;
    height: 1px;
    position: relative;
    vertical-align: middle;
    width: 50%;
}
h1:before {
    right: 0.5em;
    margin-left: -50%;
}
h1:after {
    left: 0.5em;
    margin-right: -50%;
}

#top1, #top2, #top3 {
    max-width: 20%;
    margin-left: 10%;
    box-shadow: 10px 10px 5px #888;
}


.table{
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 10px 10px 5px #888;
box-shadow: 10px 10px 5px 5px #888;
}

.table td {
    border-top: 5px solid #e6e1da !important;
}

.align-items-center{
    box-shadow: 10px 10px 5px #888;
}

.img-thumbnail{
    max-width: 75% !important;
    padding: 0 !important;
}

.wider{
    width: 120%;
    margin-left: -10%;
}

a{
  color: black !important;
}

.heart{
font-size: 2em; 
padding-right:10px;  
color: Tomato;   
}

.thumb{
font-size: 2em; 
padding-right:10px;  
color: rgb(26, 9, 172);   
}

.rotate{
    -moz-transition: all 2s linear;
    -webkit-transition: all 2s linear;
    transition: all 2s linear;
    
}

.rotate.down{
    -ms-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.blue{
  color: blue !important;
}

#movieBody{
  height:100% !important;
}