/**
 * carousel home
 */
/*
.carousel-item {
    height: 100vh;
    background-size: cover;
    background-position: center center;
    background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15e27d22494%20text%20%7B%20fill%3A%23333%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15e27d22494%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23555%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22277%22%20y%3D%22218.45%22%3EThird%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E);
}

.carousel-item h1 {
    margin: 0;
    color: white;
}*/

/**
 * blockquote
 */

/*blockquote {
    border-left: 10px solid #ccc;
    margin: 1.5em 10px;
    padding: 0.5em 10px;
    quotes: '\201C''\201D''\2018''\2019';
}
blockquote:before {
    color: #ccc;
    content: open-quote;
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}
blockquote p {
    display: inline;
}*/

/**
 * each blog 
 */

.each-blog {
  margin-top: -16px;
  background: -webkit-linear-gradient(70deg, #f2f2f2 40%, #f9f9f9 40%);
  background: -o-linear-gradient(70deg, #f2f2f2 40%, #f9f9f9 40%);
  background: -moz-linear-gradient(70deg, #f2f2f2 40%, #f9f9f9 40%);
  background: linear-gradient(70deg, #f2f2f2 40%, #f9f9f9 40%);
}

.each-blog p img {
  width: 100%;
}

.each-blog br {
  display: none;
}

/**
 * sidebar
 */

.list-hover:hover {
  background: #ffa31a;
}

/**
 * quill
 */

.quill * {
  font-size: 18px;
  color: #555;
}

/**
 * mobile
 * fading gradient for nav mobile screen
 */

.fading-gradient {
  background: linear-gradient(
    to left,
    rgba(193, 193, 240, 1),
    rgba(20, 20, 82, 1)
  );
}

@media only screen and (max-width: 1024px) {
  .carousel-caption h3 {
    font-size: 40px;
  }
}

@media only screen and (max-width: 720px) {
  .hidden-in-small-screen {
    display: none;
  }

  .parallaxImage {
    background-attachment: scroll !important;
  }
}

@media only screen and (min-width: 720px) {
  .hidden-in-large-screen {
    display: none;
  }
}

/**
 * flex
 */

.flex-container {
  display: flex;
  align-items: stretch;
  background-color: #f1f1f1;
}

.flex-container > div {
  background-color: DodgerBlue;
  color: white;
  width: 100px;
  margin: 10px;
  text-align: center;
  line-height: 75px;
  font-size: 30px;
}

/**
 * progress bar
 * https://www.cssportal.com/blog/10-image-shadows-using-css/
 */

#nprogress .bar {
  height: 4px !important;
  background-color: #9a1808 !important;
}

/* bootstrap progress bar */

.progress {
  height: 7px;
}

/* btn click surrounding shadow remove */

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus:not(:disabled):not(.disabled),
.btn:focus,
.btn:active,
.btn:hover {
  box-shadow: none !important;
  outline: 0;
}

/**
 * mega menu
 */

.megamenu-li {
  position: static;
}

.megamenu {
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  padding: 15px;
  background: #9a1808;
}

.nav-custom-bg {
  background: #9a1808;
  color: #fff;
  /*margin-left: -8px;
    margin-right: -8px;*/
}

#navbar .nav-main {
  color: #fff;
}

#navbar .nav-main:hover {
  background: #ffa31a;
  padding: 16px;
  margin: -8px;
}

#navbar .nav-a {
  color: #fff;
}

#navbar .nav-a:hover {
  color: #9a1808;
}

.text-rr {
  /* color: #c7aeab; */
  color: #9a1808;
}

.bg-rr {
  background-color: #9a1808;
  color: #fff;
}

.text-rr:hover {
  color: #ffa31a;
}

/**
 * card
 */

.flip {
  position: relative;
}
.flip > .front,
.flip > .back {
  display: block;
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition-duration: 0.5s;
  transition-property: transform, opacity;
}
.flip > .front {
  transform: rotateY(0deg);
}
.flip > .back {
  position: absolute;
  opacity: 0;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  transform: rotateY(-180deg);
}
.flip:hover > .front {
  transform: rotateY(180deg);
}
.flip:hover > .back {
  opacity: 1;
  transform: rotateY(0deg);
}
.flip.flip-vertical > .back {
  transform: rotateX(-180deg);
}
.flip.flip-vertical:hover > .front {
  transform: rotateX(180deg);
}
.flip.flip-vertical:hover > .back {
  transform: rotateX(0deg);
}
.flip {
  position: relative;
  display: inline-block;
  margin-right: 2px;
  margin-bottom: 1em;
  width: 100%;
  /*width: 400px;*/
}
.flip > .front,
.flip > .back {
  display: block;
  color: white;
  width: inherit;
  background-size: cover !important;
  background-position: center !important;
  height: 220px;
  padding: 1em 2em;
  background: #9a1808;
  border-radius: 10px;
  overflow: scroll;
}
.flip > .front p,
.flip > .back p {
  font-size: 1rem;
  line-height: 160%;
  color: #ccc;
}
.text-shadow {
  text-shadow: 1px 1px rgba(0, 0, 0, 0.04), 2px 2px rgba(0, 0, 0, 0.04),
    3px 3px rgba(0, 0, 0, 0.04), 4px 4px rgba(0, 0, 0, 0.04),
    0.125rem 0.125rem rgba(0, 0, 0, 0.04), 6px 6px rgba(0, 0, 0, 0.04),
    7px 7px rgba(0, 0, 0, 0.04), 8px 8px rgba(0, 0, 0, 0.04),
    9px 9px rgba(0, 0, 0, 0.04), 0.3125rem 0.3125rem rgba(0, 0, 0, 0.04),
    11px 11px rgba(0, 0, 0, 0.04), 12px 12px rgba(0, 0, 0, 0.04),
    13px 13px rgba(0, 0, 0, 0.04), 14px 14px rgba(0, 0, 0, 0.04),
    0.625rem 0.625rem rgba(0, 0, 0, 0.04), 16px 16px rgba(0, 0, 0, 0.04),
    17px 17px rgba(0, 0, 0, 0.04), 18px 18px rgba(0, 0, 0, 0.04),
    19px 19px rgba(0, 0, 0, 0.04), 1.25rem 1.25rem rgba(0, 0, 0, 0.04);
}

.text-shadow-2 {
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
}

/**
 * animation slider
 */

.animation-slider-container {
  margin: 4% auto;
  width: 210px;
  height: 140px;
  position: relative;
  perspective: 1000px;
}
#animation-carousel {
  width: 100%;
  height: 100%;
  position: absolute;
  transform-style: preserve-3d;
  animation: rotation 20s infinite linear;
}
#animation-carousel:hover {
  animation-play-state: paused;
}
#animation-carousel figure {
  display: block;
  position: absolute;
  width: 186px;
  height: 116px;
  left: 10px;
  top: 10px;
  background: white;
  overflow: hidden;
  border: solid 5px #666;
}
#animation-carousel figure:nth-child(1) {
  transform: rotateY(0deg) translateZ(288px);
}
#animation-carousel figure:nth-child(2) {
  transform: rotateY(40deg) translateZ(288px);
}
#animation-carousel figure:nth-child(3) {
  transform: rotateY(80deg) translateZ(288px);
}
#animation-carousel figure:nth-child(4) {
  transform: rotateY(120deg) translateZ(288px);
}
#animation-carousel figure:nth-child(5) {
  transform: rotateY(160deg) translateZ(288px);
}
#animation-carousel figure:nth-child(6) {
  transform: rotateY(200deg) translateZ(288px);
}
#animation-carousel figure:nth-child(7) {
  transform: rotateY(240deg) translateZ(288px);
}
#animation-carousel figure:nth-child(8) {
  transform: rotateY(280deg) translateZ(288px);
}
#animation-carousel figure:nth-child(9) {
  transform: rotateY(320deg) translateZ(288px);
}

#animation-carousel img {
  /*-webkit-filter: grayscale(1);*/
  cursor: pointer;
  transition: all 0.5s ease;
}
#animation-carousel img:hover {
  /*-webkit-filter: grayscale(0);*/
  transform: scale(1.1, 1.1);
  cursor: zoom-in;
}

@keyframes rotation {
  from {
    transform: rotateY(0deg);
  }
  to {
    transform: rotateY(360deg);
  }
}

.animation-slider {
  background-image: url("/static/carousel/custom-pallet-racking.jpg");
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

/**
 * font awesome icon
 */

i.fa-animated {
  position: relative;
  -webkit-animation-name: move; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
  animation: move 2s infinite;
  color: #9a1808;
}

.icon-text-shadow {
  text-shadow: 5px 5px 5px #ccc;
}

.icon-about i {
  color: #9a1808;
  /*border: 1px solid #9a1808;*/
  /* border-radius: 50%;*/
  padding: 50px;
  /* margin-bottom: 20px;
  padding-right: -10px; */
}

.icon-about {
  color: #fff;
  background: linear-gradient(-45deg, #ff704d, #ffa31a, #9a1808, #ffa31a);
  /* background: linear-gradient(-45deg, #ffc34d, #ffa31a, #9a1808, #4646d2); */
  background-size: 400% 400%;
  -webkit-animation: Gradient 5s ease infinite;
  -moz-animation: Gradient 5s ease infinite;
  animation: Gradient 5s ease infinite;
  border-radius: 50px;
}

@-webkit-keyframes Gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@-moz-keyframes Gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

@keyframes Gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* Safari 4.0 - 8.0 */
@-webkit-keyframes move {
  0% {
    bottom: 0px;
  }
  20% {
    bottom: 5px;
    color: #ffa31a;
  }
  40% {
    bottom: 0px;
  }
}

/* Standard syntax */

@keyframes move {
  0% {
    bottom: 0px;
    color: #9a1808;
  }
  20% {
    bottom: 5px;
    color: #ffa31a;
  }
  40% {
    bottom: 0px;
    color: #9a1808;
  }
}

/**
 * background gradient
 */

.bg-graident-1 {
  color: #fff;
  background: -webkit-linear-gradient(110deg, #d9d9d9 33%, rgba(0, 0, 0, 0) 33%),
    -webkit-linear-gradient(110deg, #e6e6e6 66%, #f2f2f2 66%);
  background: -o-linear-gradient(110deg, #d9d9d9 33%, rgba(0, 0, 0, 0) 33%),
    -o-linear-gradient(110deg, #e6e6e6 66%, #f2f2f2 66%);
  background: -moz-linear-gradient(110deg, #d9d9d9 33%, rgba(0, 0, 0, 0) 33%),
    -moz-linear-gradient(110deg, #e6e6e6 66%, #f2f2f2 66%);
  background: linear-gradient(110deg, #d9d9d9 33%, rgba(0, 0, 0, 0) 33%),
    linear-gradient(110deg, #e6e6e6 66%, #f2f2f2 66%);
}

.bg-graident-2 {
  background: -webkit-linear-gradient(110deg, #d9d9d9 60%, #e6e6e6 60%);
  background: -o-linear-gradient(110deg, #d9d9d9 60%, #e6e6e6 60%);
  background: -moz-linear-gradient(110deg, #d9d9d9 60%, #e6e6e6 60%);
  background: linear-gradient(110deg, #d9d9d9 60%, #e6e6e6 60%);
}

/* blue gradient */

.bg-gradient-rr1 {
  background: -webkit-linear-gradient(110deg, #003866 60%, #004680 60%);
  background: -o-linear-gradient(110deg, #003866 60%, #004680 60%);
  background: -moz-linear-gradient(110deg, #003866 60%, #004680 60%);
  background: linear-gradient(110deg, #003866 60%, #004680 60%);
}

/**
 * font awesome border outline
 */

.fa-outline-lg-white {
  font-size: 5.5em;
  -webkit-text-stroke: 5px #fff;
  -webkit-text-fill-color: transparent;
}

.fa-outline {
  font-size: 1em;
  -webkit-text-stroke: 1px #000;
  -webkit-text-fill-color: transparent;
  text-shadow: 2px 4px 3px rgba(0, 0, 0, 0.3);
}

/**
 * sidebar list hover
 */

.sidebar-list:hover {
  background: linear-gradient(
    to left,
    rgba(193, 193, 240, 1),
    rgba(20, 20, 82, 1)
  );
  color: white;
  cursor: pointer;
}

/**
 * products card
 */

.product-list {
  display: block;
  background-color: rgba(255, 255, 255, 0.8);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  border-radius: 2px;
  transition: all 0.2s ease-in-out;
}

.product-list-header {
  display: block;
  float: left;
  width: 35%;
  overflow: hidden;
  position: relative;
  border-radius: 2px 0 0 2px;
}

.product-list-header img {
  /*width: 100%;*/
  height: 100%;
}

/*.product-list-header .product-list-header-image:after {
    display: block;
    content: '';
    background-color: rgba(0, 0, 0, 0.4);
    position: absolute;
    top: 100%;
    left: 100%;
    width: 100px;
    height: 100px;
    box-shadow: 0 0 200px 100px rgba(0, 0, 0, 0.58);
    z-index: 1;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
    filter: alpha(opacity=0);
    transition: all 0.8s;
    -moz-transition: all 0.8s;
    -webkit-transition: all 0.8s;
    -o-transition: all 0.8s;
}*/

.product-list-content {
  display: block;
  margin-left: 35%;
  padding: 15px;
  position: relative;
}

.product-list-meta {
  display: block;
  margin-bottom: 16px;
  font-size: 13px;
  line-height: 100%;
}

.product-list-meta .product-list-meta-item {
  display: inline-block;
  margin-right: 18px;
  color: #9a9a9a;
}

.product-list:after {
  display: block;
  clear: both;
  content: "";
}

.product-list:hover {
  /*box-shadow: 0 0px 30px rgba(0, 0, 0, 0.19), 0 0px 9px rgba(0, 0, 0, 0.23);*/
  /*box-shadow: 5px 5px #ccc;*/
  box-shadow: 5px 10px 18px #ccc;
}

.featured-image {
  /*position: relative;*/
  text-align: center;
  color: white;
  padding: 0px 0px 0px 0px;
  /*width: 100%;*/
  /*min-height: 500px;*/
}

.featured-image img {
  object-fit: cover;
  width: 100%;
}

.featured-image-footer {
  background-color: #ffa31a;
  color: #fff;
  margin-top: -8px;
}

.featured-image-footer span {
  color: #333 !important;
}

@media only screen and (max-width: 991px) {
  .product-list-header {
    display: block;
    width: 100%;
    padding: 0;
    border-radius: 0;
  }

  .product-list-content {
    display: block;
    width: 100%;
    margin-left: 0;
    padding: 15px;
    clear: both;
  }
}

#navbar .active {
  background: #ffa31a;
  padding: 16px;
  margin: -8px;
}

.carousel-caption {
  top: 50%;
}

.our-services {
  background-image: linear-gradient(
      rgba(255, 255, 255, 0.5),
      rgba(255, 255, 255, 0.9)
    ),
    url("/static/cashforpallets/pallets-background.jpg");

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.sell-your-pallet-racking {
  background-image: linear-gradient(
      rgba(255, 255, 255, 0.5),
      rgba(255, 255, 255, 0.9)
    ),
    url("/static/home/sell-your-pallet-racking-get-cash.jpg");

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

/* .types-of-racks {
  background-image: linear-gradient(
      rgba(255, 255, 255, 0.5),
      rgba(255, 255, 255, 0.9)
    ),
    url("/static/home/cash-for-different-types-of-racks.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
} */

/* 
.types-of-racks2 {
  background-image: url("/static/home/demo2.png");

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.types-of-racks3 {
  background-image: url("/static/home/demo3.jpeg");

  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
} */