
/* SMARTPHONES */
@media only screen and (min-width: 320px) {

/*------------------ footer ------------------*/

.footer_coord {
    float: right;
    width: 100%;
    height: 120px;
    position: relative;
}

.footer_coord #info {
float: left;
    font-size: 18px;
    width: 100%;
    text-align: center;
     padding-top: 0px;
       font-family: 'Eb garaMond', serif;
        font-weight: 400;
}

.footer_coord #raison,
.footer_coord #rue,
.footer_coord #codePostal,
.footer_coord #ville,
.footer_coord #region,
.footer_coord #pays {
    display: block;
}

.footer_coord #mail, .footer_coord #tel a, .footer_coord a#maps,
.footer_coord a#fb, .footer_coord a#glp, .footer_coord a#blog{
    display: block;
    width: 38px;
    height: 38px;
    overflow: hidden;
    text-indent: -3000px;
    position: absolute;
    border-radius: 3px;
    padding: 3px;
    margin:0;
}
.footer_coord #mail{
    left: 23%;
    top: 45%;
    background: url('img/inbox.png') no-repeat 3px 3px;
    display: block;
}
.footer_coord #tel a{
    left: 56%;
    top: 45%;
    background:  url('img/phone.png') no-repeat 3px 3px;
    color: #6f4c36;
}

.footer_coord a#maps {
    left: 61%;
    top: 5px;
    background: white url('img/compass.png') no-repeat 3px 3px;
}

.footer_coord .spantel, .footer_coord br{ display:block; }

.footer_coord #pays {
    display: block;
}

.footer_coord #region {
    display: block;
}

.footer_coord a.url {
    display: block;
    width: 20px;
    height: 20px;
    margin: 2px;
    float: left;
}

.footer_coord a#fb {
    left: 40%;
    top: 45%;
    background: url(img/fb.png) no-repeat 3px 3px;
}
.footer_coord a#glp {
    left: 40%;
    top: 80%;
    background: url(img/gplus.png) no-repeat 3px 3px;
}
.footer_coord a#blog {
    left: 72%;
    top: 80%;
    background: url(img/blog.png) no-repeat 3px 3px;
}

/*------------------ page contact ------------------*/

.contact_coord, .contact_coord  #info div{
    text-align: center;
    margin: 10px 0;
}
.contact_coord #raison{
    margin:6px 0 20px 0;
    color:#777777;
    font-size:1.2em;    
}
.contact_coord #pays {
    display: block;
}
.contact_coord #region {
    display: block;
}
.contact_coord .link_coord{
    text-align: center;
    margin: 20px auto;
    width: 200px;
}
.contact_coord a.url {
    display: inline-block;
    width: 38px;
    height: 37px;
    margin: 2px;
    /*float: left;*/
}

.contact_coord a#fb {background: url(img/picto-fb.png);}
.contact_coord a#glp {background: url(img/picto-glp.png);}
.contact_coord a#blog {background: url(img/picto-blog.png);}
.contact_coord a#maps {background: url(img/picto-maps.png);}
.contact_coord a#trip {background: url(img/picto-trip.png);}

#gmaps{ 
float: left;
    width: 100%;
 }



#mail{
    font-size: 14px;
    text-decoration: none;
     font-family: 'Eb garaMond', serif;
     color: #6f4c36;
}
    

}
/* TABLETTES */
@media only screen and (min-width: 768px) {
    .footer_coord #raison,
    .footer_coord #rue,
    .footer_coord #codePostal,
    .footer_coord #ville,
    .footer_coord #region,
    .footer_coord #pays {
        display: inline;
    }

    .footer_coord {

/* background: url(img/adresse.png) no-repeat left center; */

float: right;

margin-left: 0%;

margin-top: 46px;

width: 36.5%;

padding-top: 34px;

height: 64px; 
margin-right: 10px;

}
.footer_coord #tel a, .footer_coord a#maps,
    .footer_coord a#fb, .footer_coord a#glp, .footer_coord a#blog{
    right: auto;
    left: auto;
    top: auto;
    bottom: auto;
    background: transparent;
    display: inherit;
    height: auto;
    overflow: auto;
    text-indent: inherit;
    position: relative;
    border-radius: 0;
    padding: 0;
    color: #000000;
    text-decoration: none;
    font-weight: 400;
    float: left;
    text-align: right;
    font-family: 'Eb garaMond', serif;
    width: 100%;
    }
    .footer_coord #mail{
    right: auto;
    left: auto;
    top: auto;
    bottom: auto;
    background: transparent;
    display: inherit;
    height: auto;
    overflow: auto;
    text-indent: inherit;
    position: relative;
    border-radius: 0;
    padding: 0;
    color: #000000;
    text-decoration: none;
    text-align: right;
    font-weight: 400;
    float: auto;
    width: auto;
    font-family: 'Eb garaMond', serif;
    font-size: 17px;
    line-height: 24px;
    width: 100%;
    }

    .footer_coord .spantel, .footer_coord br{
    display: block;
    width: 100%;
    /* background: url(img/telphone.png) no-repeat left center; */
    height: 25px;
    }
    .footer_coord a#maps.url, .footer_coord a#fb, .footer_coord a#glp, .footer_coord a#blog{
    display: inline-block;
    width: 38px;
    height: 37px;
    margin: 2px;    
    }
    .footer_coord a#maps.url { background: url(img/picto-maps.png); }
    .footer_coord a#fb{
    background: url(img/facebook1.png) no-repeat center;
    margin-left: 0;
    width: 43px;
    font-family: 'Eb garaMond', serif;
    line-height: 19px;
    text-align: center;
    padding-left: 0;
    font-size: 18px;
    height: 0px;
    padding-top: 39px;
    }
    .footer_coord a#glp{ background: url(img/picto-glp.png); }
    .footer_coord a#blog{ background: url(img/picto-blog.png);margin-left: 1px; }
    .contact_coord a#trip {background: url(img/picto-trip.png);}
    .contact_coord, #gmaps{
        float: left;
        width: 50%;
    }
    #mob a {color: #6f4c36;   padding-top: 14px;}
    .footer_coord #info {
    float: left;
    font-size: 18px;
    width: 100%;
    text-align: right;
    padding-top: 0px;
    margin-left: 0;
    font-family: 'Eb garaMond', serif;
    line-height: 29px;
    font-weight: 200;
}

.footer_coord .link_coord{
    float: right;
    width: 50px;
    margin-top: 0%;
}
#bloc_email{
    /* background: url(img/e-mail.png) no-repeat left center; */
    width: 100%;
    height: 36px;
}
}
/* ORDINATEURS */
@media only screen and (min-width: 1024px) {
    .footer_coord {
        /* background: url(img/adresse.png) no-repeat left center; */
        float: left;
        margin-left: 0%;
        margin-top: 37px;
        width: 40%;
        padding-top: 34px;
        height: 114px;
    }
        .footer_coord #info {
    float: left;
    font-size: 20px;
    width: 100%;
    text-align: center;
    padding-top: 0px;
    margin-left: 0;
    font-family: 'Eb garaMond', serif;
    line-height: 29px;
    font-weight: 200;
}
.footer_coord .link_coord{
    float: left;
    width: 12%;
    margin-top: 0px;
    margin-left: 186px;
}
.footer_coord #tel a, .footer_coord a#maps,
    .footer_coord a#fb, .footer_coord a#glp, .footer_coord a#blog{
    right: auto;
    left: auto;
    top: auto;
    bottom: auto;
    background: transparent;
    display: inherit;
    height: auto;
    overflow: auto;
    text-indent: inherit;
    position: relative;
    border-radius: 0;
    padding: 0;
    color: #000000;
    text-decoration: none;
    font-weight: 400;
    float: left;
    text-align: center;
    font-family: 'Eb garaMond', serif;
    width: 100%;
    }
    .footer_coord #mail{
    right: auto;
    left: auto;
    top: auto;
    bottom: auto;
    background: transparent;
    display: inherit;
    height: auto;
    overflow: auto;
    text-indent: inherit;
    position: relative;
    border-radius: 0;
    padding: 0;
    color: #000000;
    text-decoration: none;
    text-align: center;
    font-weight: 400;
    float: auto;
    width: auto;
    font-family: 'Eb garaMond', serif;
    font-size: 18px;
    line-height: 24px;
    width: 100%;
    }
#bloc_email{/* background: url(img/e-mail.png) no-repeat left center; */width: 100%;height: 36px;}
.footer_coord a#fb{background: url(img/facebook1.png) no-repeat left center;margin-left: 0;width: 70%;font-family: 'Eb garaMond', serif;line-height: 35px;text-align: center;padding-left: 42px;font-size: 18px;height: 20px;}
#mob a {
    color: #6f4c36;
    font-weight: 400; 
}

}

