/* Kacheln Startseite, Lernportal, Projekt */
.kachel {
    text-align: center;
}
.kachel .img-responsive {
	padding: 2px;
	overflow: hidden;
}
.kachel .thumbnail {
	min-height: 135px;
}
.kachel_image{
	max-width: 100%;
	max-height: 150px;
	margin: 0;
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-ms-transform: scale(0.7);
	-o-transform: scale(0.7);
	transform: scale(0.7);
	-webkit-transition: all 0.4s linear;
	-moz-transition: all 0.4s linear;
	-ms-transition: all 0.4s linear;
	-o-transition: all 0.4s linear;
	transition: all 0.4s linear;
}
.kachel_image:hover, .kachel_image:focus {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}
#startpage .thumbnail {
    border: 1px solid #D5E9FF;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
	padding:0;
}
#startpage .caption {
    padding: 0 3px;
	line-height: normal;
}
#startpage .caption b {
    color: #e2033c;
	font-weight: bold;
	
}

.caption {
text-decoration: none !important;
}
#startpage .thumbnail {
	height: 220px;
	border: 3px ridge #D5E9FF;
	background: #ECF6FC;
}



#startpage h2, #startpage h3 {
	font-weight: bold;
	margin: 45px 0 10px;
}
#startpage h4 {
	color: #e2033c;
	font-weight: bold;
}
#startpage .listen_element {
	margin: 5px 20px;
}
#geotis_start {
	font-size:36px;
	font-weight:bold;
	font-variant: small-caps;
	line-height: 1.1;
	width:  180px;
	height: 180px;
	background: linear-gradient(65deg, #004288 10%,  #e2033c 90%);
	color: #FFFFFF;
	border: 8px solid #C4C5C8;
	border-radius: 50%;
	transition: all 0.7s;
	margin: 25px;
	padding:40px 25px;
}
#geotis_start:hover, #geotis_start:focus {
	padding-top:20px;
	transform: rotate(360deg);
	box-shadow: 0px 0px 20px 5px #DCDE70;
}
#geotis_start:hover span {
	display: none
}
#geotis_start:hover:before {
	font-size: 28px;
	content: 'Start \A Digitaler \A Atlas!';
	white-space: pre;
}
#start-carousel {
	width: 330px;
	max-width: 100%;
	margin: 0 auto;
	padding: 3px;
	background-color: #F9FCFF;
	border: 2px solid #D5E9FF;
}
#pause {
	width: 30px;
	height: 16px;
	border:none;
	background: url('/homepage/media/startpage/btn-stop.svg') no-repeat;
}
#play {
	width: 30px;
	height: 16px;
	border:none;
	background: url('/homepage/media/startpage/btn-play.svg') no-repeat;
}
#start-carousel .img-responsive {
	width: 320px;
	_height: 180px;
	max-width: 100%;
}


.cards_row {
	margin: 5px;
}
.card {
	height: 180px;
	border: 3px ridge #D5E9FF;
	padding: 7px;
	overflow:hidden;
}
@media (max-width: 768px){
	.card {
		height: fit-content;
	}
}
.card-image {
	height: 150px;
	margin: 5px;
	filter: grayscale(30%);
}
.card-image:hover {
	filter: grayscale(0%);
}
.card-title h5 {
	background-color: #004288;
	color: #FFFFFF;
	padding: 6px;
	margin: 0 0 8px;
	font-weight: bold;
}