@font-face {
    font-family: 'Avenir Next';
    src: url('../fonts/AvenirNext-Regular/AvenirNext-Regular.eot');
    src: url('../fonts/AvenirNext-Regular/AvenirNext-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/AvenirNext-Regular/AvenirNext-Regular.woff2') format('woff2'),
        url('../fonts/AvenirNext-Regular/AvenirNext-Regular.woff') format('woff'),
        url('../fonts/AvenirNext-Regular/AvenirNext-Regular.svg#AvenirNextLTPro') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Avenir Next';
    src: url('../fonts/AvenirNext-Bold/AvenirNext-Bold.eot');
    src: url('../fonts/AvenirNext-Bold/AvenirNext-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/AvenirNext-Bold/AvenirNext-Bold.woff2') format('woff2'),
        url('../fonts/AvenirNext-Bold/AvenirNext-Bold.woff') format('woff'),
        url('../fonts/AvenirNext-Bold/AvenirNext-Bold.svg#AvenirNextLTPro-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


body {margin:0; padding:0; min-height: 100dvh; width: 100vw; font-family: 'Avenir Next'; font-size: 24px; background:url(../images/dmax/fond.jpg) no-repeat center center; background-size: cover; color:#C09472;}

#global {min-height: 100dvh; width: 100vw;  padding: 20px;  box-sizing: border-box;  display: flex;  flex-direction: column;  justify-content: center;}
#global .global {  width: 100%; max-width: 1740px; margin: 0 auto;}
#bandeau-contact { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center;}
#bandeau-contact > div { margin: 20px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
#bandeau-contact > div i {width: 26px; height: 26px;  display: block; margin-right: 10px; }
#bandeau-contact > div span { flex:1; font-size: 24px; color:#fff; font-weight: 700;}
#bandeau-telephone i {background: url(../images/dmax/icone-telephone.svg) no-repeat center center; background-size: contain;}
#bandeau-mail i {background: url(../images/dmax/icone-mail.svg) no-repeat center center; background-size: contain;}

#logo {width: 425px; margin: 40px auto; }
#logo img {width: 100%; height: auto; display: block;}

#contenu {text-align: center;}
#contenu h1 {color: #fff; font-size: 42px; font-weight: 400;}
#contenu p {margin: 40px 0;}
#contenu strong {color:#fff;}
#contenu i.doigt {display: inline-block; vertical-align: top; width: 30px; height: 30px; background:url(../images/dmax/icone-doigt.png) no-repeat center center; background-size: contain;   margin-right: 5px;}
#contenu .bouton {border:1px solid #fff; padding:5px 7px; border-radius: 50px;  margin: 2px 0; display: inline-block; vertical-align: middle;}
#contenu span.telephone {display: inline-block; vertical-align: middle; }
#contenu i.telephone {display: inline-block; vertical-align: top; width: 30px; height: 30px; background:url(../images/dmax/icone-telephone.svg) no-repeat center center; background-size: contain;   margin-right: 5px;}


@media all and (max-width:1150px) {
    body {  font-size: 21px;}
    #contenu h1 {  font-size: 38px;}
}

@media all and (max-width:990px) {
    body {  font-size: 18px;}
    #bandeau-contact > div span {font-size: 21px;}
    #logo {width: 365px; }
    #contenu h1 {  font-size: 32px;}
    #contenu p { margin: 30px 0;}
    #contenu i.doigt,
    #contenu i.telephone {  width: 23px; height: 23px;}
    #contenu i.doigt {  vertical-align: middle;}
}
@media all and (max-width:780px) {
    #bandeau-contact > div span{font-size: 18px;}
}

@media all and (max-width:550px) {
    body {  font-size: 16px;}
    #bandeau-contact > div {margin: 10px;}
    #bandeau-contact > div span{font-size: 17px;}
    #logo {width: 295px; }
    #contenu h1 {  font-size: 26px;}
    #contenu p { margin: 15px 0;}
    #contenu i.doigt,
    #contenu i.telephone {  width: 20px; height: 20px;}
}