
/* 
    Created on : Mar 28, 2016, 11:14:26 AM
    Author     : OneImage
    */
/*-----------------------------------------------------------------------------------

	= Table of Contents
	
	0. =GENRAL
	
	1. =FONTS
		
	2. =GENERAL CUSTOM CLASSES
	
	3. =BUTTONS
	
		
    /*-----------------------------------------------------------------------------------*/

/* 0. =GENERAL

/*-----------------------------------------------------------------------------------*/

body {background:#ebf2fc;font-family: 'Roboto', sans-serif;color:#4e5066;font-weight: 400;font-size: 13px;}
ul {list-style-type:none;}
a {text-decoration:none;transition:all 0.2s ease;
	-webkit-transition:all 0.2s ease;                  
    -moz-transition:all 0.2s ease;                 
    -o-transition:all 0.2s ease;   
    -ms-transition:all 0.2s ease;
}
a, a:focus{outline-width: 0;}

a{color: #4e5066;}

/*-----------------------------------------------------------------------------------*/

/* 1. =FONTS

/*-----------------------------------------------------------------------------------*/
@font-face{
    font-family: Oswald;
    src: url('../fonts/Oswald-Regular.ttf');
}
h1, h2 , h3 , h4 {font-family: 'Roboto', sans-serif;font-weight:700;}
h1 {font-size:28px;line-height: 40px;}
h2 {font-size:20px;line-height: 24px;}
h3 {font-size:16px;line-height: 20px;}
h4, h3.small {font-size:14px;line-height: 24px;}

@media all and (min-width:768px){
    h1 {font-size:30px;line-height: 40px;}
    h2 {font-size:26px;line-height: 34px;text-transform: uppercase;}
    h3 {font-size:18px;}
    h4, h3.small {font-size:16px;line-height: 24px;}
}

@media all and (min-width:768px) and (max-width:1200px){
    h1 {font-size: 23px;line-height: 35px;}
}
.bold{font-weight: 800;}
.thin{font-weight: 400;}
.rotate-arrow{transform: rotate(56deg) scale(.5);}
.font-default {font-family: 'Open Sans', sans-serif;font-weight: 400;}
.font-bold {font-weight: 700;font-family: 'Open Sans', sans-serif;}
.font-light{font-weight: 100;font-family: 'Open Sans', sans-serif;}
.font-italic {font-style: italic;font-family: 'Open Sans', sans-serif;}

.lowercase{text-transform: lowercase;}
.uppercase {text-transform:uppercase;}

.text-center{text-align: center;}

.font-small-xxs {font-size:10px;}
.font-small-xs {font-size:11px;}
.font-small {font-size:12px;}
.font-medium-xs {font-size: 14px; line-height: 18px;}
.font-medium {font-size: 15px;line-height:24px;}
.font-medium-xl {font-size:18px;}
.font-large-xs {font-size:20px;}
.font-large {font-size:24px;}
.font-large-xl {font-size:26px;}
.font-extralarge {font-size:32px !important;}

.color-blue{color: #078ed0;}
.color-default {color:#4e5066;}
.color-red {color:#cf3767;}
.color-white {color:#fff !important;}
.color-green {color: #9dce1b;}
.color-black {color: #000;}

/*-----------------------------------------------------------------------------------*/

/* 2. =GENERAL CUSTOM CLASSES

/*-----------------------------------------------------------------------------------*/


.bg-blue{background: #078ed0;}
.bg-white{background: #fff;}
.bg-grey{background: #dce5f1;}
.bg-orange{background: #f26410;}
.bg-green{background: #9dce1b;}
.bg-black{background: #000;}


.opacity90 {opacity:.9;}
.opacity80 {opacity:.8;}
.opacity70 {opacity:.7;}
.opacity60 {opacity:.6;}
.opacity50 {opacity:.5;}
.opacity40 {opacity:.4;}
.opacity30 {opacity:.3;}
.opacity25 {opacity: .25;}

.block-spacing-default{padding-left: 15px !important;padding-right: 15px !important;}
.block-spacing-medium {padding:30px;}
.block-spacing-big {padding:25px 0px;}
.block-spacing-small {padding:20px 20px;}
.vertical-spacing-medium {padding:25px 0px;}
.vertical-spacing-small {margin:15px 0px;}
.horizontal-spacing-medium {padding:0px 25px;}
.horizontal-spacing-small {padding-top:15px;padding-bottom:15px;}
.horizontal-spacing-big{padding: 0 45px;}
.block{padding-bottom: 40px;position: relative;}

.margin-left5{margin-left: 5px;}
.margin-left10{margin-left: 10px;}
.margin-left15{margin-left: 15px;}
.margin-left20{margin-left: 20px;}
.margin-left50{margin-left: 50px;}
.margin-right5{margin-right: 5px;}
.margin-right15{margin-right: 15px;}
.margin-top-2{margin-top: -2px;}
.margin-top5{margin-top: 5px;}
.margin-top15{margin-top: 15px;}
.margin-top20{margin-top: 20px;}
.margin-top30{margin-top: 30px;}
.margin-top35{margin-top: 35px;}
.margin-top50{margin-top: 50px;}
.margin-top55{margin-top: 55px;}
.margin-bottom5{margin-bottom: 5px;}
.margin-bottom10{margin-bottom: 10px;}
.margin-bottom15{margin-bottom: 15px;}
.margin-bottom20{margin-bottom: 20px;}
.margin-bottom30{margin-bottom: 30px;}
.margin-bottom40{margin-bottom: 40px;}
.margin-bottom60{margin-bottom: 60px !important;}

.padding-top5{padding-top: 5px;}
.padding-top10{padding-top: 10px;}
.padding-top15{padding-top: 15px;}
.padding-top20{padding-top: 20px;}
.padding-left20{padding-left: 20px;}
.padding-left15{padding-left: 15px;}
.padding-left30{padding-left: 30px;}
.padding-bottom5{padding-bottom: 5px;}
.padding-bottom10{padding-bottom: 10px;}
.padding-bottom15{padding-bottom: 15px;}



.reset-left {padding-left:0px;margin-left:0px;}
.reset-right {padding-right:0px;margin-right:0px;}
.reset p {margin-bottom:0px;}
ul.reset {margin-bottom: 0;}
p.reset, h1.reset {margin-bottom:0px;}

.vertical-align {position: relative;top: 50%; -webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}


.border-left{border-left: 1px #078ed0 solid;}
.border-right{border-right: 1px #078ed0 solid;}

.border-top{border-top: 1px #078ed0 solid;}
.border-bottom{border-bottom: 1px #078ed0 solid;}

.box-shadow {box-shadow: 0 0 8px rgba(0,0,0,0.35);}

.display-flex {display: flex;}

@media all and (min-width:768px){
    .inner-section {padding-left: 45px;}
    .height35{height: 35px;}
    .height40{height: 40px;}
    .height50{height: 50px;}
    .height60{height: 60px;}
    .height160{height: 160px;}
    .height300{height: 300px;}
    .height286{height: 286px;}
    .border-dashed-left{border-left: 1px #078ed0 dashed;}
}

@media all and (min-width:992px){

}

@media all and (max-width:767px) {
    .reset-vertical-align {position: relative;top: 0; -webkit-transform: none;-ms-transform: none;transform: none;}
}
/*-----------------------------------------------------------------------------------*/

/* 3. =BUTTONS

/*-----------------------------------------------------------------------------------*/
a{transition:background 0.2s ease;
	-webkit-transition:background 0.2s ease;                  
    -moz-transition:background 0.2s ease;                 
    -o-transition:background 0.2s ease;   
    -ms-transition:background 0.2s ease;}
    button {outline:none !important;border: none;vertical-align: middle;
       transition:color 0.2s ease;
       -webkit-transition:color 0.2s ease;                  
       -moz-transition:color 0.2s ease;                 
       -o-transition:color 0.2s ease;   
       -ms-transition:color 0.2s ease;
       transition:background 0.3s ease;
       -webkit-transition:background 0.3s ease;                  
       -moz-transition:background 0.3s ease;                 
       -o-transition:background 0.3s ease;   
       -ms-transition:background 0.3s ease;
   }

   .nav>li>a:focus, .nav>li>a:hover {background: transparent;}
   .icon {background: url(../images/sprite.png);}
   .icon.icon-tel.small {background-position: 0 -727px;width: 30px;height: 21px;display: inline-block;vertical-align: middle;}
   .icon.icon-tel {background-position: 0 12px;width: 35px;height: 48px;display: inline-block;vertical-align: middle;}
   .icon.icon-tel.green {background-position: 0 -758px;width: 18px;height: 18px;display: inline-block;vertical-align: middle;}
   .icon.icon-oblig {background-position: 0 -49px;width: 34px;height: 33px;display: inline-block;vertical-align: middle;}
   .icon.icon-check-mark {background-position: 0 -194px;width: 18px;height: 19px;display: inline-block;vertical-align: middle;}
   .icon.icon-entreprise {background-position: 0 -100px;width: 32px;height: 30px;display: inline-block;vertical-align: middle;}
   .icon.icon-bullet{background: #078ed0;width: 4px;height: 4px;border-radius: 50%;display: inline-block;}
   .icon.icon-av-salaries {background-position: 0 -146px;width: 31px;height: 39px;display: inline-block;vertical-align: middle;}
   .icon.icon-download.green {background-position: 0 -231px;width: 27px;height: 29px;display: inline-block;vertical-align: middle;}
   .icon.icon-download.white {background-position: 0 -274px;width: 24px;height: 26px;display: inline-block;vertical-align: middle;}
   .icon.icon-tick-green{background-position: 0 -323px;width: 35px;height: 35px;display: inline-block;vertical-align: middle;}
   .icon.icon-plus-sign{background-position: 0 -382px;width: 36px;height: 36px;display: inline-block;vertical-align: middle;}
   .icon.icon-smile-pink{background-position: 0 -438px;width: 36px;height: 36px;display: inline-block;vertical-align: middle;}
   .icon.icon-heart{background-position: 0 -492px;width: 36px;height: 36px;display: inline-block;vertical-align: middle;}
   .icon.icon-mail.white{background-position: 0 -798px;width: 22px;height: 16px;display: inline-block;vertical-align: middle;}
   .icon.icon-choralis{background-position: 0 -831px;width: 33px;height: 25px;display: inline-block;vertical-align: middle;}

   .icon.icon-linkdin{background-position: 0 -549px;width: 22px;height: 20px;display: inline-block;vertical-align: middle;}
   .icon.icon-viadeo{background-position: 0 -578px;width: 18px;height: 21px;display: inline-block;vertical-align: middle;}
   .icon.icon-facebook{background-position: 0 -608px;width: 11px;height: 21px;display: inline-block;vertical-align: middle;}
   .icon.icon-mail{background-position: 0 -646px;width: 22px;height: 16px;display: inline-block;vertical-align: middle;}

   p.bullet-icon.small {padding-left: 15px;background: url(../images/bullet.png) no-repeat 0 7px;}
   /*p.bullet-icon.small:before{content: "";background:#078ed0;border-radius: 50%;display: inline-block;width: 4px;height: 4px;margin-right: 20px;}*/
   h4.icon-check-mark {padding-left: 30px; background: url(../images/icon-checkmark.png) no-repeat 0 5px;}
   .button {background: #9dce1b;color: #fff;border-radius: 50px;border-bottom: 3px #82b205 solid;text-align: center;font-weight: 700;}
   .button.small {font-size: 16px;padding: 10px 20px;}
   .button.big {font-size: 13px;padding: 0px 50px;width: 455px;margin: 0 auto;height: 45px;}
   .button.big a{color: #fff;line-height: 14px;display: block;}

   .button.outline{background: #fff;padding: 10px 20px;border: 1px #4e5066 solid;}

   .button.contacf {width: 100%;border-radius: 15px !important;font-size: 16px;padding: 10px 20px;}
   @media all and (min-width:768px) {
    p.bullet-icon.small{margin-left: 15px;}
}
@media all and (min-width:992px){
	
    /* --- ANIMATIONS/HOVER -------*/
    .button:hover{opacity: .8;}
}


/* --- FORM ELEMENTS -------*/
form {background: #fff;width: 330px;border-radius: 10px;box-shadow: 0 0 8px rgba(0,0,0,0.35);padding: 15px; float: right;}
.form-head img {margin-top: -60px;margin-left: -15px;}
.has-success .form-control{border-color: #39b54a;}
.has-success .form-control-feedback {color: #39b54a;}
.has-error .form-control {border-color: #ed1c24;}
.has-error .form-control-feedback {color: #ed1c24;}
.form-group.has-error p{font-size: 11px;color: #ed1c24;}

.has-success .form-control:focus,
.has-success .form-control,
.has-error .form-control:focus,
.has-error .form-control,
.form-control:focus,
.form-control {box-shadow: none; -webkit-box-shadow: none;}

/*-----------------------------------------------------------------------------------*/

/* 4. = LAYOUT

/*-----------------------------------------------------------------------------------*/
@media (min-width: 1200px){
    .container { width: 1100px;}
}
/*------------- HEADER -------------------*/
header, .content {background: #fff;}

.main-menu {
    border-radius: 50px;
    background: #8b8686; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#8b8686, #000); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#8b8686, #000); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#8b8686, #000); /* For Firefox 3.6 to 15 */
background: linear-gradient(#8b8686, #000); /* Standard syntax */}
.main-menu ul li a{font-size: 12px !important;line-height: 20px;color: #fff;font-weight: 700;}
@media all and (min-width:768px){
    .content {background: #fff;border-radius: 15px;box-shadow: 0 0 8px rgba(0,0,0,0.35);}
    header {padding: 25px 0 35px 0;}
}
@media all and (max-width:767px) {
    .logo{width: 200px;margin: 20px auto;}
    .logo img{width: 200px;text-align: center;height: auto;}
}
/*------------- STICKY NAV -------------------*/
.sticky-nav{position: fixed;top: 0;z-index: 5;transition:all 0.2s ease;
	-webkit-transition:all 0.2s ease;                  
    -moz-transition:all 0.2s ease;                 
    -o-transition:all 0.2s ease;   
    -ms-transition:all 0.2s ease;}
    .sticky-nav .main-menu {width: 100%;background: #078ed0;border-radius: 0;}
    .navbar.sticky-nav {margin-top: 0;min-width: 100%;}

    @media all and (min-width:768px) {
        .navbar.sticky-nav {margin-top: 0;min-width: 750px;}
        .sticky-nav .main-menu{padding-left: 15px;padding-right: 15px;}
    }
    @media all and (min-width:992px){
        .sticky-nav .main-menu {width: 98%;}

    }
    @media all and (min-width:992px) and (max-width:1200px) {
        .navbar.sticky-nav {min-width: 660px;}
        .icon.icon-tel{margin-left: 20px;}
        .has-question .col-md-2 img{right: -28px !important;}
    }

    /*------------- en savoir pluis block -------------------*/
    .savoir-plus a{color: #4e5066; font-size: 12px; line-height: 16px;}
    .trace-line {position: absolute;width: 1px;background: #078ed0; z-index: 3;}
    .trace-line.first{top: 63px;left: 31px;height: 87%;}
    .trace-line.second{top: 72px;left: 31px;height: 83%;}

    .trace-line:after {content: "";background: #078ed0;width: 5px;height: 5px;position: absolute;bottom: 0;left: -2px;}
    .navbar{border: none;}
    .main-menu ul li a.active {background: transparent;color: #9dce1b;}

    .immersive img{width: 100%;height: auto;}
    .immersive .text{position: absolute;right: 0;top: 15px;padding-left: 0;}
    @media all and (min-width:768px) {
        .logo {float: left;}
        .main-menu {padding-left: 38px;padding-right: 38px;}
        .main-menu ul li a:hover {background: transparent;color: #9dce1b;}
        .navbar {margin-top: -25px;border: none;}
        
        /*------------- QUESTION BLOCK -------------------*/
        .has-question{height: 120px;background-image: url(../images/question-img.png); background-repeat: no-repeat;background-position:left 60px;}
    }
    @media screen and (max-width: 767px){
        .has-question{
            background-image: none;
            background-color: #078ed0 !important;
        }
        .has-question a{
            text-align: center;
        }
        .has-question p{
            color: #4e5066 !important;
            text-align: left;
        }
    }

    @media all and (max-width:767px){
        .savoir-plus {padding-top: 15px;padding-bottom: 15px;text-align: center;}
        .savoir-plus strong {font-size: 14px;}
    }

    @media all and (min-width:768px) {
        /*------------- immersive zone -------------------*/
        .immersive .bg-blue {border-top-left-radius: 15px;border-top-right-radius: 15px;}

        /*    .immersive .bg-blue{height: 286px;}*/
        /*------------- en savoir pluis block -------------------*/
        .savoir-plus .inner-section {height: 120px;}
        /*    .savoir-plus a:hover{ color: #9dce1b;text-decoration: none;  }*/

        .separator-right.grey {border-right: 3px #dce5f1 solid;}
        .separator-right.white {border-right: 3px #fff solid;}
    }
    @media all and (min-width:768px) and (max-width:992px){

    }
    @media all and (min-width:992px) {
       .has-question .col-md-2 img{position: absolute;right: -35px;top: 10px;}    
       .main-menu ul li a{font-size: 15px;line-height: 20px;color: #fff;font-weight: 700;}
       .immersive img{border-top-left-radius: 15px;border-top-right-radius: 15px;}
   }

   @media all and (min-width:1200px) {
    .immersive .bg-blue .col-sm-7 p{position: absolute;top: 40px;left: -100px;}
    .immersive .bg-blue .col-sm-7 h1{margin-top: 117px;}
    .main-menu ul li a{font-size: 18px;line-height: 20px;color: #fff;font-weight: 700;}
}


@media all and (max-width:767px){
    .navbar{margin-bottom: 0;}
    .main-menu{padding: 0;height: 50px;}
    .main-menu ul li {float: left;width: 28.59%;height: 45px;text-align: center;}
    .main-menu ul li.phone{width: 45px; height: 50px; background: #9dce1b;}
    .main-menu ul li a{font-size: 13px;padding-right: 0;padding-top: 0;padding-bottom: 0;position: relative;top: 50%; -webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
    .main-menu {border-radius: 0;padding-right: 0;}
    .navbar-nav{margin: 0px;padding: 0;}
    .phone{position: static !important;}
    .phone a.reset{padding: 0 !important;}
    .phone ul {position: absolute;width: 100%;background: #fff;left: 0;top: 50px;z-index: 6;box-shadow: 3px 0 7px rgba(0,0,0,0.35);padding-left: 0;padding-bottom: 25px;}
    .phone ul li {display: block;text-align: center;margin-bottom: 20px;float: none;width: 100%;height: 30px;}
    .phone ul li a{color: #000;}
    /*.phone:hover ul.submenu{display: inline-block !important;}*/
    
    /*------------- immersive zone -------------------*/
    .immersive img{width: 100%; height: auto;}
    .immersive .bg-blue .col-sm-7 p {position: absolute;}
    .immersive .col-sm-7 {padding-left: 0;}
    /*     .immersive h1 {font-size: 18px; line-height: 26px;margin-top: 10px;}*/
    .immersive .bg-blue .col-sm-7 h1{margin-top: 15px;}
}

@media all and (max-width:540px){
    .immersive h1 {font-size: 16px;line-height: 26px;margin-top: 0;font-weight: 500;}
}

@media all and (max-width:374px) {
    .immersive h1{font-size: 13px;font-weight: 500;margin: 0;}
}

/*-----------------------------------------------------------------------------------*/

/* 5. = SECTION 1

/*-----------------------------------------------------------------------------------*/
@media all and (max-width:767px) {
    #section1 .inner-section .col-xs-12 {padding: 0;border: none;}
    h2.margin-top50{margin-top: 25px;}
    #section1 h2 span, #section3 h2 span{display: block;}
}

/*-----------------------------------------------------------------------------------*/

/* 5. = SECTION 2

/*-----------------------------------------------------------------------------------*/
table .tarifs tr td{width: 195px; height: 50px; border-left: 1px dashed #078ed0; border-bottom: 1px dashed #078ed0; text-align: center;}
table tr td p {font-weight: bold; }
table tr td span{color: #cf3767; font-size: 14px;font-weight: bold;}
table .tarifs tr:last-child td {border-bottom: none;}
@media all and (max-width:767px) {
    table .tarifs tr td p {font-size: 10px;}
    table .tarifs tr td a {font-size: 12px;}
    table .tarifs tr td {padding: 0 5px;}
}
/*-----------------------------------------------------------------------------------*/

/* 6. = SECTION 3

/*-----------------------------------------------------------------------------------*/
#section3 h3.small{display: flex;}
.download-link a:hover i{opacity: .8;}
@media all and (min-width:768px) {
    /*    #section3 .step-2, #section3 .step-4 {height: 210px;}*/

    #section3 .step-2 .col-md-8 p{margin-top: 100px;}
    #section3 .step-4 .col-md-8 p:first-child {margin-top: 55px;}
    #section3 .margin-left{margin-left: 15px;}
}
@media all and (max-width:767px){
    .button.big {width: 271px; margin: 0 auto;padding: 0 10px;margin-bottom: 15px !important;}
    .icon.icon-entreprise {width: 59px;}
    .icon.icon-choralis {width: 45px;}
    .download-link.left i, .download-link.left a{float: left;}

    .download-link  a.color-default{margin-top: -20px;margin-left: 15px;margin-bottom: 20px;text-align: left;}
    #section3 h3.small {border-bottom: 1px #fff solid;padding-bottom: 15px;}
    #section3 h3.small .icon {margin-left: 20px;}
    #section3 .grey h3.small {border-bottom: 1px #dce5f1 solid;}
    #section3 .block {padding-bottom: 0px;}
    #section3 .col-sm-8, #section1 .col-sm-8 {margin-bottom: 30px;}
}
/*-----------------------------------------------------------------------------------*/

/* 7. = FOOTER

/*-----------------------------------------------------------------------------------*/
.footer-social ul li {display: inline-block;margin-left: 20px;}
.footer {padding-top: 15px;}
@media all and (min-width:768px) {
    .footer .col-md-3 span{display: block;}
    .footer {padding-top: 35px;}
    .icon-after {height: 175px;position: relative;display: block;}
    .icon-after:after {content: "";width: 0; height: 0; border-left: 10px solid transparent;border-right: 10px solid transparent;border-bottom: 10px solid black;margin: 0 auto;position: absolute;bottom: 0;}
    .footer .col-sm-3 p span{display: block;}
    .cms a{float: right;position: relative;top: 50%; -webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
}

/*-----------------------------------------------------------------------------------*/

/* 8. = CONTACT FORM / MODAL

/*-----------------------------------------------------------------------------------*/
.sidebar {display: none;}

@media all and (min-width:992px) {
    button.close{display: none;}
    .sidebar {display: block !important;}
    .sidebar.modal {position: static;overflow: visible;}
    .fade {opacity: 1;}
}

@media all and (min-width:1200px) {
 .sticky {width: 330px !important;}
}

@media all and (max-width:991px){
    .sticky {display: block !important;width: 100%;margin: 30px auto 0;}
    .sticky .form-head img{width: 50px;margin-top: -10px;height: auto;}
    .form-group {margin-bottom: 7px;}
    button.close {color: #9dce1b;text-shadow: none;opacity: .7;}
    .sidebar{padding: 0;}
    .sidebar form {float: none; margin: 0 auto;}
}

@media all and (max-width:767px) {
    .sticky {margin-top: 10px;}
}

/*-----------------------------------------------------------------------------------*/

/* 9. = POPUP CONFIRMATION

/*-----------------------------------------------------------------------------------*/

.modal-content {padding: 70px 15px;text-align: center;}
.modal-open .modal {padding-right: 0;}


.numbered-list{
    position: relative;
    display: table;
    background: linear-gradient(45deg, #0896dd, #0786c5);
    border-radius: 0 20px 20px 0;
    margin: 10px auto;
    margin-left: 100px;
    padding: 10px 20px;
}
.numbered-list:before{
    display:flex;
    flex-direction:row;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    font-family: Oswald;
    font-weight: 800;
    color: #fff;
    text-align: center;
    position: absolute;
    background: inherit;
    border-radius: 20px 0 0 20px;
    top: 0;
    left: -100px;
    width: 100px;
    height: 100%;
    content: attr(number);
}
.numbered-list:after{
    content: "";
    position: absolute;
    height: 100%;
    width: 3px;
    background: #fff;
    top: 0;
    left: -3px;
    z-index: 4;
}
@media screen and (max-width: 767px){
    .numbered-list{
        background: linear-gradient(180deg, #0896dd, #0786c5);
        margin: 70px 0 10px 0;
        border-radius: 0 0 20px 0;
    }
    .numbered-list:before{
        width: 100%;
        height: 60px;
        top: -60px;
        left: 0;
        border-radius: 20px 0 0 0;
    }
    .numbered-list:after{
        width: 100%;
        height: 3px;
        top: -3px;
        left: 0;
    }
    .navbar, .navbar .main-menu, .navbar, .navbar .main-menu li.phone{
      height: 75px !important;
    }
    .navbar, .navbar .main-menu li{
      height: 67px !important;
    }
    section{
      margin-bottom: 30px;
    }
    .page-offre-details .wrapper.offer-details {
        padding-top: 110px;
    }
    .popup-form-price .button span {
        padding-right: 25px !important;
    }
}
a.button{
    text-decoration: none;
    cursor: pointer;
}
.page-offre-details .button span {
    padding-right: 25px !important;
}
.newgroup span.glyphicon.glyphicon-remove.form-control-feedback {
    top: 10px;
}
.check-group label {
    display: inline-block !important;
    width: 89%;
    font-weight: normal !important;
    vertical-align: top;
}

.check-group input {
    display: inline;
    width: 10%;
    font-weight: normal !important;
    vertical-align: top;
    float: left;
    height: 15px;
}
.newgroup span.glyphicon.glyphicon-remove.form-control-feedback {
    top: 10px;
}
.newgroup span.glyphicon.glyphicon-remove.form-control-feedback {
    display: none;
}
