html{height: 100%;}
body {
 
  max-width: 1800px;
	overflow: hidden;
  margin:0px auto;
	font-family: "Helvetica Neue", Helvetica, Arial, "sans-serif";
	height: 100%;
}
	h1{color:#224C72;font-size: 22px;
		letter-spacing: 1px;
		font-weight: 300;
		text-align: center;
		
	}
a{text-decoration: none;}

	.wrapper{
		display: flex;
		flex-direction: column;
        margin-top:100px;
	}	
	
	
header{
	display: flex; 
}

.header img{
    width: 100%;
    height: auto;
}
	
.texte{
	display: flex;
	justify-content: center;
	text-align: center;
	margin-top:-20px;
	margin-bottom:20px;
}	

.logo{
    margin-top:-80px;
    padding: 20px 30px;
    background-color: #fff;
}
.texte img{
	max-width: 240px;
}


	
.btn {
  width: 250px;
  height:130px;
  background: #000;
}
.btn svg {
 position: absolute;
 width: 250px;
 height:130px;
}
.btn-1 rect {
  fill: none;
  stroke: #bb9166;
  stroke-width: 4;
  stroke-dasharray: 422, 0;
  transition: all 0.35s linear;
}
.btn-2 rect {
  fill: none;
  stroke: #7C174C;
  stroke-width: 4;
  stroke-dasharray: 422, 0;
  transition: all 0.35s linear;
}
.btn-3 rect {
  fill: none;
  stroke: #303E4B;
  stroke-width: 4;
  /*stroke-dasharray: 422, 0;*/
  transition: all 0.35s linear;
}


.btn-1:hover rect, .btn-2:hover rect, .btn-3:hover rect, .btn-4:hover rect{
  stroke-width: 20;
  /*stroke-dasharray: 15, 410;
  stroke-dashoffset:70;*/
  transition: all 1.0s cubic-bezier(0.19, 1, 0.22, 1);
}
.texte-bouton{
  width: 250px;
  top:0;
  padding:15px 0px;
  height:100px;
  text-align: center;
  background-color: #fff;
}	
.btn-commanderie{
  background-color: #171717 !important;
}	
.btn-clo{
  background-color: #000 !important;
}	

.texte-bouton p{
	margin-top:30px;
	color:#000;
	text-transform:uppercase;
	letter-spacing: 2px;
}
	
.les-boutons{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-around;
	align-items: flex-end;
	align-content: stretch;
	flex: 1;
	margin-bottom: 70px;
}
	

#dom1, #dom2, #dom3{width:250px;height: 140px;cursor: pointer;}
#dom2{margin-left:10px}
#dom3{margin-left:10px}

	

	
@media screen and (max-width: 930px) {
	
	#dom1, #dom2, #dom3 {width: 210px;}
	.btn { width: 210px;}
	.btn svg {width: 210px;}
	.texte-bouton {width: 210px;}

    .logo img{
        max-width: 150px;
		
	}
    .logo{
    margin-top:-50px;
    padding:10px 15px;
    background-color: #fff;
}
    
	}
	
@media screen and (max-width: 700px) {

	 .logo{
        margin-top:-30px;
        padding:10px 15px;
        background-color: #fff;
    }
	.texte{display: flex;
	margin}
	
	.les-boutons{
	display: flex;
	flex-direction:column;
	align-items:center;
	}
	#dom3, #dom2, #dom4{
		margin-left: 0px;}
}