@CHARSET "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Poiret+One&display=swap');
body {background:#ffffff;}
body {color:#000000;}
.content {min-height: 700px;}
a {	cursor: pointer;outline: none;text-decoration: none;}
a {color:#000000;}
a img {border:0;}
.logo {font-family: 'Poiret One', cursive; font-weight: bold;font-size: 2rem;color: #000000;}
.ban a {text-decoration: none;}
.ban .card {
  margin-top: 20px;
  margin-left: 20px;
  border-radius: 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
  border: 0px;
}
.ban .card a img {
  border-radius: 20px;

}
.ban .card .datetime{
  box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
  background: #6C3DAE;
  border-radius: 10px;
  width: 70px;
  height: 70px;
  position: absolute;
  margin: 16rem 0px 0px 10px;
  text-align: center;
  font-size: 25px;
  color: #ffffff;
  font-weight:bold;

}
.ban .card .datetime>p{
  text-align: center;
  font-size: 15px;
  line-height: 0.9em;
  color: #ffffff;
  font-weight:lighter;
}
.ban .card .card-title{
  padding-top: 1rem;
  font-size: 15px;
  line-height: 1.2em;
  color: #000000;
  height: 3rem;
  display: inline-block;
}
.ban .card .card-hall{
  height: 20px;
  display: inline-block;
}
.ban .card .card-text{
  padding-bottom: 0px;
  line-height: 1em;
}
.ban .card .card-text>p{
  font-size: 15px;
  color: #708090;
}
.ban .card .card-text>i{
  font-size: 25px;
  color: #191970;
  position: absolute;
  right: 30px;
  top:80%;
}

@media (min-width: 992px) {
  .ban .card {
    width: 40rem;
  }
  .ban .card .datetime{
    margin: 15rem 0px 0px 10px;

  }
  .ban .card .card-text>i{
  top:17.5rem;
  right: 10px;

  }
}
@media (max-width: 576px) {
  .ban .card {
    width: 70rem;
  }
  .ban .card .datetime{
    width: 50px;
    height: 50px;
    position: absolute;
    margin: 11rem 0px 0px 10px;
    font-size: 18px;
  }
  .ban .card .datetime>p{
    text-align: center;
    font-size: 10px;
    line-height: 0.9em;
    color: #ffffff;
    font-weight:lighter;
  }
  .ban .card .card-title{
    padding-top: 0.5rem;
    font-size: 15px;
    color: #000000;
    height: 3rem;
    display: inline-block;
  }
  .ban .card .card-hall{
    height: 15px;
    display: inline-block;
  }
  .ban .card .card-text{
    padding-bottom: 0px;
    line-height: 1em;
  }
  .ban .card .card-text>p{
    font-size: 15px;
    color: #708090;
  }
  .ban .card .card-text>i{
    font-size: 25px;
    color: #191970;
    position: absolute;
    right: 10px;
    top:13.5rem;
  }

  @media only screen
    and (device-width : 414px)
    and (device-height : 896px)
    and (-webkit-device-pixel-ratio : 2) {
      .ban .card {
        width: 11rem;
      }
      .ban .card .datetime{
        width: 50px;
        height: 50px;
        position: absolute;
        margin: 12rem 0px 0px 10px;
        font-size: 18px;
      }
      .ban .card .card-text>i{
        font-size: 25px;
        color: #191970;
        position: absolute;
        right: 10px;
        top:14rem;
      }


     }

 }


 .today a {text-decoration: none;}
 .today .card {
   margin-top: 20px;
   margin-left: 20px;
   border-radius: 20px;
   border: 0px;
 }
 .today .card a img {
   border-radius: 10px;

 }
 .today .card .datetime{
   box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
   background: #6C3DAE;
   border-radius: 10px;
   width: 70px;
   height: 70px;
   position: absolute;
   margin: 16rem 0px 0px 10px;
   text-align: center;
   font-size: 25px;
   color: #ffffff;
   font-weight:bold;

 }
 .today .card .datetime>p{
   text-align: center;
   font-size: 15px;
   line-height: 0.9em;
   color: #ffffff;
   font-weight:lighter;
 }
 .today .card .card-title{
   padding-top: 1rem;
   font-size: 15px;
   line-height: 1.2em;
   color: #000000;
   height: 3rem;
   display: inline-block;
 }
 .today .card .card-hall{
   height: 20px;
   display: inline-block;
 }
 .today .card .card-text{
   padding-bottom: 0px;
   line-height: 1em;
 }
 .today .card .card-text>p{
   font-size: 15px;
   color: #708090;
 }
 .today .card .card-text>i{
   font-size: 25px;
   color: #191970;
   position: absolute;
   right: 30px;
   top:80%;
 }

 @media (min-width: 992px) {
   .today .card {
     width: 12.5rem;
   }
   .today .card .datetime{
     margin: 15rem 0px 0px 10px;

   }
   .today .card .card-text>i{
   top:17.5rem;
   right: 10px;

   }
 }
 @media (max-width: 576px) {
   .today .card {
     width: 8.5rem;
   }
   .today .card .datetime{
     width: 50px;
     height: 50px;
     position: absolute;
     margin: 11rem 0px 0px 10px;
     font-size: 18px;
   }
   .today .card .datetime>p{
     text-align: center;
     font-size: 10px;
     line-height: 0.9em;
     color: #ffffff;
     font-weight:lighter;
   }
   .today .card .card-title{
     padding-top: 0.5rem;
     font-size: 15px;
     color: #000000;
     height: 3rem;
     display: inline-block;
   }
   .today .card .card-hall{
     height: 15px;
     display: inline-block;
   }
   .today .card .card-text{
     padding-bottom: 0px;
     line-height: 1em;
   }
   .today .card .card-text>p{
     font-size: 15px;
     color: #708090;
   }
   .today .card .card-text>i{
     font-size: 25px;
     color: #191970;
     position: absolute;
     right: 10px;
     top:13.5rem;
   }

   @media only screen
     and (device-width : 414px)
     and (device-height : 896px)
     and (-webkit-device-pixel-ratio : 2) {
       .today .card {
         width: 11rem;
       }
       .today .card .datetime{
         width: 50px;
         height: 50px;
         position: absolute;
         margin: 12rem 0px 0px 10px;
         font-size: 18px;
       }
       .today .card .card-text>i{
         font-size: 25px;
         color: #191970;
         position: absolute;
         right: 10px;
         top:14rem;
       }


      }

  }

        /* search start  */

        .search-inline {
            width: 100%;
            left: 0;
            padding-left: 15px;
            padding-right: 15px;
            top: 0;
            height: 10%;
            position: absolute;
            opacity: 0;
            visibility: hidden;
            background-color: #efefef;
            z-index: 9;
            transition: all .5s ease-in-out;
        }

        .search-inline.search-visible {
            opacity: 1;
            visibility: visible;
            animation: fadeInDown 0.4s ease-in-out;
        }

        .search-inline button[type="submit"] {
            position: absolute;
            right: 52px;
            top: 0;
            background-color: transparent;
            border: 0px;
            top: 0;
            right: 80px;
            padding: 0px;
            cursor: pointer;
            width: 80px;
            height: 99%;
            background: #222;
            color: #fff;
        }

        .search-inline .form-control {
            border: 0px;
            padding-left: 0;
            font-size: 2rem;
            position: absolute;
            left: 1%;
            top: 0;
            height: 100%;
            width: 99%;
            font-family: "Montserrat", sans-serif;
            font-weight: 700;
            outline: none;
        }

        .search-inline .search-close {
            position: absolute;
            top: 0;
            right: 0;
            color: #616161;
            width: 80px;
            height: 100%;
            text-align: center;
            display: table;
            background: #efefef;
            text-decoration: none;
        }

        .search-inline .search-close i {
            display: table-cell;
            vertical-align: middle;
        }

        .form-control {
            display: block;
            width: 100%;
            padding: .375rem .75rem;
            font-size: 1rem;
            line-height: 1.5;
            color: #495057;
            background-color: #efefef;
            background-clip: padding-box;
            border: 1px solid #efefef;
            border-radius: .25rem;
            transition: border-color .3s ease-in-out, box-shadow .3s ease-in-out;
        }

        @keyframes fadeInDown {
            from {
                opacity: 0;
                transform: translate3d(0, -20%, 0);
            }
            to {
                opacity: 1;
                transform: translate3d(0, 0, 0);
            }
        }