@import url(https://fonts.googleapis.com/css?family=Neuton:700,400&subset=latin,latin-ext);

@import url(https://fonts.googleapis.com/css?family=Bitter:400,400italic,700,latin-ext);

@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);



/* 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;

    box-sizing: border-box;

}

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

article, aside, details, figcaption, figure,

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

    display: block;

}

body {

    line-height: 1;

    font-family:"helvetica";

    margin:0;

}

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;

}



.clear{

    clear : both;

}



.container {

    margin: auto;

    max-width: 980px;

    min-width: 300px;

    width: 100%;

}



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

  $TOP_BAR

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



#top_bar{

    text-align: right;

    padding: 5px 0;

}



#top_bar li{

    display: inline-block;

    vertical-align: top;

    font-family: bitter;

    font-size: 15px;

    font-style: italic;

}



#top_bar li a{

    text-decoration: none;

}



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

  $HEADER

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



header{

    padding-bottom: 25px;

    width: 100%;

    overflow: hidden;

    position: relative;

}



header .banner-bg{

    position: absolute;

    top: 0;

    left: 0;

    height: 100%;

    width: 100%;

    z-index: -1;

    background-position: center;

    background-size: cover;

}



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

  $MAIN_NAV

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



nav.main-nav{

    border-bottom: 1px solid white;

}



nav.main-nav .inner-nav{

    border-left : 1px solid white;

    border-right : 1px solid white;

}



nav.main-nav .inner-nav > a{

    display: inline-block;

    vertical-align: bottom;

    margin: 5px;

}



nav.main-nav .inner-nav > ul{

    float: right;

}



nav.main-nav li{

    display: inline-block;

    padding-top: 30px;

    padding-right: 45px;

}



nav.main-nav li a{

    color: #fff;font-family: "Montserrat";

    font-size: 14px;

    text-decoration: none;

    text-transform: uppercase;

}



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

  $INNER HEADER

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



header h1{

    font-size: 60px;

    color: white;

    font-family: "Bitter";

    padding-top: 43px;

    font-style: italic;

}



#inner-header{

    position: relative;

}



header .title{

    width: 495px;

    display: inline-block;

    margin-top: 57px;

}



header .title > p{

    padding-top: 25px;

    font-size: 20px;

    font-style: italic;

    color: #fff;

}



header .title > p::before, header .title > p::after{

    content: '"';

}



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

  $LAST COMMENTS

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



.last-comments{

    width: 480px;

    height: 208px;

    background-color: rgba(255,255,255,.7);

    display: inline-block;

    vertical-align: top;

    margin-top: 57px;

    font-family: "Bitter";

    font-size: 14px;

}



.last-comment{

    padding: 30px 20px 22px;

    text-align: center;

    color: #005174;

    font-style: italic;

}



.last-comment span{

    display: inline-block;

    vertical-align: top;

}



.last-comment .comment, .last-comment .agency, .last-comment .more{

    display: block;

}



.last-comment .date, .last-comment .note, .last-comment .agency{

    font-family: "Montserrat";

}



.last-comment .comment::before, .last-comment .comment::after{

    content: '"';

}



.last-comment .date{

    padding-bottom: 18px;

}



.last-comment .comment{

    padding-bottom: 22px;

}



.last-comment .comment{

    padding-bottom: 11px;

}



.last-comment .agency{

    font-weight: bold;

    text-transform: uppercase;

    font-style: normal;

}



.last-comment .more a{

    font-size: 12px;

    color: #00b3ff;

}

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

  $SEARCH FORM

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



header form#search{

    display: block;

    padding: 15px 20px;

    background-color: rgba(00,179,255,.7);

    margin-top: 55px;

}



form#search h2{

    font-size: 14px;

    color: #fff3f3;

    text-transform: uppercase;

    margin-bottom: 10px;

}



form#search input{

    height: 40px;

    border: none;

    padding: 15px;

    box-sizing: border-box;

    vertical-align: top;

}



form#search.hasError input{

	border:1px solid red;

}



form#search input::-webkit-input-placeholder { /* WebKit, Blink, Edge */

    color:    #005174;

}

form#search input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

    color:    #005174;

    opacity:  1;

}

form#search input::-moz-placeholder { /* Mozilla Firefox 19+ */

    color:    #005174;

    opacity:  1;

}

form#search input:-ms-input-placeholder { /* Internet Explorer 10-11 */

    color:    #005174;

}

form#search input:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */

    color:    #005174;

}



form#search #q_name{

    width: 530px;

    border-right: 1px solid #eaeaea;

}



form#search #q_location{

    width: 254px;

}



form#search #search_submit{

    padding: 0;

    background-color: #005174;

    color: #fff;

    width: 155px;

}





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

  $USERS

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





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

  $REFLEXE

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



#reflexe {

    background-color: #eeeeee;

    padding: 65px 0;

}



#reflexe .box {

    width: 230px;

    height: 206px;

    padding: 35px 15px 15px 15px;

    box-sizing: border-box;

    display: inline-block;

    vertical-align: top;

    background-color: #fff;

    position: relative;

    text-align: center;

    margin-left: 15px;

}



#reflexe .box:first-child {

    margin: 0;

}



#reflexe .box img {

    position: absolute;

    left: 50%;

    top: -20px;

    margin-left: -20px;

}



#reflexe .box.title {

    color: #005174;

    font-size: 22px;

    font-style: italic;

    text-align: left;

}



#reflexe .spacer {

    height: 2px;

    width: 100px;

    background-color: #00b3ff;

    display: block;

    margin-top: 45px;

}



#reflexe .box .head {

    font-family: "Montserrat";

    font-size: 16px;

    color: #828282;

    display: block;

    margin-bottom: 33px;

}



#reflexe .box .txt {

    font-size: 14px;

    color: #828282;

    text-align: justify;

}





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

  $INTRO

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



#inner_intro{

    padding: 65px 0;

}



#intro img {

    height: 374px;

    width: 482px;

    display: inline-block;

    vertical-align: top;

}



#intro .texte {

    width: 490px;

    vertical-align: top;

    display: inline-block;

    padding-left: 20px;

    box-sizing: border-box;

}



#intro .texte .head {

    font-family: "bitter";

    color: #00b3ff;

    font-size: 18px;

    font-style: italic;

    padding-bottom: 35px;

}



#intro .texte .txt {

    font-family: Montseerat;

    font-size: 14px;

    color: #828282;

}



#intro span.spacer {

    height: 2px;

    width: 100px;

    background-color: #00b3ff;

    display: block;

    margin-bottom: 35px;

}





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

  $HOW_TO

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



#how_to {

    background-image: url('/site/home-user/background-steps.jpg');

    background-size: cover;

    background-position: center;

    padding: 45px 0;

}



#how_to .box {

    height: 206px;

    width: 230px;

    padding: 15px;

    display: inline-block;

    vertical-align: top;

    text-align: center;

    color: white;

    background-color: rgba(255, 255, 255, .12);

    margin-left: 15px;

}



#how_to .box.title {

    padding-top: 35px;

    text-align: left;

    font-size: 22px;

    font-style: italic;

    background-color: transparent;

    margin-left: 0;



}



#how_to .box.title .spacer{

    width: 100px;

    height: 3px;

    background-color: #00b3ff;

    margin-top: 45px;

}



#how_to .box img {

    display: block;

    margin: auto;

    margin-top: 23px;

    margin-bottom: 15px;

}



#how_to .box span{

    display: block;

}



#how_to .box .head {

    margin-bottom: 15px;

}



#how_to .box .txt {

    font-size: 13px;

    font-family: "Montserrat";

}





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

  $PRESS

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



#press{

    border-bottom: 1px solid #e4E4E4;

}



#press ul, #press .read-article {

    display: inline-block;

    vertical-align: middle;

}



#press .read-article {

    width: 230px;

}



#press ul{

    width: 740px;

    text-align: center;

}



#press li {

    margin: 40px 10px 45px 10px;

    display: inline-block;

    vertical-align: middle;

}



#press .read-article{

    font-family: bitter;

    font-style: italic;

    color: #005174;

}



#press .read-article .title{

    display: block;

    font-size: 22px;

}



#press .read-article .link{

    font-size: 14px;

}



#press .read-article .link a{

    color: #005174;

}



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

  $CLIENTS

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



#clients .slider img {

    height: 70px;

    margin: 0 10px;

}



#clients .title, #clients .slider {

    display: inline-block;

    vertical-align: middle;

}



#clients .title {

    width: 250px;

    color: #005174;

    font-size: 22px;

    font-style: italic;

    font-family: "bitter";

    padding-right: 20px;

}



#clients .slider {

    width: 720px;

    margin: 40px 0 45px 0;

}





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

  $FOOTER

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



footer {

    background-color: #00313f;

    padding: 35px;

    text-align: center;

    color: #fff;

    font-family: "Montserrat";

    font-size: 14px;

}



footer #inner_footer > div{

    display: inline-block;

    vertical-align: top;

    text-align: left;

    width: 31%;

}



footer a{

    color: #fff;

}



footer h3{

    padding-bottom: 35px;

    font-style: italic;

}



footer .infos table img {

    padding-right: 20px;

}



footer .infos a{

    text-decoration: none;

}



footer .contact img{

    display: none;

}



form#contact input::-webkit-input-placeholder { /* WebKit, Blink, Edge */

    color:    #fff;

}

form#contact input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

    color:    #fff;

    opacity:  1;

}

form#contact input::-moz-placeholder { /* Mozilla Firefox 19+ */

    color:    #fff;

    contact:  1;

}

form#contact input:-ms-input-placeholder { /* Internet Explorer 10-11 */

    color:    #fff;

}

form#contact input:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */

    color:    #fff;

}



footer .contact input {

    background: #004a5f none repeat scroll 0 0;

    border: 2px solid #004a5f;

    color: white;

    margin-bottom: 7px;

}



footer .contact input#name, footer .contact input#mail {

    width: 130px;

}



footer .contact input#agence, footer .contact input#msg, footer .contact input#soft-autre {

    width: 270px;

}



footer .contact input#soft, footer .contact input#msg {

    margin-bottom: 7px;

}



footer .contact select#subject, footer .contact select#soft {

    background: #004a5f none repeat scroll 0 0;

    border: 2px solid #004a5f;

    color: white;

    width: 276px;

    margin-bottom: 7px;

}



footer .about {

    height: 217px;

    position: relative;

}



footer .copyright {

    position: absolute;

    bottom: 0;

}



footer .cgu {

    position: absolute;

    bottom: 25px;

}



#soft-autre, #newsletter-label {

    display: none;

}



#openModal{ display: none}

