/*
Colors: Pink-ish = #f2adb2;
		Deep Pink = #d36f77;
		Cream-ish = #faf6eb;
		Dark Gray = #968a7e;
		Light Gray = #bfb6af;
*/

/* custom fonts: */

@font-face
{
	font-family: "alegreya sans";
	src: url("/fonts/AlegreyaSans-Regular.otf");
}

@font-face
{
	font-family: "pristina";
	src: url("/fonts/PRISTINA.TTF");
}

@font-face
{
	font-family: "open sans";
	src: url("/fonts/OpenSans-Regular.ttf");
}

title {
	font-family: "alegreya sans";
	font-weight:normal;
	font-style:normal;
}

table, th {
    margin: 10px;
}

td {
    padding-left: 0.5rem;
} 

header {
    margin: 0;
	background-color:#faf6eb;
	border-style:solid;
	border-width: 0px 0px 15px 0px;
	border-color: #d36f77;
	border-radius: 15px;
	font-family: pristina;
	font-weight:normal;
	font-style:normal;
}

body {
margin:0;
display: flex;
flex-direction: column;

}

body {
	background-image: url("/images/background/LelyZorg Background.png");
	font-family: "open sans";
	font-weight:normal;
	font-style:normal;
}


.header1 {
	color:#d36f77;
	font-family: pristina;
	font-size: 1.8vmax;
	padding-left: 15px;
}

/*

@keyframes showcaseFade {
    
    0%  {opacity:1;
    }
    12% {opacity:1;
    }
    13% {
        opacity:0;
    }
    14% {opacity:1;
    }
    28% {opacity:1;
    }
    29% {opacity:0;
    }
    30% {opacity:1;
    }
    44% {
        opacity:1;
    }
    45% {opacity:0;
    }
    46% {opacity:1;
    }
    60% {opacity:1;
    }
    61% {opacity:0;
    }
    62% {
        opacity:1;
    }
    80% {opacity:1;
    }
    81% {opacity:0;
    }
    82% {opacity:1;
    }
    
    100% {opacity:1;
    }
    
}

#cf iframe:nth-of-type(1) {
  animation-delay: 8s;
}
#cf iframe:nth-of-type(2) {
  animation-delay: 6s;
}
#cf iframe:nth-of-type(3) {
  animation-delay: 4s;
}
#cf iframe:nth-of-type(4) {
  animation-delay: 2s;
}
#cf iframe:nth-of-type(5) {
  animation-delay: 0;
}

#cf iframe {
    animation-name: showcaseFade;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite; 
    animation-duration: 5s;
    position:absolute;
    -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity 1s ease-in-out;
  transition: opacity 1s ease-in-out;
}

.showcasecontainer {
    position:relative;
    background-color:rgba(150,138,126,0.3);
    height:20rem;
    overflow-y: hidden;
}

.showcase {
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

*/

.showcasecontainer{
    margin-top: 20px;
    overflow-x: scroll;
    overflow-y: hidden;
    vertical-align:middle;
    white-space: nowrap;
    background-color:rgba(150,138,126,0.3);
    width:100%;
    height: 17rem;
}

.showcase{
    display:inline-block;
    vertical-align:middle;
    padding: 12px 20px 0 20px;
    height: 15rem;
    border: none;
}


.col-container {
    display: table; /* Make the container element behave like a table */
    width: 100%;
}


.column {
  display: table-cell;
  vertical-align: middle;
  padding: 5px 15px 5px 15px;
  border: 0.5rem solid #f2adb2;
  border-radius: 10px;
  font-family:"open sans";
  font-size:1rem;
  color:#1f1e1d;
  background-color:#faf6eb;
}

.vl {
  display:table-cell;
  border-left: 50px #f2adb2 ;
  height: 4rem;
}

.contact-container {
    display: table;
    float: left;
    width: 100%;
    background-color:#d36f77;
}

.contact{
    display:table-cell;
    vertical-align: top;
    color:#FFFFFF;
    font-family:"open sans";
    font-size:1rem;
    text-align: left;
    padding: 10px 0 15px 5px;
}

.contentboxhr {
	vertical-align: baseline;
	text-align:center;
	font-family:"open sans";
	font-weight:bold;
	font-size:1rem;
	color:#FFFFFF;
	background-color:#e65756;
	padding: 5px;
}

.contentbox {
font-family:"open sans";
font-size:14px;
color:#968a7e;
background-color:#faf6eb;
border:10px solid #f2adb2;
padding:10px;
}

.list{
    content:"✓";
    color:#d36f77;
}

.list1{
    color:#d36f77;
    padding-right: 5px;
}