/*
 * Globals
 */

/* Links */
a,
a:focus {
  color: #37a5a6;
}
a:hover {
  color: #f49430;
  text-decoration: none;
}

/* Custom default button */
.btn-primary {
  color: #fff;
  background-color: #37a5a6;
  border-color: #37a5a6;
  text-shadow: none;
  -webkit-transition: .3s ease-in-out;
       -o-transition: .3s ease-in-out;
          transition: .3s ease-in-out;
}
.btn-primary:hover,
.btn-primary:hover:active,
.btn-primary:focus,
.btn-primary:focus:active {
  color: #fff;
  background-color: #f49430;
  border-color: #f49430;
}
.btn-back {
  margin: 2rem;
}
.popover .rounded-circle {
  display: block;
  margin: 1rem auto;
}
.card-block .profile-image {
  display: block;
  margin: .5rem auto;
}

.profile-image {
    position: relative;
    display: inline-block; /* added */
    overflow: hidden; /* added */
    width: 200px;
}

.profile-image img:hover {
    opacity: 0.5;
}
.profile-image:hover a {
    opacity: 1; /* added */
    top: 0; /* added */
    z-index: 500;
}
/* added */
.profile-image:hover a i {
    top: 50%;
    position: absolute;
    left: 0;
    right: 0;
    transform: translateY(-50%);
}
/* added */
.profile-image a {
    display: block;
    position: absolute;
    top: -100%;
    opacity: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    color: inherit;
    color: #eee;
}

/*
 * Base structure
 */

.site-wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 20;
  display: table;
  width: 100%;
}
.site-wrapper-inner {
  display: table-cell;
  vertical-align: top;
}
.cover-container {
  margin-right: auto;
  margin-left: auto;
}

.album [class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}

.img-fluid {
  min-width: 100%;
}

.fa-chevron-down {
  -webkit-transition: all .3s ease-in-out;
       -o-transition: all .3s ease-in-out;
          transition: all .3s ease-in-out;

}
.content-section {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.margin-bottom {
  margin-bottom: 2rem;
}

@media (min-width: 992px) {
  .fluid-margin {
    margin-left: 6rem; margin-right: 6rem;
  }
}

.card-small-block {
  padding: .75rem;
}

@media (min-width: 40em) {
  /* Bump up size of carousel content */
  .carousel-caption p {
    font-size: 1.25rem;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
    margin-top: 7rem;
  }
}

.my-custom {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;

  > .col,
  > [class*="col-"] {
    padding-right: 0;
    padding-left: 0;
  }
}


/*
 * Stripe Payments
 */

.StripeElement {
  background-color: white;
  height: 40px;
  padding: 10px 12px;
  border-radius: 4px;
  border: 1px solid transparent;
  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}


/*
 * Carousel
 */

.dovedale-carousel {
  height: 60vh;
  max-height: 58em;
  min-height: 32em;
  width: 100%;
  background-color: #3d3d62;
}
.dovedale-carousel .carousel-cell {
  height: 60vh;
  max-height: 58em;
  min-height: 32em;
  width: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
          box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
}
.cover-flickity {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100vw;
  text-align: center;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}

.cover h1,
.cover h2,
.cover h3,
.cover h4 {
  color: #fff;
}

/* Carousel base class */
/* .dovedale-carousel {
  height: 60vh;
  max-height: 58em;
  min-height: 32em;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
} */
/* Since positioning the image, we need to help out the caption */
/* .dovedale-carousel .carousel-caption {
  z-index: 10;
  top: 50%;
  transform: translateY(-50%);
  bottom: initial;
} */

/* Declare heights because of positioning of img element */
/* .dovedale-carousel .carousel-item {
  height: 60vh;
  max-height: 58em;
  min-height: 32em;
  background-color: #3d3d62;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
          box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.5);
} */

/* .carousel .carousel-indicators li {
  background-color: #f49430;
  border: 1px solid #f49430;
}

.carousel .carousel-indicators .active {
  background-color: transparent;
  border: 1px solid #37a5a6;
} */

/* Remove carousel control background gradient */
/*.carousel-control.left,
.carousel-control.right {
  background-image: none;
}*/

/* Category carousel base class */
.image-carousel {
  margin-bottom: 1rem;
}

/* Carousel products */
.gap {
  padding-top: 12px;
  padding-right: 4px;
  padding-left: 4px;
}
.thumbnails {
  padding-top: 8px;
  padding-right: 4px;
  padding-left: 4px;
}
.img-thumbnail:hover {
  background-color: #bfbfbf;
}
.thumbnails .active {
  background-color: #337ab7;
}

/* @media (max-width: 767px) {
  .dovedale-carousel,
  .dovedale-carousel .carousel-item {
    height: 100vh;
    max-height: 58em;
    min-height: 32em;
  }
} */

/* position dots up a bit */
.piece-carousel-background .flickity-page-dots,
.dovedale-carousel .flickity-page-dots {
  bottom: 2rem;
}
/* dots are lines */
.piece-carousel-background .flickity-page-dots .dot,
.dovedale-carousel .flickity-page-dots .dot {
  margin: 0 .25rem;
  background-color: #f49430;
  border: 1px solid #f49430;
  opacity: 1;
}

.piece-carousel-background .flickity-page-dots .is-selected,
.dovedale-carousel .flickity-page-dots .is-selected {
  background-color: transparent;
  border: 1px solid #37a5a6;
}


/*
 * Piece Carousel
 */

.piece-carousel-background {
  max-width: 100%;
  height: auto;
}
.piece-carousel-background .piece-carousel-item,
.piece-carousel-background .carousel-item {
  background-color: #1339ac;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 0;
  padding-top: 75%; /* (img-height / img-width * container-width) */
                       /* (853 / 1280 * 100) */
}


/*
 * Navbar
 */

.navbar {
  margin-bottom: 0;
  background-color: rgba(0, 0, 0, .6);
  border-radius: 0;
}

.navbar-dark .navbar-nav .nav-link {
  color: #fff;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: #f49430;
}

.navbar-dark .navbar-nav > .active > .nav-link,
.navbar-dark .navbar-nav > .active > .nav-link:hover,
.navbar-dark .navbar-nav > .active > .nav-link:focus {
  color: #37a5a6;
}

.navbar-collapse .container-fluid {
  padding: 2rem 2.5rem;
  border-bottom: 2px solid #f49430;
  background-color: #eee;
  height: 110vh;
  -webkit-overflow-scrolling: auto;
}

.navbar-collapse h4 {
  color: #818a91;
}

.navbar-collapse .text-muted {
  color: #818a91;
}

.nav-stacked .nav-item {
  width: 100%;
  border-bottom: .0625rem solid #e5e5e5;
}

@media (max-width: 991px) {
  .nav-item  {
    text-align: center;
  }
}

.about {
  padding-bottom: 2.5rem;
}

.social a {
  font-weight: 500;
  color: #818a91;
  margin-left: 1rem;
  margin-right: 1rem;
  -webkit-transition: .3s ease-in-out;
       -o-transition: .3s ease-in-out;
          transition: .3s ease-in-out;
}
.social a:hover {
  color: #f49430;
  text-decoration: none;
}

.list-group-item {
  font-size: 85%;
  padding: .55rem 1.05rem;
  background-color: transparent;
}

.nav-buttons {
  padding-bottom: 2.5rem;
}
.nav-buttons .search-light {
  margin-top: .5rem;
}

/* Float right */
.pull-xs-right {
  float: right !important;
}

/*Buttons and search*/
.btn-nav {
  color: #eee;
  background-color: rgba(55, 165, 166, 0.2);
  border-color: rgba(55, 165, 166, 0.6);
  -webkit-transition: .3s ease-in-out;
       -o-transition: .3s ease-in-out;
          transition: .3s ease-in-out;
}
.btn-nav:hover,
.btn-nav:hover:active,
.btn-nav:active,
.btn-nav:focus,
.btn-nav:focus:active {
  color: #fff !important;
  background-color: rgba(55, 165, 166, 1);
  border-color: rgba(55, 165, 166, 1);
}

.btn-nav-light {
  color: #37a5a6;
}

.search input {
  -webkit-transition: .3s ease-in-out;
       -o-transition: .3s ease-in-out;
          transition: .3s ease-in-out;
}
.search .form-control {
  width: 6rem !important;
  color: #eee;
  border-color: rgba(55, 165, 166, 0.6);
  background-color: rgba(55, 165, 166, 0.2)
}
.search .form-control:focus {
  width: 10rem !important;
  color: #fff;
  border-color: rgba(55, 165, 166, 1);
  background-color: rgba(55, 165, 166, 1);
  box-shadow: none;
}

.search .form-control::-webkit-input-placeholder {
  color: #eee;
}
.search .form-control:-moz-placeholder {
  color: #eee;
}
.search .form-control::-moz-placeholder {
  color: #eee;
}
.search .form-control:-ms-input-placeholder {
  color: #eee;
}

.search .form-control:focus::-webkit-input-placeholder {
  color: #fff;
}
.search .form-control:focus:-moz-placeholder {
  color: #fff;
}
.search .form-control:focus::-moz-placeholder {
  color: #fff;
}
.search .form-control:focus:-ms-input-placeholder {
  color: #fff;
}

.search-light .form-control {
  width: 100% !important;
  color: #eee;
  border-color: rgba(55, 165, 166, 0.6);
  background-color: rgba(55, 165, 166, 0.2)
}
.search-light .form-control:focus {
  width: 100% !important;
  color: #fff;
  border-color: rgba(55, 165, 166, 1);
  background-color: rgba(55, 165, 166, 1);
}

.search-light .form-control::-webkit-input-placeholder {
  color: #37a5a6;
}
.search-light .form-control:-moz-placeholder {
  color: #37a5a6;
}
.search-light .form-control::-moz-placeholder {
  color: #37a5a6;
}
.search-light .form-control:-ms-input-placeholder {
  color: #37a5a6;
}


.jumbotron {
  padding-top: 6rem;
  padding-bottom: 6rem;
  margin-bottom: 0;
  background-color: #fff;
}

.jumbotron p:last-child {
  margin-bottom: 0;
}

.jumbotron-heading {
  font-weight: 300;
}

.jumbotron .container {
  max-width: 40rem;
}


/*
 * Album note change to store
 */

.album {
  padding-top: 4rem;
  padding-bottom: 3rem;
  background-color: #f7f7f7;
}

.card-dovedale {
  padding: .75rem;
  margin-bottom: 2rem;
  border: 0;
}
.card-transparent {
  background-color: transparent;
  border-radius: 0;
}

.card-borderless {
  padding: 0px;
}

.card-division {
  float: left;
  width: 33.333%;
}

.card .img {
  margin-bottom: .75rem;
}
.card figure {
  width: 100%;
}

/*Pagination colours*/
.page-item.active .page-link, .page-item.active .page-link:focus, .page-item.active .page-link:hover {
  color: #fff;
  background-color: #37a5a6;
  border-color: #37a5a6;
}
.page-item.disabled .page-link, .page-item.disabled .page-link:focus, .page-item.disabled .page-link:hover {
  color: #818a91;
  background-color: #fff;
  border-color: #ddd;
}
.page-link {
  color: #37a5a6;
  background-color: #fff;
  border: 1px solid #ddd;
}
.page-link:focus, .page-link:hover {
  color: #f49430;
  background-color: #eceeef;
  border-color: #ddd;
}

@media (max-width: @screen-sm-min) {
  .card-text {
    font-size: 85%;
  }
}
.text-center {
  text-align: center;
}



/*
 * Product detail page
 */

@media (min-width: 576px) {
  /* Bump up size of carousel content */
  .similar-products {
    margin-top: 1rem;
    background-color: #e5e5e5;
    border-radius: 1rem;
  }
}

.similar-products .card {
  background-color: transparent;
  border: 2px solid #fff;
}


/*
 * Featurettes
 */

.featurette {
  margin-top: 4rem;
}
.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.05rem;
}

/* Headline */
.headline {
  padding-top: 1.25rem;
  padding-bottom: .75rem;
  background-color: #F8b05e;
  text-align: center;
}
.headline h1 {
  font-weight: normal;
  color: #fff;
  text-shadow: none;
}
.marketing-img {
  border: 2px solid #37a5a6;
}
.figure-caption {
  color: #37a5a6;
}


/*
 * Markdown
 */

 .markdown img {
   width: 100%;
   background: #fafafa;
   border: 1px solid #eee;
 }
 .markdown ul {
   padding-left: 0;
   margin-bottom: 0
   font-size: 85%;
   padding: .55rem 1.05rem;
   background-color: transparent;
 }

 .markdown li {
   position: relative;
   display: block;
   padding: 0.75rem 1.25rem;
   margin-bottom: -1px;
   border: 1px solid #ddd;
 }


/*
 * Marketing content
 */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2 {
  font-weight: normal;
}
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}

.cover-image {
  position: relative;
}

.cover-image-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.cover-image-inner > .cover-image-item {
  position: relative;
  display: none;
  -webkit-transition: .6s ease-in-out left;
       -o-transition: .6s ease-in-out left;
          transition: .6s ease-in-out left;
}
.img-unrounded {
  border-radius: 0;
}


/*
 * Profile
 */

/* https://desandro.github.io/3dtransforms/docs/card-flip.html */
/*.card-container {
   width: 100%;
   height: 35rem;
   position: relative;
   perspective: 800px;

}*/

/*#card {

   width: 100%;
   height: 100%;
   position: absolute;
   transform-style: preserve-3d;
   transform-origin: right center;
   transition: transform 1s;
}

#card figure {
   border-radius: 0.25rem;
   border: 1px solid rgba(0, 0, 0, 0.125);
   background: #eee;
   margin: 0;
   display: block;
   position: absolute;
   width: 100%;
   height: 100%;
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
}

.card-block::after {
  content: "";
  display: table;
  clear: both;
}

#card .front {

}
#card .back {
  transform: rotateY( 180deg );
}

#card.flipped {
  transform: translateX( -100% ) rotateY( -180deg );
}

.media-left {
  padding-right: 2rem;
}*/


/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 7rem;
  }
}

.display-responsive {
  font-size: 2rem;
  font-weight: 300;
}

/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {
  .display-responsive {
    font-size: 3.5rem;
  }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .display-responsive {
    font-size: 4.5rem;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .display-responsive {
    font-size: 5.5rem;
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .display-responsive {
    font-size: 6rem;
  }
}


/*
 * Forms
 */

.form-control {
  background-color: rgba(244, 148, 48, 0.2);
  border-color: rgba(55, 165, 166, 0.6)
  -webkit-transition: .3s ease-in-out;
       -o-transition: .3s ease-in-out;
          transition: .3s ease-in-out;
}
.form-control:focus {
  color: #fff;
  background-color: rgba(55, 165, 166, 0.6);
  border-color: rgba(244, 148, 48, 0.6);
}

/*
 * Footer
 */

/* Padding below the footer and lighter footer text */
.footer {
  margin-top: 140px;
  padding-bottom: 40px;
  color: #5a5a5a;
}
.footer-icons {
  text-align: center;
}
.footer-icons .footer-logo {
  display: block;
  margin: 16px 0;
}
@media (max-width: 543px) {
  .poli-logo {
    padding: 6px 49.88315px;
  }
}
@media (min-width: 544px) {
  .footer-icons {
    text-align: right;
  }
  .footer-icons .footer-logo {
    display: inline-block;
    margin: 0 8px;
  }
  .poli-logo {
    padding: 6px 10px;
  }
}
/* Logo up button */
.scroll-up {
  cursor: pointer;
}
.scroll-up .icon-arrow {
  -webkit-transition: fill .2s linear;
       -o-transition: fill .2s linear;
          transition: fill .2s linear;
}
.scroll-up:hover .icon-arrow,
.scroll-up:active .icon-arrow {
  fill: #f49430;
}
.poli-logo {
  border: 2px solid #30469d;
  border-radius: 8px;
  -webkit-transition: border-color .2s linear;
       -o-transition: border-color .2s linear;
          transition: border-color .2s linear;
}
.poli-logo:hover,
.poli-logo:active {
  border-color: #f49430;
}
.stripe-logo .stripe-logo-bg {
  -webkit-transition: fill .2s linear;
       -o-transition: fill .2s linear;
          transition: fill .2s linear;
}
.stripe-logo:hover .stripe-logo-bg,
.stripe-logo:active .stripe-logo-bg {
  fill: #f49430;
}
.kea-logo .kea-logo-element {
  fill-opacity: 0;
  -webkit-transition: fill-opacity .2s linear;
       -o-transition: fill-opacity .2s linear;
          transition: fill-opacity .2s linear;
}
.kea-logo:hover .kea-logo-element,
.kea-logo:active .kea-logo-element {
  fill-opacity: 1;
  stroke: #000;
}