.qb-element {
  will-change: opacity;
  -webkit-transition: opacity 250ms;
  transition: opacity 250ms;
  opacity: 1; }

.qb-element--hide {
  opacity: 0; }
.ccontainer > .page-enter {
  position: relative;
  z-index: 2;
  opacity: 0.01; }

.ccontainer > .page-enter-active {
  opacity: 1;
  transition: opacity 500ms ease; }

.ccontainer > .page-leave {
  position: absolute;
  top: 0;
  width: 100%;
  opacity: 1; }

.ccontainer > .page-leave-active {
  opacity: 0.01;
  transition: opacity 300ms ease; }
.loader,
.loader:before,
.loader:after {
  border-radius: 50%; }

.loader:before,
.loader:after {
  position: absolute;
  content: ''; }

.loader:before {
  width: 5.2em;
  height: 10.2em;
  background: #FFFFFF;
  border-radius: 10.2em 0 0 10.2em;
  top: -0.1em;
  left: -0.1em;
  -webkit-transform-origin: 5.2em 5.1em;
  transform-origin: 5.2em 5.1em;
  -webkit-animation: load2 2s infinite ease 1.5s;
  animation: load2 2s infinite ease 1.5s; }

.loader {
  color: #2CA01C;
  font-size: 11px;
  text-indent: -99999em;
  margin: 55px auto;
  position: relative;
  width: 10em;
  height: 10em;
  box-shadow: inset 0 0 0 1em;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0); }

.loader:after {
  width: 5.2em;
  height: 10.2em;
  background: #FFFFFF;
  border-radius: 0 10.2em 10.2em 0;
  top: -0.1em;
  left: 5.1em;
  -webkit-transform-origin: 0px 5.1em;
  transform-origin: 0px 5.1em;
  -webkit-animation: load2 2s infinite ease;
  animation: load2 2s infinite ease; }

@-webkit-keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

@keyframes load2 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }

.container > .loader-wrapper {
  position: absolute;
  top: 100px;
  left: 425px; }
.card-enter {
  position: relative;
  z-index: 2;
  transform: translate3d(150px, 0, 0);
  opacity: 0.1; }

.card-enter.card-enter-active {
  transition: all 300ms ease-out;
  transform: translate3d(0, 0, 0);
  opacity: 1; }

.card-leave {
  position: absolute;
  z-index: 3;
  transform: translate3d(0, 0, 0);
  top: 0;
  left: 0;
  opacity: 1;
  width: 100%; }

.card-leave.card-leave-active {
  transition: all 300ms ease-out;
  transform: translate3d(-150px, 0, 0);
  opacity: 0; }

.card-back-enter {
  position: relative;
  z-index: 2;
  transform: translate3d(-150px, 0, 0);
  opacity: 0.1; }

.card-back-enter.card-back-enter-active {
  transition: all 300ms ease-out;
  transform: translate3d(0, 0, 0);
  opacity: 1; }

.card-back-leave {
  position: absolute;
  z-index: 3;
  transform: translate3d(0, 0, 0);
  top: 0;
  left: 0;
  opacity: 1;
  width: 100%; }

.card-back-leave.card-back-leave-active {
  transition: all 300ms ease-out;
  transform: translate3d(150px, 0, 0);
  opacity: 0; }
.App {
  /* width: 100%;
     * max-width: 960px;
     */
  margin: 0 auto;
  min-height: 400px;
  position: relative; }


.sbc-star {
  font-size: x-large;
  color: #f7d232;
  cursor: pointer;
}
#sbc_star_rating {
  font-weight: 500;
  font-size: large;
  margin-bottom: 5px;
}

.star_message {
  font-size: small !important;
  margin: 6px 0;
}

#sbc_star_rating .rating > span.hover:before{
  content: "\2605";
  position: absolute;
}

.social-icons-share {
    float: left;
    margin: 0 5px 0 0;
    font-size: 20px;
}

.social-icons-share-font {
    font-size: 20px!important;
}

