@charset "utf-8";
/* CSS Document */


/* fade up content */


	div.hidden {visibility:hidden;height:0}
.div_ads-static {opacity:1}
	.div_ads-border, .div_ads-full {opacity:1;-webkit-transition: all 0.3s ease; transition: all 0.3s ease}
.div_ads-border.showme, .div_ads-full.showme {  opacity:1 !important}



/* SPIN homepage product icons */
	
	
.card-container {
  height: 250px;
  perspective: 600;
  position: relative;
  margin:0 auto;width:100%;
}
.card {
  height: 100%;
  position: absolute;
  margin:0 auto;width:100%;
}
.card:hover {
  transform: rotateY(360deg);
}
.card .side {
  backface-visibility: hidden;
  height: 100%;
  position: absolute;
  margin:0 auto;
}
.card .back {
}	
.card {  transform-style: preserve-3d;
  transition: all 0.5s ease-in-out;}




/* FLIP card on history pages */


.flip-border {border:2px solid white;margin-left:-2px}
.flip-card {
  background-color: auto;
  width: 100%;
  overflow:hidden;
	perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s ease;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}
.flip-card-front:hover .his-bar-title {display:none !important;transition: transform 0; opacity:0 !important}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;display:block;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #bbb;
  color: black;
}

/* Style the back side */
.flip-card-back {

  color: white;
  transform: rotateY(180deg);
}

/* slider rotation */

div.cycle-slide.cycle-sentinel, div.cycle-slide.cycle-sentinel a, .cycle-next, .cycle-prev {visibility:visible !important;background-color:transparent !important;cursor:pointer}
.cycle-next, .cycle-prev {opacity:0.5} .cycle-next:hover, .cycle-prev:hover {opacity:1}
.cycle-next {background: rgba(0, 0, 0, 0) url(/DeRoyalcom_2018/design_master/img/adsnav.png) no-repeat -40px 0 !important}
.cycle-prev {background: rgba(0, 0, 0, 0) url(/DeRoyalcom_2018/design_master/img/adsnav.png) no-repeat 0 0 !important}