/* CSS Document */

#MyCarsFlex .MyFlexBox {
	background-color:#ccd4db;
	border: solid 1px #025aa4;
	margin: 5px;
	border-radius: 6px;
	box-sizing: border-box;
	
	-webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
	
	text-align:center;
}
#MyCarsFlex .MyFlexBox:Hover {
	box-shadow: 0 0 10px #025aa4;
}
#MyCarsFlex .MyFlexBox p {
	margin:0px;
	padding:0px;
}
#MyCarsFlex .MyFlexBox h3 {
	margin:3px;
	font-weight:600 !important;
}
#MyCarsFlex .MyFlexBox h4 {
	font-weight:600 !important;
	margin:3px;
	color:#906;
}
#MyCarsFlex .MyFlexBox h6 {
	margin:3px;
	color:#0058a2;
}
#MyCarsFlex a {
	display:block;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffda75+0,febf04+100 */
background: #ffda75; /* Old browsers */
background: -moz-linear-gradient(top, #ffda75 0%, #febf04 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffda75 0%,#febf04 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffda75 0%,#febf04 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffda75', endColorstr='#febf04',GradientType=0 ); /* IE6-9 */
	
	-webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
	
	padding:15px;
	border-radius: 6px;
	border: solid 1px #025aa4;
	
	margin:10px;
	font-weight:bold;
	text-decoration:none;
	box-shadow:none;
}
#MyCarsFlex a:hover {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#028402+0,60d160+100 */
background: #028402; /* Old browsers */
background: -moz-linear-gradient(top, #028402 0%, #60d160 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #028402 0%,#60d160 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #028402 0%,#60d160 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#028402', endColorstr='#60d160',GradientType=0 ); /* IE6-9 */
text-decoration:none;
box-shadow: 6px 6px 10px hsla(300,15%,25%,0.3) inset;
}

#MyCarsFlex img { vertical-align:bottom; }
#MyCarsFlex .MyIconsContainer {
	width:100%;
	background-color:#a70000;
	color:#FFF;
	margin:0px;
	display: flex;
  	flex-wrap: wrap;
}
#MyCarsFlex .MyIcons {
	width:53px;
}
#MyCarsFlex .MyIcons img {
	vertical-align:central;
	padding:2px;
}

.MyBlueBox, .MyBlueContactBox {
	background-color: #0058a2;
	border: solid 1px #025aa4;
	margin: 5px;
	border-radius: 6px;
	color:#FFF;
	padding:10px; 
}
.MyBlueBox h2, MyBlueContactBox h2 { color:#FC0; }
.MyBlueBox ul, MyBlueContactBox ul {
    list-style-image: url('../images/yes.png');
	list-style-position: inside;
}
.MyBlueContactBox { margin-left:20px !important; }

.MyGreyBox {
	background-color: #EEEEEE;
	border: solid 1px #025aa4;
	margin: 5px;
	border-radius: 6px;
	padding: 10px;
}
.MyGreyBox h2 { color:#0058a2; }
.MyGreyBox ul {
    list-style-image: url('../images/yes.png');
	list-style-position: inside;
}

.MyOfferContainer { 
	width:100%;
	position:relative;
}
.MyOfferBox {
	border: solid 1px #025aa4;
	background-color: #EEEEEE;
	margin: 5px;
	border-radius: 6px;
	padding: 10px;
}
.MyOfferBox .MyOfferImage {
	position:relative;
	top:0px;
	left: 0px;
}
.MyOfferBox .MyOfferText h2 {
	position:absolute;
	top:40px;
	left: 30px;
	font-weight:bold;
	font-size:2em;
	color:#a70000;
	border-radius: 6px;
	padding: 10px;
	background-color: rgba(254, 191, 4, 0.7);	 
	
	-moz-transform:rotate(-7deg);
    -webkit-transform:rotate(-7deg);
    -o-transform:rotate(-7deg);
    -ms-transform:rotate(-7deg);
    transform:rotate(-7deg);
}

.MyOfferBox .MyOfferPreis {
	position:absolute;
	bottom:80px;
	right: 40px;
	border-radius: 50px;
	padding: 10px;
	background-color: rgba(254, 191, 4, 0.7);
	width:100px;
	height:100px;
	
	-moz-transform:rotate(-7deg);
    -webkit-transform:rotate(-7deg);
    -o-transform:rotate(-7deg);
    -ms-transform:rotate(-7deg);
    transform:rotate(-7deg);
}
.MyOfferBox .MyOfferPreis h3 {
	font-weight:bold;
	font-size:2em;
	color:#a70000;
	padding:0px;
	margin:0px;
	text-align:center;
	line-height:1.5em;
}
.MyOfferBox .MyOfferPreis h4 {
	font-weight:bold;
	font-size:1em;
	line-height:0.5em;
	color:#a70000;
	padding:0px;
	margin:0px;
	text-align:center;
}
.MyOfferBox .MyOfferLink a {
	position:absolute;
	bottom:70px;
	left: 20px;
	width:200px;
	display:block;
	text-align:center;
	
	opacity:0.8;
	
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffda75+0,febf04+100 */
background: #ffda75; /* Old browsers */
background: -moz-linear-gradient(top, #ffda75 0%, #febf04 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffda75 0%,#febf04 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffda75 0%,#febf04 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffda75', endColorstr='#febf04',GradientType=0 ); /* IE6-9 */
	
	-webkit-transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -ms-transition: all 0.30s ease-in-out;
    -o-transition: all 0.30s ease-in-out;
	
	padding:15px;
	border-radius: 6px;
	border: solid 1px #025aa4;
	
	margin:10px;
	font-weight:bold;
	text-decoration:none;
	box-shadow:none;
}
.MyOfferBox .MyOfferLink a:hover {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#028402+0,60d160+100 */
background: #028402; /* Old browsers */
background: -moz-linear-gradient(top, #028402 0%, #60d160 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #028402 0%,#60d160 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #028402 0%,#60d160 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#028402', endColorstr='#60d160',GradientType=0 ); /* IE6-9 */
text-decoration:none;
box-shadow: 6px 6px 10px hsla(300,15%,25%,0.3) inset;
}

@media (max-width: 850px) {
	.MyOfferBox .MyOfferText h2 {
		font-size:1em !important;
	}
	.MyOfferBox .MyOfferPreis {
		bottom:150px;
		right: 40px;
		padding:5px;
		border-radius: 25px;
		width:70px;
		height:50px;
	}
	.MyOfferBox .MyOfferPreis h3 {
		font-size:1em !important;
	}
	.MyOfferBox .MyOfferPreis h4 {
		font-size:0.8em !important;
		line-height:0.5em !important;
	}
		 
}