/*-----------------------------------------------------------------------------------

    Version: 1.0

-----------------------------------------------------------------------------------

    CSS INDEX
    =========================================

    01. Theme default CSS
        - Common Classes
        - Section Padding
    
  
  ==== NEED TO UPDATE THESE SECTIONS AND THIS INDEX BELOW ====
  02. Element
        - Button Style 
        - Section Title Css
        - Breadcrumb Style
        - Widget Css
        - Paginatoin Css
    03. Mobile Menu Css
    04. Header Css
    05. Hero Slider Css
    06. Feature Css
    07. Choose Area Css
    08. Footer Css
    09. About us Css
    10. Contact css
    11. Faq Style
    12. Pricing Panel Css
    13. Testimonial Css
    14. product Css
    15. Login And Register Page Css
    16. My Account Page Css



-----------------------------------------------------------------------------------*/

@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

/*----------------------------------------*
/*  01. START: Theme default CSS          *
/*----------------------------------------*/
html, body {
  font-family: "Poppins", sans-serif;
  line-height: 28px;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  visibility: visible;
  color: #333;
  background-color: #000;
  /*font-family: Roboto, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  background-color: #000;
  color: #fff;
  margin: 0;
  padding: 0;
    */
}

a, .btn-link {
    color: #0071c1;
}

button:disabled {
  background: gray !important;
  color: silver;
  cursor: not-allowed;
  pointer-events: all !important;
}
a[disabled] {
  background: gray !important;
  color: silver;
  cursor: not-allowed;
  pointer-events: all !important;
}


/*---------------------------------------*
     - Common Classes                    *
-----------------------------------------*/

/*---------------------------------------*
     - Section Padding                   *
-----------------------------------------*/


/*---------------------------------------*
     - Background Color                  *
-----------------------------------------*/


/*----------------------------------------*
/*  01. END: Theme default CSS            *
/*----------------------------------------*/



.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

.Watch-list-clear-btn{
  margin-right:3px;
}

/* */
/* ///////////////////// */
/* Nav Menu              */
/* ///////////////////// */

color: #ffffff !important;
border: 1px solid #ffffff;

/* ///////////////////// */
/* Loading DIV to grey out page */
/* ///////////////////// */
#loading {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0.7;
  background-color: #fff;
  z-index: 10000;
}



/* podcast player*/
#mobile-box {
  width: 360px;
}

.card {
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

  .card .view {
    -webkit-border-top-left-radius: 10px;
    border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    border-top-right-radius: 10px;
  }

  .card h5 a {
    color: #0d47a1;
  }

    .card h5 a:hover {
      color: #072f6b;
    }

#pButton {
  float: left;
}

#timeline {
  width: 90%;
  height: 2px;
  margin-top: 20px;
  margin-left: 10px;
  float: left;
  -webkit-border-radius: 15px;
  border-radius: 15px;
  background: rgba(0, 0, 0, 0.3);
}

#pButton {
  margin-top: 12px;
  cursor: pointer;
}

#playhead {
  width: 8px;
  height: 8px;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  margin-top: -3px;
  background: black;
  cursor: pointer;
}

/*********************/

/* Add white circle outline to match search/cart icons in steamo */
.our-profile-pc {
  font-size: 19px;
  line-height: 1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #FFFFFF;
  width: 32px;
  height: 32px;
  border: 1px solid #fff;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 100%;
}

/*  promocodeWrap */
/********************/
.promocodeWrap {
  display: inline-block;
  position: relative;
}

  .promocodeWrap input {
    width: 300px;
    height: 40px;
    font-size: 16px;
    border: none;
    color: #8c8c8c;
    border-radius: 4px;
    background-color: #ffffff;
    padding: 2px 165px 2px 20px;
  }

    .promocodeWrap input::-webkit-input-placeholder {
      color: #8c8c8c;
    }

    .promocodeWrap input::-moz-input-placeholder {
      color: #8c8c8c;
    }

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .promocodeWrap input {
    width: 600px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .promocodeWrap input {
    width: 550px;
  }
}

@media only screen and (max-width: 767px) {
  .promocodeWrap input {
    width: 100%;
    height: 52px;
    font-size: 14px;
    padding: 2px 130px 2px 20px;
  }
}

.promocodeWrap .landing-btn-style {
  position: absolute;
  right: -1px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 100%;
  border: none;
  padding: 2px 25px;
  background-color: #2C2E2F;
  color: #ffffff;
  font-size: 14px;
  border-radius: 0 4px 4px 0;
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

  .promocodeWrap .landing-btn-style:hover {
    background-color: #3C3E3F;
  }

@media only screen and (max-width: 767px) {
  .promocodeWrap .landing-btn-style {
    font-size: 16px;
    padding: 2px 12px;
  }
}

.promocodeWrap.modify {
  display: block;
  text-align: center;
}

  .promocodeWrap.modify input {
    color: #fff;
    width: 100%;
    background-color: #000;
  }

    .promocodeWrap.modify input::-webkit-input-placeholder {
      color: #fff;
    }

    .promocodeWrap.modify input::-moz-input-placeholder {
      color: #fff;
    }

.buttonRed {
  border: none;
  color: #ffffff;
  font-weight: 600;
  border-radius: 4px;
  background-color: #2C2E2;
  margin: 0 0 0 0;
  padding: 6px 18px;
  -webkit-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
}
.buttonGrey {
  border: none;
  color: #ffffff;
  font-weight: 600;
  border-radius: 4px;
  background-color: #2C2E2F;
  margin: 0 0 0 0;
  padding: 6px 18px;
  -webkit-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
}



#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;f
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

.blazor-error-boundary::after {
    content: "An error has occurred."
}


/* ************* */
/* Add styles to dropdown boxes
/* ************* */
.contact-inner select, .contact-inner textarea {
  background: #1E272D;
  color: #fff;
  font-size: 14px;
  height: 60px;
  padding-left: 15px;
  width: 100%;
  border: 1px solid #1E272D;
}

  /* ************* */
  /* Store standard Image sizes
/* ************* */
  .movie-wrap .movie-img img {
  min-width: 160px !important;
  min-height: 120px !important;
  flex-shrink: 0 !important;
  min-width: 100% !important;
  min-height: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  overflow: hidden !important;
}




/* ************* */
/* Swiper Image sizes https://stackoverflow.com/questions/49474443/responsive-image-with-object-fitcover */
/* ************* */
.mySwiperImageSize {
  width: 90vw !important;
  height: 30vh !important;
  min-width: 240px !important;
  max-height: 280px;
  border: 3px solid #000;
  object-fit: cover;
  object-position: 0 0;
}

/* ************* */
/* FlexScroll Header  */
/* ************* */
.flexScroll {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}
  .flexScroll a {
    margin-right: 15px;
  }
  .flexScroll::-webkit-scrollbar {
    display: none;
  }


/* BADGES */
/* https://codepen.io/renduh/pen/EZVxza */
.ribbon-wrapper-9 {
  width: 108px;
  height: 108px;
  overflow: hidden;
  position: absolute;
  top: -6px;
  right: -6px;
}

.ribbon-9 {
  font: bold 15px Sans-Serif;
  line-height: 18px;
  color: #e9ea7b;
  text-align: center;
  text-transform: uppercase;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  position: relative;
  padding: 7px 0;
  left: -4px;
  top: 26px;
  width: 150px;
  background-color: #6daaab;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  letter-spacing: 0.5px;
  box-shadow: -3px 5px 6px -5px rgba(0, 0, 0, 0.5);
  outline: 1px solid #E5E82C;
  outline-offset: -4px;
  background-image: radial-gradient(circle farthest-side, #FF1C1A, #BF0B00);
  text-shadow: 2px 1px 0px rgba(0, 0, 0, 0.2);
}

  .ribbon-9:before, .ribbon-9:after {
    content: "";
    border-top: 4px solid #BF0B00;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    position: absolute;
    bottom: -4px;
  }

  .ribbon-9:before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 4px solid #BF0B00;
    border-right: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-top: 4px solid #BF0B00;
  }

  .ribbon-9:after {
    content: "";
    position: absolute;
    right: 7px;
    top: 100%;
    z-index: -1;
    border-left: 4px solid transparent;
    border-right: 4px solid #BF0B00;
    border-bottom: 4px solid transparent;
    border-top: 4px solid #BF0B00;
  }

/* ***************** */
/* Rating Component  */
/* ***************** */

.star {
  color: #ff9933;
  cursor: pointer;
}

/* ************* */
/* Video Header */
/* ************* */
.jumboHeader {
  position: relative;
  background-color: black;
  height: 25vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
  
  padding-top: 15px;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

  .jumboHeader .title {
    background: url(/images/texure.jpg);
    background-repeat: repeat-x;
    background-position: 100% 100%;
    color: transparent;
    -webkit-font-smoothing: antialiased;
    -webkit-background-clip: text;
    -moz-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 500;
  }

  .jumboHeader video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
  }

  .jumboHeader .container {
    position: relative;
    z-index: 2;
  }

  .jumboHeader .overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.5;
    z-index: 1;
  }

/* Homepage Widgets */

.widget {
  margin-bottom: 1.875em;
  padding: 1.875em;
  display: inline-block;
  width: 100%;
  position: relative;
  background: linear-gradient(180deg, rgb(25 25 25) 0%, rgb(25 25 25) 10%, rgba(83, 100, 141, 0) 100%);
  border-top: 0.250em solid rgba(209, 208, 207, 0.6);
}
  .widget .widget-title {
    font-size: 1.375em;
    position: relative;
    margin-bottom: 1.364em;
    padding-bottom: 0.682em;
    border: 0.045em solid;
    border-image-slice: 1;
    border-width: 0 0 0.045em 0;
    border-image-source: linear-gradient(to right, rgba(209, 208, 207, 0.6), rgba(209, 208, 207, 0.3), rgba(209, 208, 207, 0));
    margin-top: 0;
  }

.post-img-holder {
  width: 80px;
  margin-right: 20px;
  flex: none;
  line-height: 0;
}

  .post-img-holder a {
    display: block;
    width: 100%;
    height: 70px;
    overflow: hidden;
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat;
  }

.iq-widget-menu .post-blog {
  line-height: 0px;
}

.iq-widget-menu .post-img .post-blog .blog-box ul li {
  margin-bottom: 0px;
}

.widget ul li:last-child {
  padding-bottom: 0;
}

.widget_categories ul li, .widget_archive ul li, .widget_pages ul li {
  margin-bottom: 15px;
  border-bottom: 1px solid rgba(82, 95, 129, 0.1);
}

.widget ul {
  padding: 0;
  margin: 0;
}

.iq-widget-menu .iq-post li a.date-widget {
  color: var(--iq-primary);
  margin-bottom: 10px;
  display: block;
  font-size: 12px;
  font-weight: 700;
}

.iq-widget-menu ul.iq-post li {
  margin-bottom: 24px;
}

  .iq-widget-menu ul.iq-post li .post-img {
    display: flex;
  }

.list-inline {
  padding-left: 0;
  list-style: none;
}

.widget ul li {
  padding-bottom: 15px;
  list-style: none;
  margin-bottom: 15px;
  border-bottom: 0.063em solid rgba(82, 95, 129, 0.1);
}

.widget a {
  color: var(--iq-body-text);
  text-decoration: none;
}

.widget_tag_cloud ul {
  margin: 0;
  padding: 0;
}

  .widget_tag_cloud ul li {
    padding: 0;
    display: inline-block;
    margin: 3px 5px 3px 0;
  }

    .widget_tag_cloud ul li a {
      background: var(--iq-primary);
      display: inline-block;
      color: var(--iq-white-color);
      padding: 2px 10px;
    }

.iq-blog-box {
  position: relative;
  overflow: hidden;
  margin-bottom: 3.125em;
  padding-bottom: 2.5em;
  border: 1px solid;
  border-image-slice: 1;
  border-width: 0 0 0.063em 0;
  border-image-source: linear-gradient(to right, rgba(209, 208, 207, 0.6), rgba(209, 208, 207, 0.3), rgba(209, 208, 207, 0));
}

  .iq-blog-box .iq-blog-image {
    position: relative;
    text-align: center;
    display: inline-block;
    width: 100%;
  }

    .iq-blog-box .iq-blog-image img {
      margin-bottom: 1.875em;
      background: var(--iq-white-light-color);
    }


/* Media Query for devices withi coarse pointers and no hover functionality */
/* This will use a fallback image instead of a video for devices that commonly do not support the HTML5 video element */

@media (pointer: coarse) and (hover: none) {
  .jumboHeader {
    background: url('https://images.horrorhound.com/hh2017/jumbo-090.jpg') black no-repeat center center scroll;
  }

    .jumboHeader video {
      display: none;
    }
}