/*
//////////////////////////////////////////////////////////
///
///
///       extra css voor homepage
///
///
//////////////////////////////////////////////////////////
*/


body {
   background-size: 100% 100%;
    bottom: 0px;
    background-repeat: no-repeat;
    background-attachment: fixed;
	background-image: url("/fileadmin/templates/pictures/blackout.jpg");

}

#containerhomepage {
    margin: 50px auto 0 auto;
    width: 100%;
    padding: 0;
}

.homepage-hero {
	margin: 0px 0px;
	padding: 80px 40px 10px 40px;
}



#homepagespreads, #homepage-spread1, #homepage-spread2, #homepage-spread3, #homepage-spread4, #homepage-spread5,#homepage-spread6 {
    width: 100%;
   background-size: 100% auto;
    background-repeat: no-repeat;
    background-attachment: fixed;
    overflow: hidden;
    border-top: 0px solid #06397d;
}

#homepagespreads {

   background-size: 100% 100%;
}



.row {
	margin: 0px;
	padding: 20px;
}

.row, .card {
	background-color: initial;
}

.card-header {
	background-color: #0a336fb5;
	color: #fff;
}

.card-header H4 {
	color: #fff;
}


.card-body {
	background-color: #fff;
	text-align: center;
}




.flip-card {
  color: #fff;
  background-color: transparent;
  width: 33.33333333%;
  height: 380px;
  perspective: 1000px;
  margin: 10px 0px;
}

.flip-card-inner {
  margin: 0px;

  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
  transform: rotateX(180deg);
}

 .flip-card-front-blue, .flip-card-back-blue, .flip-card-front-transparent, .flip-card-back-transparent {
    text-align: center!important;
    padding: 40px;
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
    box-shadow: 2px 2px 5px 0px rgb(0 0 0 / 60%);
	display: flex;
	flex-direction: row;
	align-items: center;
}

.flip-card-front-blue {
  background-color: #06397de3;
  color: #fff;
border-radius: 500px;
}

.flip-card-back-blue {
  background-color: #06397de3;
  color: #fff;
  transform: rotateX(180deg);
border-radius: 500px;

}

.flip-card-front-transparent {
  background-color: #00000090;
  color: #fff;
	border-radius: 5px;
}

.flip-card-back-transparent  {
  background-color: #00000090;
  color: #fff;
  transform: rotateX(180deg);
	border-radius: 5px;
}

.card-body {
	color: #06397d;
    	box-shadow: 2px 2px 5px 0px rgb(0 0 0 / 60%);
}

.card-header:first-child {
	background-color: #06397d;

}

.carousel {
	height: 600px;
	width: 80%;
	margin: 0 auto;
    	box-shadow: 2px 2px 5px 0px rgb(0 0 0 / 60%);
	border-radius: 10px;
} 

.carousel-inner {
    position: relative;
    width: 100%;
    margin: auto;
    overflow: hidden;
	border-radius: 10px;
}

.carousel-item {
	top: 0;
	position: relative;
    	float: left;
    	width: 100%;
    	margin-right: -100%;

    	-webkit-backface-visibility: hidden;
    	backface-visibility: hidden;
    	transition: transform 1.5s ease-in-out;
}

.carousel-caption {
    	top: 3.00rem;

	margin: 0 auto;
	width: 600px;
	height: 440px;
    	padding: 40px;
    	text-align: center;
	background-color: #06397da1;
    	color: #fff;
/*
    right: 25%;

    bottom: 3.25rem;
    left: 25%;
*/

}

.card-header {
	background-color: #00000060;
}

.card-body {
	border-radius:5px;
}

h6 {
	font-weight: normal;
	line-height: 1.6em;
}

.carousel-control-next-icon, .carousel-control-prev-icon {
    width: 4rem;
    height: 4rem;
}

IMG.d-block {
    border-radius: 5px;
}