/* http://meyerweb.com/eric/tools/css/reset/

   v2.0 | 20110126

   License: none (public domain)

*/



html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td,

article, aside, canvas, details, embed,

figure, figcaption, footer, header, hgroup,

menu, nav, output, ruby, section, summary,

time, mark, audio, video {

    margin: 0;

    padding: 0;

    border: 0;

    font-size: 100%;

    font: inherit;

    vertical-align: baseline;

}

/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure,

footer, header, hgroup, menu, nav, section {

    display: block;

}

body {

    line-height: 1;

}

ol, ul {

    list-style: none;

}

blockquote, q {

    quotes: none;

}

blockquote:before, blockquote:after,

q:before, q:after {

    content: '';

    content: none;

}

table {

    border-collapse: collapse;

    border-spacing: 0;

}



.lang-dropdown dd, .lang-dropdown dt, .lang-dropdown ul { margin:0px; padding:0px; }

.lang-dropdown dd { position:relative; }

.lang-dropdown a, .lang-dropdown a:visited {text-decoration:none; outline:none;}

.lang-dropdown a:hover {color:#5d4617;}

.lang-dropdown dt a {display:block; padding-right:20px;width:30px;}

.lang-dropdown dt a span {cursor:pointer; display:block; padding:5px;}

.lang-dropdown dd ul { display:none;left:0px; padding:0; position:absolute; top:2px; width:auto; width:50px; list-style:none;}

.lang-dropdown span.value { display:none;}

.lang-dropdown dd ul li a { padding:5px; display:block;}

.lang-dropdown dd ul li a:hover { border :1px solid #00b4ff;}

.lang-dropdown img.flag { border:none; vertical-align:middle; margin-left:10px; }





.clear{

    clear: both;

}



.pull-icon:before {

    position: absolute;

    left: 8px;

}



.nps-stars{

    position: absolute;

}



.nps-rate{

    position: absolute;

    top: 0;

    left: 0;

}



.icon-star-half::before {

    width: 0.2em!important;

}





.pull-left{

    float: left;

}



.pull-right{

    float: right;

}



.half-left, .half-right{

    width: 50%;

    float: left;

    box-sizing: border-box;

}



body{

    font-family:"helvetica";

    margin:0;

    padding: 0;

    /*min-width: 640px;*/

}



#container{

    background-color: white;

    margin-bottom: 274px;

    padding-bottom: 35px;

    box-shadow: 0 2px 5px #333333;

}





#header{

    background: rgba(0, 0, 0, 0) url("../images/bg.jpg") repeat scroll center center / cover ;

    border-top: 5px solid #00b4ff;

    box-shadow: 0 1px 5px black inset;

    color: white;

    width: 100%;

}



#inner-header{

    padding-top:100px;

    position:relative;

}



#inner-header p{

    max-width:585px;

    font-size:14px;

    margin-bottom:35px;

}



#inner-header h1{

    margin:0;

    font-size:3.75em;

}



#inner-header .button{

    font-size:18px;

    background-color:#00b4ff;

    text-align:center;

    border-radius: 5px;

    padding :14px 40px;

    display: inline-block;

    font-weight: 700;

    line-height: 18px;

    margin-top: 0;

    padding: 13px 20px;

    text-transform: uppercase;

    color:white;

    text-decoration:none;

}



#top-bar{

    min-height:70px;

    width:100%;

    background-color:white;

}



#inner-top-bar > a {

    float:left;

}





#logo {

    margin-top: 18px;

}







#nav{

    float:right;

}



#nav ul{

    list-style: outside none none;

    display:inline-block;

    margin-bottom: 40px;

    margin-top: 42px;

    zoom: 1;

    *display: inline;

}



#nav ul li{

    display:inline-block;

    margin-top: 10px;

    padding: 0 10px;



    zoom: 1;

    *display: inline;



}



#nav ul:first-child li{

    border-right: 2px solid #02708e;

}



#nav ul:first-child li:last-child{

    margin-right: 0;

    border: none;

}



#nav ul li a{

    color:#00B4FF;

    font-weight:bold;

    font-size:16px;

    text-decoration:none;

}



#nav ul li a:hover{

    color:#02708E;

}



#nav ul li a.active{

    color:#02708E;

}



#lang-switcher{

    float:right;

    color:#00b2ff;

    font-weight:bold;

}





#lang-switcher .active{

    color:#007aab;

}



#banner-concours{

    position:absolute;

    top: -11px;

    right:0;

}





.container{

    max-width:980px;

    margin:auto;

}





/*****************************************************************************\

  $SEARCH

\*****************************************************************************/



.steps{

    margin-top: 35px;

}



.step{

    display: inline-block;

    vertical-align: bottom;

    text-align: center;

}



.step.one, .step.three{

    width: 290px;

}



.step.two{

    width: 320px;

}



.step.arrow{

    width: 40px;

    height: 225px;

    background-image: url('/website/views/layouts/images/arrow-step.png') ;

    background-size: 27px 29px;

    background-position: center 65px;

    background-repeat: no-repeat;

}



.step img{

    display: block;

    margin: auto;

}



.step span{

    font-size: 15px;

    display: block;

    color: #b7b3b3;

    font-weight: bold;

    margin-top: 10px;

}



.step span.smaller{

    font-size: 12px;

    font-weight: normal;

}



.highlight{

    padding: 15px 55px;

    background-color: #0084b2;

    color: white;

    font-size: 18px;

    margin-top: 45px;

    text-align: center;

}



.search.container p{

    color : #b7b3b3;

    font-size : 13px;

    margin-top: 30px;

}





/*****************************************************************************\

  $RESULTS

\*****************************************************************************/





body.search{

    background-color: #ffffff;

}



body.search #header{

    height: 400px;

}





form#search{

    background-color: rgba(31, 30, 83, 0.5);

    min-height: 87px;

    border-radius: 5px;

    text-align: center;

    padding: 15px 15px 12px 15px;

    box-sizing: border-box;

}



form#search h2{

    font-size:12px;

    text-align: left;

    font-weight: normal;

    text-transform: uppercase;

    margin : 0 0 10px 0;

}



form#search input{

    height: 35px;

    border-radius: 5px;

    box-sizing: border-box;

    border: none;

}



form#search.hasError input#q_name, form#search.hasError input#q_location{

    border: 2px solid red;

}



form#search input#q_name{

    width: 500px;

}

form#search input#q_location{

    width: 295px;

}



form#search input[type="submit"]{

    width: 145px;

    font-size:14px;

    background-color: #00b4ff;

    color: white;

    text-transform: uppercase;

}







.results-wrapper, .detail-wrapper{

    width: 100%;

    min-height: 500px;

    background-color: #ffffff;

    padding-top: 80px;

    box-sizing: border-box;



}



.results-wrapper h3, .detail-wrapper h3{

    margin-bottom: 20px;

    font-size: 14px;

    color: #00B4FF;

}



.results-wrapper hr, .detail-wrapper hr{

    background-color: #00B4FF;

    border: 1px solid #00B4FF;

    margin: 0 ;

}



.result{

    width: 230px;

    height: 437px;

    display: inline-block;

    margin: 30px 16px 0 0;

    position: relative;

    border: 1px solid #e4e4e4;

    box-sizing: border-box;

    vertical-align: bottom;

    overflow: hidden;

}



.result:nth-child(4n+0){

    margin-right: 0;

}



.results-list {

    text-align: center;

}



.result{

    text-align: left;

}



.result .nps-rate{

    color: #ffffff;

}



.result .nps-background{

    color : #10708d;

}



.result .rate{

    background-color: #00B4FF;

    color:#10708d;

    box-shadow: 2px 2px 3px #888888;

    z-index: 50;

    width: 95px;

    height: 23px;

    position: absolute;

    right: 0;

    top: 110px;

    line-height: 21px;

    box-sizing: border-box;

    padding-left: 5px;

}



.result .icon-star:before, .result .icon-star-half:before{

    width: .6em;

}



.result hr{

    margin-bottom: 15px;

}





.result .image{

    width: 100%;

    height: 153px;

    background-position : center center;

    background-size: contain;

    background-repeat: no-repeat;

    border-bottom: 1px solid #e4e4e4;

    display: block;

}



/*.result .stars-bg, .result .stars-result{

    width: 95px;

    height: 23px;

    position: absolute;

    right: 0;

    top: 110px;

    line-height: 21px;

    box-sizing: border-box;

    padding-left: 10px;

}



.result .stars-bg{

    background-color: #00B4FF;

    color:#10708d;

    box-shadow: 2px 2px 3px #888888;

    z-index: 50;

}



.result .stars-result{

    color: white;

    z-index: 51;

}*/





.result .name{

    text-transform: uppercase;

    font-size : 12px;

    color:#636262;

    height: 26px;

    margin: 10px 8px 0 8px;

    box-sizing: border-box;

    overflow: hidden;

}



.result .description{

    height: 50px;

    font-size: 12px;

    color:#636262;

    margin: 12px 8px 0 8px;

    overflow: hidden;

}



.result hr{

    background-color: #e4e4e4;

    border: 1px solid #e4e4e4;

}



.result .mail, .result .website, .result .phone, .result .address{

    font-size : 10px;

    color: #636262;

    margin: 0 8px 8px 28px;

}



.website a {

    color: #636262;

    text-decoration: none;

}





.result a.detail{

    width: 100%;

    height: 45px;

    font-size: 12px;

    color:#ffffff;

    background-color: #00B4FF;

    position: absolute;

    bottom: 0;

    right: 0;

    text-decoration: none;

    text-align: center;

    line-height: 43px;

    text-transform: uppercase;

}



.pager{

    text-align: center;

}



.pager li{

    display: inline-block;

    margin: 35px 0 0 0;

}



.pager li a{

    display: block;

    width: 35px;

    height: 35px;

    background-color: #e4e4e4;

    color:#00b4ff;

    text-decoration: none;

    font-size: 14px;

    padding-top: 10px;

    box-sizing: border-box;

}



.pager li a.active{

    background-color: #00B4FF;

    color: white;

}





.pub-wrapper{

    margin-top: 35px;

    padding-bottom: 35px;

    text-align: center;

}



.pub{

    width: 230px;

    height: 155px;

    background-color: #E4E4E4;

    margin-right: 16px;

    display: inline-block;

}



.pub:nth-child(4){

    margin-right: 0;

}





#footer-wide{

    width:100%;

    background-color: #02708e;

    padding-top:60px;

    padding-bottom:60px;

    color:white;

    font-weight:bold;

    line-height:18px;

}



#footer{

    font-size:14px; }



#footer ul{

    list-style: outside none none;

    padding:0

}



#footer a{

    color:white;

    text-decoration:none; }



#footer a:hover{

    color:#5fb1ea;

}



#footer .row-fluid .span4:nth-child(3){

    text-align:right;

}



#footer .span4 img {

    width: 33px;

}















/*****************************************************************************\

     $DETAILS

\*****************************************************************************/



.detail-wrapper .half-right{

    text-align: right;

}



.detail-wrapper .socials li{

    display: inline-block;

}







.detail-wrapper h3{

    margin-bottom: 15px;

}



.detail-wrapper .nps-background{

    color : #d9d9d9;

}



.detail-wrapper .nps-rate{

    color : #10708d;

}



.detail-wrapper .stars{

    margin-bottom: 15px;

    font-size: 14px;

}



.detail-wrapper .half-left{

    margin-bottom: 15px;

}



.detail-wrapper .side{

    width: 330px;

    height: 570px;

    background-color: #00B4FF;

    margin : 30px 30px 15px 0;

    font-size: 12px;

    color : white;

}





.side .picture{

    margin: 7px auto;

    width: 96%;

    height: 220px;

    background-color: white;

    background-repeat: no-repeat;

    background-position: center center;

    background-size: contain;

}



.side a{

    color:#ffffff;

    text-decoration: none;

}



.side .coordonnees{

    padding: 15px 25px 25px 25px;

    position: relative;

}



.side .horraire{

    padding: 0 25px 25px 25px;

}





.side .horraire h4, .side .is-open{

    margin-bottom: 20px;

}



.side .horraire table{

    width: 100%;

}



.side .horraire table th {

    font-weight: bold;

    text-align: left;

}



.horraire table td {

    text-align: right;

}



.side .open, .side .closed, .side .horraire h4{

    font-weight: bold;

}



.side .open{

    color:green;

}



.side .closed{

    color : red;

}



.side .day, .side .website, .side .phone, .side .mail, .side .address{

    margin-bottom: 5px;

}



.side .icon-home:before,.side .icon-phone:before,.side .icon-mail:before,.side .icon-location:before{

    position: absolute;

    left: 25px;

}



.side .icon-home,.side .icon-phone,.side .icon-mail,.side .icon-location{

    padding-left: 25px;

}



.detail-wrapper .main {

    min-height: 570px;

    margin-top: 30px;

    color: #646363;

    font-size: 12px;

    max-width: 550px;

    width: 100%;

}



.detail-wrapper .main .description{

    min-height: 330px;

    overflow: hidden;

}



.detail-wrapper .main .short-description{

    margin-bottom: 25px;

}



.detail-wrapper .main h5{

    font-size:14px;

    font-weight: bold;

    color: #00B4FF;

    margin: 30px 0 15px 0;

}



.detail-wrapper .main .widget{

    width: 100%;

    position: relative;

    height: 238px;

}



.widget .iframe {

    position: absolute;

    top: 30px;

    left: 0;

    height: 145px;

    max-width: 296px;

    width: 100%;



}



.widget .button{

    position: absolute;

    background-color: #00B4FF;

    color: #ffffff;

    font-size: 11px;

    text-align: center;

    text-decoration: none;

    border-radius: 5px;

    width: 170px;

    height: 42px;

    padding: 10px 15px;

    box-sizing: border-box;

    right: 48px;

}



.widget .button.consult{

    top: 60px;

}



.widget .button.comments{

    top: 112px

}



.map{

    width: 100%;

    height: 230px;

    background-color: darkgray;

}





    #icones{

        margin-top: -80px;

    }



    #form-wrapper {

        padding: 20px 60px 20px 75px;

    }



    #logo-mail {

        left: -46px;

        position: absolute;

        top: 45px;

    }



    #contact-txt p {

        margin-right: 30px;

    }



    #footer-wide{

        height:154px;

        position:fixed;

        bottom: 0;

        z-index: -99999;

    }



    #footer .span4{

        display: inline-block;

        width: 31%;

        min-width: 200px;

    }







    #copyright{

        float:left;

    }



    #phone{

        float:right;

    }



    #copyright .bloc, #phone .bloc {

        display:inline-block;

    }



    .bloc > img {

        margin-bottom: -8px;

    }



    .toggle-menu{

        display: none;

    }



.contact.on .overlay {

    background-color: rgba(0, 0, 0, 0.8);

    bottom: 0;

    left: 0;

    position: fixed;

    right: 0;

    top: 0;

}



.contact.on div.iframe{

    height: 310px;

    left: 50%;

    margin: auto;

    position: fixed;

    top: 50%;

    transform: translate(-50%, -50%);

    width: 580px;

}





.contact.on iframe {

    display: block;

    left: 50%;

    margin: auto;

    position: fixed;

    top: 50%;

    transform: translate(-50%, -50%);

    height: 310px;

    width: 580px;

}



.contact.on .close-iframe {

    color: red;

    font-weight: bold;

    position: absolute;

    right: 22px;

    top: 12px;

    z-index: 9999;

    cursor: pointer;

}



.contact.off .overlay, .contact.off iframe , .contact.off .close-iframe {

    display: none;

}



/*****************************************************************************\



    Media queries



\*****************************************************************************/







@media (max-width: 980px){



    .container{

        width: 100%;

    }



    .toggle-menu{

        display: block;

    }



    input.toggle-menu {

        border: 0;

        clip: rect(0 0 0 0);

        height: 1px;

        margin: -1px;

        overflow: hidden;

        padding: 0;

        position: absolute;

        width: 1px;

    }



    label.toggle-menu{

        float: right;

    }





    input.toggle-menu:checked ~ #nav{

        max-height: 1000px;

    }



    .menu {

        height: 59px;

        width: 59px;

        position: relative;

        margin: auto;

        padding-top: 20px;

        border: 5px solid transparent;

        -moz-border-radius: 100%;

        -webkit-border-radius: 100%;

        border-radius: 100%;

        -moz-transition: 0.3s;

        -o-transition: 0.3s;

        -webkit-transition: 0.3s;

        transition: 0.3s;

        cursor: pointer;

        box-sizing: border-box;

    }



    .bar {

        height: 5px;

        width: 49px;

        display: block;

        margin: 7px auto;

        position: relative;

        background-color: #fff;

        -moz-border-radius: 10px;

        -webkit-border-radius: 10px;

        border-radius: 10px;

        -moz-transition: 0.4s;

        -o-transition: 0.4s;

        -webkit-transition: 0.4s;

        transition: 0.4s;

    }



    .model-1 {

        background-color: #00B4FF;

        border-radius: 3px;

        margin: 2px;

    }

    .model-1 .bar {

        position: absolute;

    }

    .model-1 .bar:nth-of-type(1) {

        top: 0;

        -moz-transition: top 0.3s ease 0.3s, -moz-transform 0.3s ease-out 0.1s;

        -o-transition: top 0.3s ease 0.3s, -o-transform 0.3s ease-out 0.1s;

        -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease-out;

        -webkit-transition-delay: 0.3s, 0.1s;

        transition: top 0.3s ease 0.3s, transform 0.3s ease-out 0.1s;

        -moz-animation: mrotr 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

        -webkit-animation: mrotr 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

        animation: mrotr 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

    }

    .model-1 .bar:nth-of-type(2) {

        top: 15px;

        -moz-transition: ease 0.3s 0.3s;

        -o-transition: ease 0.3s 0.3s;

        -webkit-transition: ease 0.3s;

        -webkit-transition-delay: 0.3s;

        transition: ease 0.3s 0.3s;

        -moz-animation: fade 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

        -webkit-animation: fade 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

        animation: fade 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

    }

    .model-1 .bar:nth-of-type(3) {

        top: 30px;

        -moz-transition: top 0.3s ease 0.3s, -moz-transform 0.3s ease-out 0.1s;

        -o-transition: top 0.3s ease 0.3s, -o-transform 0.3s ease-out 0.1s;

        -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease-out;

        -webkit-transition-delay: 0.3s, 0.1s;

        transition: top 0.3s ease 0.3s, transform 0.3s ease-out 0.1s;

        -moz-animation: mrotl 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

        -webkit-animation: mrotl 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

        animation: mrotl 2s cubic-bezier(0.5, 0.2, 0.2, 1.01);

    }



    input.toggle-menu:checked ~ label .model-1 .menu .bar:nth-of-type(1) {

        top: 15px;

        -moz-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

        -webkit-transform: rotate(45deg);

        transform: rotate(45deg);

        -moz-transition: top 0.3s ease 0.1s, -moz-transform 0.3s ease-out 0.5s;

        -o-transition: top 0.3s ease 0.1s, -o-transform 0.3s ease-out 0.5s;

        -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease-out;

        -webkit-transition-delay: 0.1s, 0.5s;

        transition: top 0.3s ease 0.1s, transform 0.3s ease-out 0.5s;

    }

    input.toggle-menu:checked ~ label .model-1 .menu .bar:nth-of-type(2) {

        opacity: 0;

    }

    input.toggle-menu:checked ~ label .model-1 .menu .bar:nth-of-type(3) {

        top: 15px;

        -moz-transform: rotate(-45deg);

        -ms-transform: rotate(-45deg);

        -webkit-transform: rotate(-45deg);

        transform: rotate(-45deg);

        -moz-transition: top 0.3s ease 0.1s, -moz-transform 0.3s ease-out 0.5s;

        -o-transition: top 0.3s ease 0.1s, -o-transform 0.3s ease-out 0.5s;

        -webkit-transition: top 0.3s ease, -webkit-transform 0.3s ease-out;

        -webkit-transition-delay: 0.1s, 0.5s;

        transition: top 0.3s ease 0.1s, transform 0.3s ease-out 0.5s;

    }



    #inner-top-bar > a{

        display: block;

        margin: auto;

    }

    

    #nav{

        float: none;

        max-height: 0;

        clear: both;

        overflow: hidden;

        -moz-transition: max-height .5s ease 0s;

        -o-transition: max-height .5s ease 0s;

        -webkit-transition: max-height .5s ease;



    }



    #nav ul{

        display: block;

        margin: 10px 0 ;



    }



    #nav ul:last-child{

        display: block;

        margin-top: 10px;

    }



    #nav ul li,

    #nav ul:first-child li:last-child,

    #nav ul:first-child li {

        display: block;

        margin: 1px;

        border : none;

        padding: 0;

    }



    #nav ul li a{

        padding: 5px 10px;

        text-align: center;

        display: block;

        color:white;

        background-color: #00B4FF;

        border-radius: 2px;

    }



    .steps{

        text-align: center;

    }



    #container{

        margin-bottom: 0;

    }



    #logo, #phone-icone, #logo-footer{

        display:block;

        margin:auto;

    }

    form#search input#q_name, form#search input#q_location, form#search input[type="submit"] {

        width: 100%;

    }



    form#search input#q_location, form#search input[type="submit"] {

        margin-top: 10px;

    }



    .detail-wrapper .main .description,

    .detail-wrapper .main,

    .detail-wrapper .side{

        height: auto;

    }



    .detail-wrapper .side {

        width: 100%;

        margin: 0;

    }



    #copyright p, #phone p{

        text-align:center;

    }



    .step.arrow{

        display: none;

    }







    #footer-wide{

        position: relative;

    }



    #footer, #footer p{

        text-align: center;

    }



    #footer #footer-nav{

        display: none;

    }



    .detail-wrapper .main{

        max-width: 1000px;

    }





    .widget .iframe {

        margin: auto;

    }

}



