/*************************************************************************
 _____   _____   _   __   _   _____        _          __  _____   _____  
|  _  \ /  _  \ | | |  \ | | |_   _|      | |        / / | ____| |  _  \ 
| |_| | | | | | | | |   \| |   | |        | |  __   / /  | |__   | |_| | 
|  ___/ | | | | | | | |\   |   | |        | | /  | / /   |  __|  |  _  { 
| |     | |_| | | | | | \  |   | |        | |/   |/ /    | |___  | |_| | 
|_|     \_____/ |_| |_|  \_|   |_|        |___/|___/     |_____| |_____/ 

**************************************************************************

    @ Copyright © 2018 POINT WEB
    @ Catégorie : Structure site
    @ Site : avogadro-automobiles.fr
    @ Auteur : SERCO POINTWEB - Nicow / www.point-web.fr

**************************************************************************/

/************* GENERAL **************/
    
    *,*:after,*:before{list-style-position:inside;list-style-type:none;color:inherit;box-sizing:border-box;margin:0;padding:0;outline:none;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
    *:after,*:before{display:inline-block;z-index:1;}
    html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
    form,fieldset,input,textarea,p,blockquote,th,td,p,figure,figcaption,button{font-size:inherit;color:inherit;background:transparent;}
    section,article,header,footer,nav,aside{display:block;}
    table,td,blockquote,code,pre,textarea,input,video{max-width:100%;}
    p,dd,ul{word-wrap:break-word;-webkit-hyphens:none;-ms-hyphens:none;-o-hyphens:none;hyphens:none;}
    input,textarea,button{resize:none;border:0;-webkit-appearance:none;-webkit-border-radius:0;font-family:inherit;}
    img{border:none;max-width:100%;height:auto;}
    strong{font-weight:500;}
    a,a:hover,button,button:hover{cursor:pointer;color:inherit;text-decoration:none;transition:.2s;}
    a,a:hover,a:active,a:focus,button,button:hover,button:focus,button:active{text-decoration:none;outline:none;box-shadow:0 0 0!important;}
    img{user-select:none;}
    .clear{clear:both;background:none;outline:none;border:none;height:1px;margin:0;}
    .separator{display:block;width:100%;height:1px;background:#d0d0d0;margin:10px auto;}
    .slick-slide{height:100%;overflow:hidden;text-align:center;float:left;height:100%;min-height:1px;}
    .slick-slider{overflow:hidden;display:block;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;touch-action:pan-y;-webkit-tap-highlight-color:transparent;}
    [data-link]{cursor:pointer;}
    
    /* @fonts */
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-Book.eot');src:url('../../fonts/gotham/Gotham-Book.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-Book.woff2') format('woff2'),url('../../fonts/gotham/Gotham-Book.woff') format('woff'),url('../../fonts/gotham/Gotham-Book.ttf') format('truetype');font-weight:normal;font-style:normal;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-Light.eot');src:url('../../fonts/gotham/Gotham-Light.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-Light.woff2') format('woff2'),url('../../fonts/gotham/Gotham-Light.woff') format('woff'),url('../../fonts/gotham/Gotham-Light.ttf') format('truetype');font-weight:300;font-style:normal;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-BoldItalic.eot');src:url('../../fonts/gotham/Gotham-BoldItalic.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-BoldItalic.woff2') format('woff2'),url('../../fonts/gotham/Gotham-BoldItalic.woff') format('woff'),url('../../fonts/gotham/Gotham-BoldItalic.ttf') format('truetype');font-weight:bold;font-style:italic;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-Bold.eot');src:url('../../fonts/gotham/Gotham-Bold.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-Bold.woff2') format('woff2'),url('../../fonts/gotham/Gotham-Bold.woff') format('woff'),url('../../fonts/gotham/Gotham-Bold.ttf') format('truetype');font-weight:bold;font-style:normal;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-LightItalic.eot');src:url('../../fonts/gotham/Gotham-LightItalic.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-LightItalic.woff2') format('woff2'),url('../../fonts/gotham/Gotham-LightItalic.woff') format('woff'),url('../../fonts/gotham/Gotham-LightItalic.ttf') format('truetype');font-weight:300;font-style:italic;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-BookItalic.eot');src:url('../../fonts/gotham/Gotham-BookItalic.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-BookItalic.woff2') format('woff2'),url('../../fonts/gotham/Gotham-BookItalic.woff') format('woff'),url('../../fonts/gotham/Gotham-BookItalic.ttf') format('truetype');font-weight:normal;font-style:italic;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-Medium.eot');src:url('../../fonts/gotham/Gotham-Medium.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-Medium.woff2') format('woff2'),url('../../fonts/gotham/Gotham-Medium.woff') format('woff'),url('../../fonts/gotham/Gotham-Medium.ttf') format('truetype');font-weight:500;font-style:normal;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-Thin.eot');src:url('../../fonts/gotham/Gotham-Thin.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-Thin.woff2') format('woff2'),url('../../fonts/gotham/Gotham-Thin.woff') format('woff'),url('../../fonts/gotham/Gotham-Thin.ttf') format('truetype');font-weight:100;font-style:normal;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-Black.eot');src:url('../../fonts/gotham/Gotham-Black.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-Black.woff2') format('woff2'),url('../../fonts/gotham/Gotham-Black.woff') format('woff'),url('../../fonts/gotham/Gotham-Black.ttf') format('truetype');font-weight:500;font-style:normal;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-ThinItalic.eot');src:url('../../fonts/gotham/Gotham-ThinItalic.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-ThinItalic.woff2') format('woff2'),url('../../fonts/gotham/Gotham-ThinItalic.woff') format('woff'),url('../../fonts/gotham/Gotham-ThinItalic.ttf') format('truetype');font-weight:100;font-style:italic;}
        @font-face{font-family:'Gotham';src:url('../../fonts/gotham/Gotham-UltraItalic.eot');src:url('../../fonts/gotham/Gotham-UltraItalic.eot?#iefix') format('embedded-opentype'),url('../../fonts/gotham/Gotham-UltraItalic.woff2') format('woff2'),url('../../fonts/gotham/Gotham-UltraItalic.woff') format('woff'),url('../../fonts/gotham/Gotham-UltraItalic.ttf') format('truetype');font-weight:500;font-style:italic;}
    
    /* selection styling */
        *::-moz-selection{background:rgba(2,118,249,.85);color:#fff;}
        *::selection{background:rgba(2,118,249,.85);color:#fff;}

    /* selection placeholder */
        ::-webkit-input-placeholder{opacity:.75!important;color:inherit;}
        ::-moz-placeholder{opacity:.75!important;color:inherit;}
        ::-ms-input-placeholder{opacity:.75!important;color:inherit;}


/*----------------------------------------------------< PRESET APP >---------------------------------------------------*/
    
    html{overflow:hidden;width:100vw;height:100vh;background:#161f36;}
    body{overflow:hidden;width:100%;height:100%;background:inherit;font-family:'Gotham', Helvetica, Arial, sans-serif;}

    .container{width:1260px!important;max-width:100%;padding:0 30px;}
    
    .fivestar{position:absolute;left:25px;top:30px;z-index:10000;}

    /* loader */
        main{background:#fff;}
        main:after{background:url(../../img/bottom-main.jpg) center center;content:'';width:100%;height:100px;margin-bottom:-8px;}

    /* loader */
        .loader{transition:1s;position:absolute;top:50%;left:50%;z-index:9999;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);width:200px;height:200px;}
        .load .loader{opacity:0;}
        .loader:after, .loader:before{content:'';box-sizing:content-box;position:absolute;border:4px solid #0276f9;;opacity:1;border-radius:50%;-webkit-animation:loader 1.5s cubic-bezier(0,0.2,0.8,1) infinite;animation:loader 1.5s cubic-bezier(0,0.2,0.8,1) infinite;}
        .loader:before{-webkit-animation-delay:-0.75s;animation-delay:-0.75s;}
    
    /* cookies */
        #cookiesdirective{-webkit-transform:translateY(100%)!important;transform:translateY(100%)!important;z-index:24000!important;transition:.8s!important;opacity:0!important;max-width:calc(100% - 30px);border-radius:2px;color:#14120b!important;line-height:18px!important;padding:10px 25px!important;font-size:11px!important;font-family:inherit!important;background:#daac52!important;box-shadow:0 3px 35px rgba(0,0,0,.15)!important;width:500px!important;bottom:15px!important;left:15px!important;}
        .load #cookiesdirective{-webkit-transform:translateY(0)!important;transform:translateY(0)!important;opacity:1!important;}
        #cookiesdirective > div{width:100%!important;}
        #cookiesdirective br{display:none;}
        #cookiesdirective a{font-family:inherit!important;line-height:auto!important;font-size:inherit!important;color:#14120b!important;font-weight:900!important;}
        #cookiesdirective a:hover{color:#fff!important;}
        #cookiesdirective input{color:#0276f9;border-radius:2px;transition:.3s;cursor:pointer;background:rgba(0,0,0,.3);font-family:Arial;font-weight:900;position:absolute;top:-3px;right:-18px;width:16px;height:16px;font-size:10px;line-height:15px;}
        #cookiesdirective input:hover{border-radius:50%;-webkit-transform:rotate(180deg);transform:rotate(180deg);background:#fff;color:#0276f9;}
    
    /* btn */
        .btn{transition:0!important;border:0;font-size:12px;text-transform:uppercase;line-height:13px;padding:15px 25px;border-radius:25px;overflow:hidden;color:#fff;background:linear-gradient(to right, #0276f9, #234c92);}
        .btn:hover{color:#fff;background:linear-gradient(to right, #0276f9, #0276f9);}
        .btn:focus{background:#0276f9;}
        .btn span{margin-left:3px;font-size:90%;}

    /* h$ / paragraphe */
        .sub{font-size:13px;text-transform:uppercase;font-weight:400;color:#999999;}
        .h1{color:#0276f9;}     
        .h2{color:#161f36;font-size:26px;font-weight:500;line-height:27px;margin:25px 0;}
        .paragraphe{color:#5b677a;font-size:13px;line-height:27px;margin:10px 0;}
        .paragraphe p{line-height:27px;margin:10px 0;}
        .paragraphe ul li{padding-left:18px;line-height:17px;margin:10px 0;}
        .paragraphe ul:not(.np) li:before{color:#0276f9;font-size:12px;left:0;position:absolute;content:"\f0a9";font-family:"Font Awesome 5 Pro";font-weight:lighter;}
        .paragraphe ul.np li{padding-left:0;}

    /* default */
        .default-page{padding-bottom:35px;}
        .default-page:before{z-index:1;position:absolute;content:'';background:url(../../img/motif.png) repeat center center;height:100%;width:calc(50vw - 670px);left:0;top:0;position:absolute;}
        .default-page .top{z-index:5;height:80px;background:url(../../img/top_bg.jpg) no-repeat center center;background-size:cover;}
        .default-page .top:after,
        .default-page .top:before{width:100%;height:100%;content:'';top:0;left:0;position:absolute;background:url(../../img/top_after.png) no-repeat center center;background-size:100% 100%;}

    /* alert */
        .alert{font-size:12px;color:#f9f7f5;border-radius:2px;border:0;}
            .alert-success{background:#86c361;}
            .alert-danger{background:#c36161;}
            .alert-warning{background:#d39465;}
            .alert-info{background:#65a3d3;}
        .alert::first-letter{text-transform:uppercase;}
        .alert button{text-shadow:0 0 0;font-size:14px;height:100%;}
   
    /* recaptcha styling */  
        .captcha{height:40px;color:#5b677a;display:inline-block;margin:5px 0 10px;}
        .captcha .g-recaptcha{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);transition:.4s;z-index:9999;cursor:pointer!important;margin-right:8px;float:left;border:3px solid #5b677a;cursor:pointer;overflow:hidden;width:29px;height:29px;border-radius:50%;}
        .captcha .g-recaptcha:hover{border-color:#0276f9;}
        .captcha .g-recaptcha > div{cursor:pointer!important;width:500px!important;margin-top:-25px;margin-left:-15px;position:static;}
        .captcha .no-robot{font-weight:500;float:left;font-size:13px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
        .captcha .no-robot .liens{font-size:9px;font-weight:normal;}
        .captcha .no-robot .liens a:hover{color:#0276f9;}
    
    /* share */
        .share{color:#5b677a;border-top:1px solid #eee;width:100%;padding-top:15px;margin-top:10px;}
        .share:not(.nb):before{font-size:14px;content:'Partager cette actualité :';}
        .share li{color:#161f36;display:inline-block;font-size:18px;margin-left:5px;}
        .share li a:hover{color:#0276f9;}


/*----------------------------------------------------< APP >---------------------------------------------------*/
  
/************* APP **************/

    #app{filter:blur(2px);transition:1s;opacity:0;background:#161f36;width:100%;height:100%;overflow:hidden!important;padding-right:4px!important;}
    .load #app{opacity:1;filter:blur(0px);}
    .openNav #app:after,
    .openNav #app .app-scrollbar{display:none!important;}
    #app .app-scrollbar{opacity:0!important;background:#000;border-radius:15px;cursor:pointer;position:absolute;z-index:999999999999;left:100vw;margin-top:-5px;-webkit-transform:translateX(-100%);transform:translateX(-100%);height:30px;width:5px;}
    #app:hover .app-scrollbar{opacity:.7!important;}
    #app .app-scrollbar:hover{background:#0276f9;opacity:1!important;}
    #app .app-content{height:100vh;width:calc(100vw + 50px);overflow-y:scroll;overflow-x:hidden;box-sizing:initial;}
    .openNav #app .app-content{overflow-y:hidden;}
    #app .app-content > div{padding-top:50px;width:100vw;overflow:hidden;}


/************* header **************/
    
    #header{top:0;position:absolute;width:100%;z-index:999999999998;font-size:12px;line-height:12px;}
    #header .top{color:#fff;padding:19px 0;height:50px;}
    #header .top p{float:left;}
    #header .top span{top:1px;margin-right:3px;color:#5393ff;}
    #header .top .right{float:right;}
    #header .top .right a{margin-left:10px;}
    #header .top .right a:hover{color:#0276f9;}
    #header .top .right a i{font-size:9px;}
        

/************* nav **************/

    #nav{text-transform:uppercase;transition:.5s;background:rgba(16,22,38,.35);box-shadow:0 1px 0 rgba(255,255,255,.03);width:100%;height:80px;}
    .fix #nav{position:fixed;top:0;height:60px;background:rgba(16,22,38,1);}
    
    #logo{transition:.5s;width:270px;float:left;height:100%;display:block;max-width:calc(100% - 920px);}
    #logo img{top:50%;transform:translateY(-50%);}

    #nav .container{height:100%;}
    #nav nav{float:right;height:100%;}
    #nav nav ul{text-shadow:0 1px 1px rgba(0,0,0,.3);height:100%;}
    #nav nav li{transition:.5s;float:left;height:100%;}
    #nav nav li:after{opacity:0;transition:.5s;content:'';left:50%;transform:translate(-50%, 100%);bottom:0;position:absolute;width:0;height:0;border-left:20px solid transparent;border-right:20px solid transparent;border-top:0 solid #0e67d5;}
    #nav nav li.active:after,
    #nav nav li:hover:after{opacity:1;border-width:7px;}
    #nav nav li.active, #nav nav li:hover{background:#0177fc;box-shadow:0 0 30px #0e67d5 inset, 0 0 50px #0e67d5 inset, 0 0 10px #0e67d5 inset;}
    #nav nav a{overflow:hidden;display:block;height:100%;padding:0 13px;color:#fff;}
    #nav nav a span{display:block;top:50%;transform:translateY(-50%);}

    #nav .nav{z-index:9999;display:none;width:30px;height:20px;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:25px;}
    #nav .nav span{transition:.3s ease-out;width:100%;border-radius:5px;height:2px;background:#fff;display:inline-block;position:absolute;right:0;z-index:5000;}
    .openNav #nav .nav span,
    #nav .nav:hover span{background:#fff;}
        #nav .nav span:nth-child(1){top:0;}
        #nav .nav span:nth-child(2){top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
        #nav .nav span:nth-child(3){bottom:0;}
        .openNav #nav .nav span:nth-child(2){width:0;}
        .openNav #nav .nav span:nth-child(1){height:2.5px;right:25px;top:1px;-webkit-transform:rotate(-135deg);transform:rotate(-135deg);-webkit-transform-origin:top right;transform-origin:top right;}
        .openNav #nav .nav span:nth-child(3){height:2.5px;right:-6px;bottom:-2px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:bottom left;transform-origin:bottom left;}


/************* home **************/

    #home .top{height:535px;background:url(../../img/top_bg.jpg) no-repeat center center;background-size:cover;}
    #home .top:after{width:100%;height:100%;content:'';top:0;left:0;position:absolute;background:url(../../img/top_after.png) no-repeat center center;background-size:100% 100%;}
    #home .top span{opacity:.7;text-align:center;color:#fff;z-index:50;text-align:center;width:1px;text-align:center;position:absolute;white-space:nowrap;top:50%;display:inline-block;}
    #home .top span:before{text-transform:uppercase;font-size:11px;letter-spacing:4px;content:attr(data-content);left:50%;transform:translateX(-50%);}
        #home .top span:nth-child(1){transform:rotate(-90deg);left:40px;}
        #home .top span:nth-child(2){transform:rotate(90deg);right:40px;}
    #home .top .container{top:calc(100% - 30px);transform:translateY(-100%);z-index:10;}
    #home .top .container img{margin-right:10px;}
    
    .home-content{clear:both;}
    .home-content > div:after{background:url(../../img/photo-home-1.jpg) no-repeat center center;background-size:cover;position:absolute;content:'';height:100%;width:calc(50vw - 100px);right:0;top:0;position:absolute;}
    .home-content > div:before{position:absolute;content:'';background:url(../../img/motif.png) repeat center center;height:100%;width:calc(50vw - 625px);left:0;top:0;position:absolute;}
    .home-content > div:nth-child(2):before{left:auto;right:0;}
    .home-content > div:nth-child(2):after{left:0;right:auto;background-image:url(../../img/photo-home-2.jpg);}
    .home-content .col-7{padding:85px;}


/************* gamme **************/

    #gamme{height:300px;}
    #gamme > div{overflow:hidden;float:left;min-height:300px;max-height:400px;width:50%;}
    #gamme > div > div{transition:.5s;width:100%;height:100%;position:absolute;background-position:center center;background-size:cover;}
    #gamme > div:hover > div{transform:scale(1.1);}
    #gamme img{width:100%;}
    #gamme a{transition:.4s;font-size:25px;line-height:22px;text-transform:uppercase;color:#fff;font-weight:bold;display:block;background:red;position:absolute;bottom:0;width:100%;padding:30px 35px;bottom:0;z-index:10;}
    #gamme a:before{transition:.4s;font-size:28px;opacity:0;position:absolute;top:50%;transform:translateY(-50%);font-family:"Font Awesome 5 Pro";font-weight:300;}
    #gamme > div:hover a:before{opacity:1;}
        #gamme > div:nth-child(1) a:before{right:20px;content:"\f054";}
        #gamme > div:nth-child(2) a:before{left:20px;content:"\f053";}
    #gamme a small{font-size:15px;display:block;font-weight:300;}
        #gamme > div:nth-child(1) a{background:rgba(16,16,16,.8);text-align:right;}
        #gamme > div:nth-child(1):hover a{padding-right:55px;}
        #gamme > div:nth-child(2) a{background:rgba(35,76,146,.8);}
        #gamme > div:nth-child(2):hover a{padding-left:55px;}


/************* breadcrumb **************/

    #bc{z-index:4;text-shadow:0 1px 1px rgba(0,0,0,.3);overflow:hidden;clear:both;height:41px;text-transform:uppercase;font-size:10px;background:#3d485b;color:rgba(255,255,255,.8);}
    .default-page #bc{margin-bottom:40px;}
    #bc ol{height:100%;}
    #bc li{z-index:10;float:left;height:100%;margin-right:20px;}
    #bc li:hover{z-index:5;}
    #bc li:first-child{font-size:14px;}
    #bc li:before{content:'';position:absolute;z-index:1;right:0;display:block;width:100%;height:100%;background:linear-gradient(to left, #5b677a, #3d485b);}
    #bc li:first-child:before{width:200px;}
    #bc a{transition:0s;padding:0 10px 0 25px;margin-left:-20px;z-index:2;display:block;height:100%;line-height:40px;}
    #bc li:first-child a{padding-left:15px;}
    #bc a:hover{background:#7e8a9c;color:#fff;}
    #bc a:after{transition:0s;position:absolute;right:0;transform:translateX(100%);top:0;display:block;content:'';height:0;border-top:20px solid transparent;border-bottom:20px solid transparent;border-left:10px solid #5b677a;}
    #bc a:hover:after{border-left:10px solid #7e8a9c;}
      

/************* newsletter **************/
    
    #nl{font-size:16px;line-height:25px;text-align:center;padding:60px 0;text-shadow:0 1px 1px rgba(0,0,0,.4);color:#fff;background:url(../../img/bg_newsletter.jpg) no-repeat center center;background-size:cover;}
    #nl .title{margin-bottom:15px;font-weight:bold;text-transform:uppercase;font-size:18px;}
    #nl p{width:530px;max-width:100%;margin:auto;}
    #nl form{margin:20px auto 0;width:370px;max-width:100%;padding-top:0;}
    #nl input{padding:0 60px 0 20px;text-shadow:0 1px 1px rgba(0,0,0,.4);width:100%;height:55px;font-size:14px;border:3px solid #fff;border-radius:30px;}
    #nl button{width:42px;height:42px;position:absolute;background:#fff;color:#1261c6;border-radius:50%;right:7px;top:50%;transform:translateY(-50%);}
    #nl button:hover{transform:translateY(-50%) rotate(30deg);right:0;height:55px;width:55px;font-size:20px;}
      

/************* services **************/
    
    #services{border-top:1px solid #f4f4f4;background:#f9f9f9;padding:20px 0 50px;text-align:center;}
    #services .icon{display:block;font-size:110px;color:#182138;margin-top:20px;}
    #services h3{margin:0 0 15px;text-transform:uppercase;color:#234c92;font-weight:bold;line-height:15px;}
    #services p{color:#161f36;font-size:13px;line-height:18px;margin-bottom:15px;}
    #services .col-3{padding:0 2%;}

        
/************* footer **************/
   
    #footer{color:#fff;font-size:12px;padding:50px 0 20px;}
    #footer .container > div{float:left;}
    #footer a:hover{color:#0177fc;}
    #footer h5{text-transform:uppercase;font-size:17px;margin-bottom:15px;font-weight:500;}
    #footer .logos{width:70px;margin-top:20px;}
    #footer h4{margin-bottom:5px;border-bottom:1px solid rgba(255,255,255,.05);margin:-15px 0 15px;padding:15px 0;font-weight:300;font-size:14px;text-transform:uppercase;color:#0177fc;}
    #footer h4 strong{display:block;color:#fff;}
    #footer h4 span{color:#0177fc;font-size:30px;transform:translate(-150%, -50%);position:absolute;top:50%;}
    #footer .copyright{width:340px;}
    #footer .horaire{width:230px;margin-right:85px;}
    #footer .horaire p{font-size:14px;margin-bottom:5px;}
    #footer .coordonnees{width:230px;margin-right:85px;}
    #footer .list{float:left;width:calc(100% - 970px);font-size:11px;}
    #footer .list li{line-height:10px;margin-bottom:5px;}
    #footer .list li:before{position:absolute;left:-17px;color:#0177fc;content:'\f061';font-family:'Font Awesome 5 Pro';margin-right:8px;font-weight:lighter;}
    #footer address{line-height:25px;padding-left:18px;font-size:13px;}
    #footer address span{left:-18px;margin-right:-13px;color:#0177fc;}
    #footer address .ad{line-height:14px;margin-bottom:5px;}


/************* form **************/ 
    
    form{padding-top:15px;width:500px;max-width:100%;}
    #essai form{width:100%;}
    .form-group span{position:absolute;transition:.5s;color:#5b677a;z-index:100;font-size:16px;left:18px;top:19px;width:20px;text-align:center;}
    .form-group.focus span{color:#0177fc;}
    .form-group .form-control{transition:.5s;color:#5b677a;border-radius:2px;height:55px;border:1px solid #ddd;box-shadow:0 0 1px rgba(0,0,0,.5) inset;background:#fff;padding:20px 23px 20px 50px;line-height:18px;font-size:12px;}
    .form-group .form-control:focus{border-color:#0177fc;color:#0177fc;}
    .form-group textarea.form-control{height:200px;padding-top:17px;}
    #essai .form-group textarea{margin-top:25px;}
    .form-group:after{transition:1s;opacity:0;position:absolute;right:7px;top:6px;font-size:10px;font-family:"Font Awesome 5 Pro";font-weight:lighter;}
    .form-group.valid:after{content:"\f058";color:#86c361;opacity:1;}
    .form-group.invalid:after{content:"\f057";color:#c36161;opacity:1;}
    .form-group.required:before{content:"*";transition:.4s;position:absolute;color:#0177fc;left:10px;top:4px;font-size:18px;}
    .form-group.focus.required:before{color:#c36161;}
    .form-group .form-select{overflow:hidden;transition:.5s;color:#5b677a;border-radius:2px;height:55px;border:1px solid #ddd;box-shadow:0 0 1px rgba(0,0,0,.5) inset;background:#fff;line-height:18px;font-size:12px;}
    .form-group .form-select:after{content:"\f329";font-family:"Font Awesome 5 Pro";font-weight:lighter;text-align:center;position:absolute;z-index:100;right:0;width:35px;line-height:53px;background:#fff;height:100%;}
    .form-group .form-select:hover{border-color:#0177fc;color:#0177fc;}
    .form-group .form-select select{appearance:none;padding:0 50px 0 15px;z-index:150;width:calc(100% + 30px);border:0;top:0;height:100%;background:transparent;}
    .form-group .label{height:25px;color:#5b677a;font-size:13px;}
    .form-group .label span{position:relative;left:0;top:0;transform:0;font-size:90%;}
    .form-group.mul{height:80px;}
    .form-group.mul .form-group-select{height:55px;}    
    .form-group.mul .form-select{float:left;}
        .form-group.date .form-select:nth-child(1){width:calc(25% - 10px);}
        .form-group.date .form-select:nth-child(2){width:calc(50% - 10px);margin:0 15px;}
        .form-group.date .form-select:nth-child(3){width:calc(25% - 10px);}
        .form-group.vehicule .form-select:nth-child(1){width:calc(50% - 7px);margin-right:15px;}
        .form-group.vehicule .form-select:nth-child(2){width:calc(50% - 8px);}


/************* contact **************/ 
    
    #contact .map{overflow:hidden;width:100%;height:400px;box-shadow:0 3px 35px rgba(0,0,0,.05);}
    #contact .map #map{width:2000px;height:100%;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);}
    #contact .coor{z-index:100;background:#0177fc;padding:35px 35px 20px;}
    #contact .coor li{color:#fff;padding-left:25px;margin-bottom:15px;font-weight:bold;font-size:17px;}
    #contact .coor li > div.fal{position:absolute;left:0;top:7px;font-size:15px;}


/************* galerie **************/ 
    
    .galerie{margin-top:20px;}
    .galerie img{border-radius:3px;}
    .galerie .slick-arrow{display:none!important;}
    .galerie .slick-dots{display:inline-block;left:50%;transform:translateX(-50%);margin-top:15px;}
    .galerie .slick-dots li{transition:.2s;transform:scale(.7);border-radius:50%;cursor:pointer;display:inline-block;text-indent:-9999px;width:15px;margin:0 2px;height:15px;background:#5b677a;opacity:.5;}
    .galerie .slick-dots li:hover{opacity:1;}
    .galerie .slick-dots li.slick-active{opacity:1;background:#0177fc;transform:scale(1);}


/************* step **************/ 
    
    .step{overflow:hidden;width:100%;margin:0 0 25px;box-shadow:0 0 2px rgba(0,0,0,.3) inset;border-radius:30px;}
    .step li{padding-left:40px;counter-increment:numb;border-right:1px solid #ddd;float:left;width:33.333%;}
    .step li:before{color:#0177fc;content:counter(numb);position:absolute;left:10px;width:30px;height:30px;border-radius:50%;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.05);font-weight:500;font-size:13px;border:1px solid rgba(0,0,0,.15);line-height:27px;}
    .step li.active{border-color:#0177fc;box-shadow:0 0 2px rgba(0,0,0,.3) inset;background:#0177fc;color:#fff;font-weight:500;}
    .step li.active:before{color:#fff;}
    .step li{text-transform:uppercase;display:block;height:50px;line-height:50px;font-size:11px;text-align:center;}


 /************* forfait **************/ 
    
    .forfaits{display:flex;flex-flow:row wrap;width:calc(100% + 20px);left:-10px;}
    .forfaits li{color:#fff;padding:5px 10px 15px;width:20%;}
    .forfaits li a{height:100%;background:#5b677a;text-align:center;border-radius:5px;display:block;padding:30px;}
    .forfaits li a:hover{background:#0177fc;}
    .forfaits li .file{font-size:65px;}
    .forfaits li .name{z-index:150;font-size:15px;font-weight:500;margin-top:15px;line-height:14px;}
    .forfaits li .name small{display:block;font-weight:400;margin-top:2px;}
    .forfaits li .dl{transition:.5s;opacity:0;z-index:100;top:80px;position:absolute;margin-left:23px;left:50%;transform:translateX(-50%);font-size:16px;background:linear-gradient(to top, #0276f9 20%, #234c92);width:40px;height:40px;line-height:40px;border-radius:50%;}
    .forfaits li a:hover .dl{top:69px;opacity:1;}


/************* article **************/ 
    
    #article article > div{border-radius:5px;background:#161f36;height:250px;overflow:hidden;margin-top:25px;}
    #article article .illu{opacity:.6;z-index:100;width:100%;height:100%;transition:.5s;background-position:center center;background-size:cover;}
    #article article > div:hover .illu{opacity:.15;transform:scale(1.05);}
    #article article .illu img{position:absolute;opacity:0;}
    #article article .title{font-weight:500;line-height:22px;font-size:22px;color:#fff;text-align:center;position:absolute;z-index:200;top:50%;left:50%;transform:translate(-50%, -50%);}
    #article article time{transition:.5s;display:block;margin:auto;font-size:14px;font-weight:400;margin-top:5px;}
    #article article > div:hover time{color:#0177fc;}


/************* article show **************/ 
    
    #article-show .illu{margin-bottom:20px;z-index:500;margin-top:-40px;background-size:cover;background-position:center center;height:180px;}
    #article-show .illu:before{content:'';width:100%;height:100%;background:#161f36;position:absolute;opacity:.7;}
    #article-show .illu .container{z-index:600;color:#fff;top:50%;transform:translateY(-50%);}
    #article-show .illu .container .sub{color:#fff;}
    #article-show .illu .container .h1{color:#fff;}


/************* vehicule **************/ 
    
    #vehicule .cars{display:flex;flex-flow:row wrap;width:calc(100% + 20px);left:-10px;margin-top:20px;}
    #vehicule .cars li{color:#182138;width:25%;padding:10px;}
    #vehicule .cars img{border-radius:5px;}
    #vehicule .cars .infos{padding:10px 5px;font-size:14px;}
    #vehicule .cars .price{font-size:13px;}
    #vehicule .cars .right{color:#5b677a;text-align:right;position:absolute;right:0;top:0;padding:10px 5px;font-size:11px;}
    #vehicule .cars .right span{font-size:80%;margin-left:3px;}
    #vehicule .cars a{color:#fff;text-align:center;display:block;transition:.5s;opacity:0;z-index:100;top:10px;position:absolute;left:20px;font-size:16px;background:linear-gradient(to top, #0276f9 20%, #234c92);width:40px;height:40px;line-height:40px;border-radius:50%;}
    #vehicule .cars :hover a{top:0;opacity:1;}
    #vehicule .essai{transition:.4s;margin-top:30px;background:#182138;color:#fff;height:300px;}
    #vehicule .essai:hover{background:#0177fc;}
    #vehicule .essai img{width:300px;float:left;}
    #vehicule .essai a{transition:.4s;display:block;font-size:20px;color:#0177fc;padding:0 30px;line-height:21px;float:left;top:50%;transform:translateY(-50%);width:calc(100% - 300px);text-align:center;}
    #vehicule .essai:hover a{color:#fff!important;}
    #vehicule .essai a h3{transition:.4s;color:#fff;font-size:35px;line-height:35px;}
    #vehicule .prix{position:absolute;top:-15px;right:15px;border-radius:5px;background:#0177fc;color:#fff;display:inline-block;font-weight:bold;padding:3px 10px;}

  
/*----------------------------------------------------< MEDIA QUERIES >---------------------------------------------------*/
    
/************* max 1250 **************/  @media screen and (max-width:1250px){
    
    .home-content > div:after{width:41.6666%;}

}     
/************* max 1180 **************/  @media screen and (max-width:1180px){
    
    #nav nav a{padding:0 10px;font-size:11px;}
    #logo{max-width:calc(100% - 800px);}

}   
/************* max 1110 **************/ @media screen and (max-width:1110px){
  
    #footer .list{display:none;}
    #footer .copyright{width:300px;margin-right:0px;}
    #footer .container > .horaire{position:absolute;left:52%;transform:translateX(-50%);}
    #footer .container > .coordonnees{float:right;margin-right:0;}
  
}  
/************* max 1050 **************/  @media screen and (max-width:1050px){
    
    #nav nav a{padding:0 8px;font-size:10px;}
    #logo{max-width:calc(100% - 700px);}

    #services .col-3{flex:0 0 50%;max-width:50%;padding:0 50px;}

    .home-content .col-7{padding:50px;}

}   
/************* max 992 **************/ @media screen and (max-width:992px){

    #contact form{margin-bottom:30px;width:100%;}

}
/************* max 950 **************/  @media screen and (max-width:950px){
    
    #nav{height:70px;}
    #logo{max-width:calc(100% - 50px);left:-10px;}
    #nav .nav{display:block;right:20px;}
    #nav nav{z-index:9999;transition:.8s;position:fixed;top:0;right:0;transform:translateX(100%);background:#161f36;width:250px;max-width:100%;}
    .openNav #nav nav{transform:translateX(0);}
    #nav nav:before{transition:.8s;content:'';width:0;height:100vh;background:#0276f9;opacity:0;right:0;position:absolute;margin-right:100%;}
    .openNav #nav nav:before{width:100vw;opacity:.7;}
    #nav nav ul{height:auto;top:50%;transform:translateY(-50%);}
    #nav nav li{float:none;width:100%;height:40px;text-align:center;}
    #nav nav li:after{display:none;}
    #nav nav li a{font-size:13px;}
    #nav nav li.active, #nav nav li:hover{background:transparent;box-shadow:0 0 0;}
    #nav nav li.active a, #nav nav li:hover a{color:#0276f9;}
    
    .default-page .top{height:70px;}

    .step li{padding-left:10px;width:100%;border-left:0;border-bottom:1px solid #ddd;}
    
    .forfaits li{width:25%;}

    #vehicule .cars li{width:33.333%;}

}  
/************* max 900 **************/ @media screen and (max-width:900px){
 
    #footer{padding:40px 5px 15px 10px;}
    #footer .copyright{width:100%;border-bottom:1px solid rgba(255,255,255,.03);height:115px;margin-bottom:25px;}
    #footer .copyright img{float:right;top:-100px;margin-right:15px;}
    #footer .container > .horaire{width:calc(50% - 40px);left:40px;margin-right:80px;transform:none;position:relative;float:left;}
    #footer .container > .coordonnees{width:calc(50% - 40px);float:left;}
 
} 
/************* max 768 **************/  @media screen and (max-width:768px){
    
    .home-content .col-7{padding:40px 35px;}

    #essai .form-group textarea{margin-top:0;}

    .forfaits li{width:33.333%;}

    .fivestar{width:40px;}

    #vehicule .cars li{width:50%;}

    #vehicule .essai{height:250px;}
    #vehicule .essai img{display:none;}
    #vehicule .essai a{width:100%;font-size:16px;}
    #vehicule .essai a h3{font-size:20px;line-height:21px;}

}  
/************* max 680 **************/  @media screen and (max-width:680px){
    
    #app .app-content > div{padding-top:40px;}
    
    #header .top{height:40px;padding:13px 0;}
    #header .top a,
    #header .top p{display:none;}
    #header .top .right{width:100%;text-align:center;}
    #nav{height:60px;}
    
    #home .top span:nth-child(1){left:20px;}
    #home .top span:nth-child(2){right:20px;}
    #home .top{height:420px;}
    
    #gamme > div{min-height:200px;width:100%;}
    #gamme a{text-align:center!important;padding:15px!important;font-size:20px;}
    #gamme a small{font-size:16px;}
    #gamme a:before{display:none;}
   
    #nl{padding:40px 0;}
    #nl p{font-size:14px;line-height:20px;}

    #services .col-3{flex:0 0 100%;max-width:100%;padding:0 10%;}

    .home-content > div:after{display:none;}
    .home-content .col-7{padding:40px 20px;flex:0 0 100%;max-width:100%;}

    #bc{display:none;}

    .default-page .top{height:60px;margin-bottom:30px;}

    .paragraphe{line-height:22px;font-size:12px;}

    #footer{padding:35px 0px 10px 5px;}
    #footer .container > .horaire{padding-bottom:20px;width:calc(100% - 35px);left:35px;margin-right:0;border-bottom:1px solid rgba(255,255,255,.03);margin-bottom:25px;}
    #footer .container > .coordonnees{width:calc(100% - 35px);left:35px;}
    
    .h1{font-size:25px;line-height:25px;}
    .h2{font-size:23px;line-height:23px;}

    .forfaits li{width:50%;}

    #article article > div{height:200px;}

}
/************* max 520 **************/ @media screen and (max-width:520px){

    #footer .copyright img{display:none;}
    
    .form-group.mul:not(.vehicule){height:143px;}
    .form-group.date .form-select:nth-child(1){width:calc(50% - 8px);margin-right:15px;}
    .form-group.date .form-select:nth-child(2){width:calc(50% - 7px);margin:0;}
    .form-group.date .form-select:nth-child(3){width:100%;}
    .form-group.date .form-select{margin-bottom:10px;}

    .forfaits li{width:100%;}

    #article article > div{height:180px;}

    #vehicule .cars li{width:100%;}

}

/*----------------------------------------------------< KEYS FRAMES >---------------------------------------------------*/

/************* loader animation **************/ 
    
    @keyframes loader{
        0%{top:96px;left:96px;width:0;height:0;opacity:1;}
        100%{top:18px;left:18px;width:156px;height:156px;opacity:0;}
    }
    @-webkit-keyframes loader{
        0%{top:96px;left:96px;width:0;height:0;opacity:1;}
        100%{top:18px;left:18px;width:156px;height:156px;opacity:0;}
    }