/* ************************************************************************
* File: box.css
*
* Purpose: Box element css
*
* This file is part of a software by Jens Gienau.
* (c)1999 - 2023 Jens Gienau / www.gienau.com / mail@gienau.com
************************************************************************ */

/* ------------------------------------------------------------------------
testimonial
------------------------------------------------------------------------ */
.testimonial {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display:flex;
	
}
.testimonial .testimonial-item {
	max-width:280px;
	text-align:center;
	position:relative;
	flex: 1; /* additionally, equal width */
	margin:75px auto 0 auto;
}
.testimonial .testimonial-item .testimonial-image {
	height:75px;
	width:75px;
	background-color: #f2f2f2;
	border: 2px solid #f2f2f2;
	top:-50px;
	position:absolute;
	left: 0;
	right: 0;
	margin: auto
}
.testimonial .testimonial-item .testimonial-body {
	border: 2px solid #f2f2f2;
	padding:25px 1rem 1rem 1rem;
	background-image: -webkit-linear-gradient(bottom, #FFFFFF , #ebf3f9);
	background-image: -moz-linear-gradient(top bottom, #FFFFFF , #ebf3f9 );
	background-image: -o-linear-gradient(top  bottom, #FFFFFF , #ebf3f9 );
	background-image: linear-gradient(top bottom, #FFFFFF , #ebf3f9 );
	height:100%;
}
.testimonial .testimonial-item .testimonial-body .testimonial-name {
	font-family: 'satoshiblack', sans-serif;
}
.testimonial .testimonial-item .testimonial-body .testimonial-stars i {
	color: #f6bb05;
	margin: .2rem;
}

/* Equal Heights for OwlCarousel 2 */

.owl-carousel {
	.owl-stage {
		display: flex;
	}
	.owl-item {
		display: flex;
		flex: 1 0 auto;
	}
	.caption {
		display: flex;
		flex: 1 0 auto;
		flex-direction: column;
	}
	.flex-text {
		flex-grow: 1
	}
	.thumbnail {
		display: flex;
		flex-direction: column;
		margin: 0 15px;
	}
}

/* ------------------------------------------------------------------------
box
------------------------------------------------------------------------ */
.flex-container.boxitem  {
	height:100%;
}
.flex-container.boxitem .flex-col-1,
.flex-container.boxitem .flex-col-2,
.flex-container.boxitem .flex-col-3 {
	text-align:center;
	border: 3px solid #f2f2f2;
	background-image: -webkit-linear-gradient(bottom, #FFFFFF , #ebf3f9);
	background-image: -moz-linear-gradient(top bottom, #FFFFFF , #ebf3f9 );
	background-image: -o-linear-gradient(top  bottom, #FFFFFF , #ebf3f9 );
	background-image: linear-gradient(top bottom, #FFFFFF , #ebf3f9 );
	padding:1rem;
	flex: 1;
	margin-bottom:1rem;
}

.flex-container.boxitem .flex-col-1.highlight,
.flex-container.boxitem .flex-col-2.highlight,
.flex-container.boxitem .flex-col-3.highlight {
	border: 3px solid #e32;
}

.flex-container.boxitem .boxitem-image {
	height:75px;
	width:75px;
	background-color: silver;
	border: 2px solid gray;
	margin: .5rem auto;
}

.flex-container.boxitem .boxitem-symbol {
	font-size: 75px;
	line-height:1rem;
	padding:0;
	margin:0;
}

.flex-container.boxitem .boxitem-name {
	font-family: 'satoshiblack', sans-serif;
}
.flex-container.boxitem .boxitem-header {
	font-family: 'satoshiitalic', sans-serif;
}

.flex-container.boxitem .boxitem-text {
	margin-top:1rem;
}

/* ========================================================================
MEDIA QUERY: DESKTOP SMALL
======================================================================== */

@media only screen and (min-width: 800px) {

	.flex-container.box h3 {
		font-size: 2rem;
		line-height: 2.5rem;
	}

	.flex-container.box p {
		font-size: 1.5rem;
		line-height: 1.9rem;
	}
	.flex-container.box .flex-col-2:first-of-type {

	}
}