*{margin:0px;padding:0px;}


/*sidebar*/

.blog-sidebar{border-left:1px solid #ccc;}


.link{
  display: block;
  text-align: center;
  color: #777;
  text-decoration: none;
  padding: 10px;
}

 .details img{width:20px !important; height:20px !important;}
 .details li {display: inline-block;list-style: none;color:grey;padding:0 4rem 0 0;
  margin-top:1rem;}

.movie_card {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    margin: 20px 0 40px 0;
    overflow: hidden;
    transition: all 0.4s;
}

  .info_section{
    position: relative;
    width: 100%;
    height: 100%;
    background-blend-mode: multiply;
    z-index: 2;
    border-radius: 10px;}

    .movie_header{
      position: relative;
      padding:0;
     }

       .movie_header h3 {
    color: #000;
    font-weight: 500;
    padding-top: 0rem;
    font-size: 19px;
}

       .movie_header h4{
        color: #39b54a;
        font-weight:600;
        letter-spacing: 0.1rem;
        font-size: 14px;
      }
      .minutes{
        display: inline-block;
        margin-top: 2px;
        padding: 5px;
        padding-left: 0px;
        font-size:1.7rem;
        color:#f78c38;
        }



        .button a,
        .button a:hover{
        margin-top:2rem;
        background-color: #ee4037;
        vertical-align:baseline !important;
        font-size:1.4rem;
        border-radius:0.7rem;
        color:#fff;
        line-height:16px;
        padding: 0.5rem 2.7rem;
        }
      .type{
        display: flex;
        color: #959595;
        margin-left:3px;
        align-items: center;
    }
        .type strong{color:#000;font-weight: 200;font-size: 2rem;}
    .movie_header img{
        position: relative;
        float: left;
        /*margin-right: 12px;*/
        height:auto !important;
        width:25%;
        box-shadow: 0 0 20px -10px rgba(0,0,0,0.5);
      }
    .move-head{margin-left:20px !important;position: absolute;left:25%;}
    .type2{display: inline-block;color: #959595;float: left;}
    .button span:not(.text_add) {padding: 0 2rem;font-size: 1.6rem;color:#9999bb;}
    .mobile-device{color:grey;padding-top:1rem;}
     #bg-mob{color:#555555;}

/*paragraph css*/
.blog-post-title{color: #5d555d;font-weight: bold;}
.para-des{color:#666;text-align: justify;line-height:18px;padding-right:0px; white-space: pre-line;}
#red-para{color:#ee4037 !important;font-weight:bold;text-align:center !important;margin:4rem 0;
  word-spacing:0.5rem;text-transform: capitalize;font-size: 17px;}
#red-para em{color:#333;font-weight: lighter;letter-spacing: 0px;word-spacing:2px;}

.stars {margin:9px 0 0 0;font-size:18px;color:#dddddd;}
.fill{color:#fd8d38;}
.social-media{padding:0 1rem; display: flex; justify-content: center;}
.social-media > * { margin: 0 5px; }
.social-media li{
    display: flex;
    align-items: center;
    justify-content: center;

    list-style: none;
    border-radius: 50%;
    background-color:#dddddd;
    width:33px;
    height:33px;
    padding: 0.1rem 0.6rem;
    color:#FFF;
    font-size: 25px;
    box-shadow: 1px 3px 2px #ddd;
}
.social-media li#share-to {
    background-color: #6D6D6D;
}
.social-media li#mesg {
    background-color: #1DA1F2;
}
.social-media li#fb {
    background-color: #4267B2;
}
.social-media li#whats {
    background-color: #25D366;
}
#share-to > * {
    font-size: 16px;
}
#fb {
    padding: 0.7rem 1rem !important;
}
#whats {
    padding: 0.6rem 0.8rem !important;
}
#insta {
    padding: 0.5rem 0.8rem !important;
}
#mesg {
    padding: 0.6rem 0.7rem !important;
}
#gifts-div .col-md-4 p{padding-top:1rem;color:#575556;}
/* #gift{padding-top: 0.6rem !important;} */
#gifts-div .col-md-4{padding-top: 1rem;}
.col-sm-11 form{padding-right:0px;}
/*comment*/

#comment{margin-top:3rem;}

#comment .col-sm-1 img{border-radius: 50%;width:60px;
height:40px;}
#comment .row .col-md-11 h4{color:#555555;font-weight: bold;}
.mesg{display:inline !important; line-height: 20px;}
#date{font-size: 12px !important;color:#999999;}
.emojis li{display: inline-block;}
.emojis img{width:20px;height:20px;}
.emojis{display: contents !important;}
#comment .col-sm-11 form input::placeholder{color:#000;font-weight: 300;}
#comment .col-sm-11 form input{padding:2rem;}

/*sidebar css*/
.card{box-shadow: 0px 0px 3px 1px #ccc;border-radius:1rem;padding:0.8rem;margin-bottom: 2rem;}
.card .col-sm-4 img{border:1px solid #cdcdcd;padding:0.2rem;}
.card .col-sm-8 h4{font-size: 18px;padding-top:2rem;}
.card .col-sm-8 p{font-size:14px;line-height: 16px;}
#side-a{
    border:1px solid #999999;
    border-radius:0.7rem;
    font-weight:bold;
    text-transform: uppercase;
    margin: 0;
    display: block;
    width: 100%;
}

.card .author-profile {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.author-profile .author-img {
    max-width: 25%;
    margin-right: 5%;
}

.author-profile .author-img img,
.commenter-img img {
    padding: 3px;
    border: 1px solid #C0C0C0;
}

.author-profile .author-img img:hover,
.commenter-img img:hover {
    background-color: #f0f0f0;
}

.card h5{font-weight: bold;text-transform: capitalize;}
#green-bg-but{background-color: #70bf5e;
margin-top: 1rem !important;
padding: 0.4rem 3rem;
color: #fff;
text-transform: uppercase;
font-weight: bold;
width: 100%;}
#side-para{padding-left:2rem;}
#card #side-para h5{font-size: 13px;}
#card #side-para p{font-size: 13px;margin-top: -0.7rem;}
#card .col-sm-1 img{padding-top:1rem;}
/*series-section*/

.section-series h5{font-size: 17px;font-weight:600;padding:2rem 0;}
.green{color: #39b54a;
font-weight: lighter;
letter-spacing: 0.1rem;
font-size: 15px;}
.section-series .minutes{padding: 0px;
font-size: 1.4rem;}
.section-series .type strong{font-size: 1.6rem;}
.series-para-side{text-align: justify;font-size: 14px;line-height: 17px;}
.section-series .row{margin-bottom: 2rem;}

/***************** resposnsive ***************/
@media screen and (min-width: 768px) {
    .blog-sidebar { position: sticky; left: 65%; height: calc(100vh - 100px); overflow-y: scroll; width: 28%; top: 60px;}
}

@media screen and (max-width: 768px) {
  .movie_card{width: 95%;margin: 70px auto;min-height: 350px;height: auto;}
  .blur_back{width: 100%;background-position: 50% 50% !important;}
  .movie_header{width: 100%;margin-top: 85px;}
}

@media screen and (max-width:639px) {
	.stars{margin: 8px 0 0 0;}
}

@media screen and (max-width:479px) {
	.stars {margin: 5px 0;}
}

@media screen and (max-width:413px) {
	#gifts-div .col-md-4 p{ font-size:13px;}
	.novel-ratebox .glyphicon-star {font-size: 15px;}
}

@media only screen and (min-width: 320px) and (max-width:720px) {
  .movie_header {margin-top: 0px;}
  .movie_header img {width: 30%;min-height: auto;}
  .move-head{left: 35%;width: calc(65% - 15px);margin-left: 15px !important;position: static;float: left;}
  .movie_header h3 {font-size: 13px;font-weight: bold;margin-top:0.5px;}
  .movie_card {width: 100%;margin:0px auto;min-height: 0px;}
  .details li {padding: 0;margin-top:0.5rem;}
  .minutes{margin-top: 0px;padding:0px;font-size: 1.5rem;}
  .details img {max-width: 20px !important;min-height: 20px !important;}

  .button a {margin-top:1rem;font-size: 1rem;border-radius: 0.4rem;color: #fff;line-height: 11px;padding: 0.6rem;}
  #red-para{font-size:13px;}
  #comment .col-sm-1 img {height:40px;width:40px;position: relative;top:29%;}
  .button span {padding: 0 0rem;}
  .mobile-device {font-size: 11px;}

  .col-sm-11 form {margin-top: 1rem;}
  .card .col-sm-4 img {width:80px;}
  #side-a {margin:1rem;width:93%;}
  #card #side-para h5 {font-size: 18px;}
  #card #side-para p {font-size: 15px;margin-left:0px;}
  #green-bg-but {margin-left:0px !important;margin-top:0px;}
  .card .col-sm-8 h4 {padding-top:0px;}
  .card .col-sm-4 img {margin: 0rem 0rem 0rem 1rem;}

  #gifts-div .col-md-9 .col-md-4{display: inline-block;width: 32%;}
  #gifts-div .col-md-4 p{ padding-top:0;}
  .social-media{padding:4px;}

   #comment .col-sm-1{display: inline-block;vertical-align: baseline;margin-top: 1rem;width: 20%;}
   #comment .col-sm-11{display: inline-block;width: 78%;vertical-align: top;}
   .mesg {line-height: 12px;font-size: 11px;}

	.blog-sidebar .card .col-sm-4{display: inline-block;width: 20%;vertical-align: top;margin-top: 1rem;}
	.blog-sidebar .card .col-sm-8{display: inline-block;width: 73%;}
	#card .col-sm-1{width: 8%;display: inline-block;vertical-align: top;}
	#card .col-sm-7{display: inline-block;width: 63%;}
	#side-para{margin-left:0px;}
	#card .col-sm-1{display: inline-block;width: 8%;vertical-align: top;}
	#green-bg-but {padding: 0.4rem 0.6rem;}
	.section-series .col-md-5{display: inline-block;width: 38%;}
  .section-series .col-md-7{display: inline-block;width: 60%;vertical-align: top;}
  .rattingvalue{ margin: 2px 0px 0px 3px !important;}
}


@media only screen and (min-width:360px) and (max-width: 720px) {
	#side-a {margin: 1.2rem; width: 93%;}
}

@media only screen and (min-width:375px) and (max-width: 720px) {
	.movie_header h3 {font-size: 16px;margin-top: 7.5px;}
	.button a {font-size: 1.4rem;padding: 1rem;}
  .mobile-device {font-size: 13px;}

}

@media only screen and (min-width:471px) and (max-width: 720px) {
	.movie_header h3 {font-size: 18px;margin-top: 1rem;}
	.button a {font-size: 1.4rem;padding: 1rem;margin-top:2rem;}
	.mobile-device {font-size: 13px;}
	.movie_header img {width: 42%;min-height: auto;}
	#red-para {font-size: 16px;}
	#side-a {margin-left: 2rem;}
	#green-bg-but {padding: 0.4rem 1rem;margin-left: 0rem !important;}
	.move-head {left: 44%;width: calc(58% - 20px);}
}

@media only screen and (min-width:502px) and (max-width: 720px) {
	.movie_header h3 {font-size: 21px;margin-top: 3rem;}
	.button a {font-size: 1.8rem;padding: 1rem;margin-top: 3rem;}
	.minutes {margin-top: 18px;}
	.mobile-device {font-size: 14px;}
  .movie_header img {width: 42%;min-height: auto;}

}
@media only screen and (min-width: 320px) and (max-width:410px) {

#gift{
  font-size: 11px;
  padding-top:0px;
}
.submitstarratting{
  font-size:11px !important;
}
.stars {
  margin: 5px -5px;
}
.novel-ratebox .glyphicon-star{
  font-size:14px !important;
}
#gifts-div .col-md-4 p {
  font-size: 11px;
}
.center-block{
  width:35px !important;
}
}
@media only screen and (min-width: 320px) and (max-width: 350px)
{
.move-head {
    /* left: 35%; */
    /* width: calc(65% - 6px); */
    margin-left: 15px !important;
    position: static;
    float: left;
}
}