@charset "utf-8";
/* CSS Document */

body{
	background-color:#d5ebd1;
}
.bodywrapper #headerwrapper{
	background-color:#FFF;
	border-bottom:solid 1px #98c006;
}
.bodywrapper #headerwrapper #logo{
	width:850px;
	margin:0px auto 0px auto;
	padding:25px 0px 15px 0px;
}
.bodywrapper #mainwrapper{
	width:850px;
	margin:0px auto 30px auto;	
}
.bodywrapper #mainwrapper .image{
/*	background-image:url(../img/St-prex_image.png);
	height:371px;*/
	border-left:solid 1px #98c006;
	border-right:solid 1px #98c006;
	margin-bottom: -2px;
}
.bodywrapper #mainwrapper .informations{
	background-color:#FFF;
	border-left:solid 1px #98c006;
	border-right:solid 1px #98c006;
	border-bottom:solid 1px #98c006;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	padding:30px 10px 0px 10px;
}
.bodywrapper #mainwrapper .informations .colonne{
	float:left;
	width:255px;
	padding:10px;
}
.bodywrapper #mainwrapper .informations p{
	line-height:1.2;
	font-size:1em;
}
.bodywrapper #mainwrapper .informations li{
	line-height:1;
	font-size:1em;
}
.bodywrapper #mainwrapper button{
	text-align:center;
    padding:10px;
    margin:10px 10px 10px 0;
    background-color:#009088;
	border:solid 1px #009088;
    color:#FFF;
    font-size:120%;
    font-weight:bold;
    border-radius:5px;
    box-shadow:2px 2px 2px rgba(0,0,0,0.5);
    width:95%;
}
.bodywrapper #mainwrapper button:hover{
    background-color:#FFF;
	border:solid 1px rgba(0,0,0,.3);
    color:#009088;
}
.bodywrapper #mainwrapper button:active{
	margin:12px 8px 8px 2px;
	box-shadow:none;
}
.bodywrapper #mainwrapper button[onclick]{
	cursor:pointer;
}
.banner-webshop {
	background-color: #FFF;
	padding: 20px;
}
.banner-webshop img {
	width: 728px;
	height: auto;
	margin: 0 auto;
}
.banner-webshop .desktop {
	display: block;
	border: solid 2px #00bde7; 
}
.banner-webshop .mobile {
	display: none;
}

@media (max-width: 867px) {
/*	.bodywrapper #mainwrapper .image{
		height:346px;
		background-size:100% 100%;
	}*/
	.bodywrapper #headerwrapper #logo{
		width:auto;
	}
	.bodywrapper #mainwrapper{
		width:100%;
	}
	.bodywrapper #mainwrapper .informations{
		border:none;
	}
	.banner-webshop img {
		width: 100%;
	}
}

@media (max-width: 700px) {
/*	.bodywrapper #mainwrapper .image{
		height:339px;
	}*/
}

@media (max-width: 600px) {
/*	.bodywrapper #mainwrapper .image{
		height:269px;
	}*/
}

@media (max-width: 500px) {
/*	.bodywrapper #mainwrapper .image{
		height:219px;
	}*/
	.banner-webshop .desktop {
		display: none;
	}
	.banner-webshop .mobile {
		display: block;
		width: 300px;
	}
}

@media (max-width: 425px) {
	.bodywrapper #mainwrapper{
		margin-bottom:0px;
	}
	.bodywrapper #headerwrapper #logo{
		padding-top:10px;
		padding-bottom:5px;
		padding-left:10px;
	}
	.bodywrapper #headerwrapper #logo img{
		width:140px;
		height:auto;
	}
/*	.bodywrapper #mainwrapper .image{
		height:191px;
	}*/
	.bodywrapper #mainwrapper .informations{
		padding-top:15px;
		padding-left:0px;
		padding-right:0px;
	}
	.bodywrapper #mainwrapper .informations .colonne{
		width:auto;
		float:none;
	}
	.bodywrapper #mainwrapper button{
		width:90%;
		margin-left:5%;
		margin-right:5%;
	}
	.bodywrapper #mainwrapper .informations .colonne:nth-child(2) > h1,
	.bodywrapper #mainwrapper .informations .colonne:nth-child(3) > h1{
		border-top:solid 1px rgba(0,0,0,.2);
		padding-top:30px;
	}
	.bodywrapper #mainwrapper .informations .colonne:nth-child(2){
		padding-bottom:0;
	}
	.bodywrapper #mainwrapper .informations .colonne:nth-child(2) > h1,
	.bodywrapper #mainwrapper .informations .colonne:nth-child(3) > h1{
		border:none;
		padding-top:0;
	}
	.bodywrapper #mainwrapper .informations .colonne:nth-child(2) > h1:first-child,
	.bodywrapper #mainwrapper .informations .colonne:nth-child(3) > h1:first-child{
		border-top:solid 1px rgba(0,0,0,.2);
		padding-top:30px;
	}
	.bodywrapper #mainwrapper img[src*=img_facebook]{
		width:auto;
	}
}

@media (max-width: 375px) {
/*	.bodywrapper #mainwrapper .image{
		height:169px;
	}*/
}

@media (max-width: 320px) {
/*	.bodywrapper #mainwrapper .image{
		height:144px;
	}*/
	.banner-webshop .mobile {
		width: 100%;
	}
}
