.showInMobile { display:none !important }
@media screen and (max-width:778px) {

  #back-to-top { display:none }

  .sidecol > .col { float:none }
  .sidecol > .col-container { width:auto; margin:0 0 10px }
  .sidecol > .col-sidebar { margin:0 auto }

  .form-fields label.elt,
  .form-field > label,
  .form-field > label + .form-field-control,
  .form-fields label.elt + .elt-control { display:block; width:100% !important; margin:0; float:none; text-align:left !important; padding:0 !important }

  .form-fields label.elt,
  .form-field > label { margin-bottom:5px }

  .form-field > label + .form-field-control select, .form-fields label.elt + .elt-control select { width:100% }

  img { max-width:100%; }
  .hiddenInMobile { display:none !important }
  .showInMobile { display:block !important }
  .block-container,
  .wrapper-container { width:100% !important; }
  .container-nav .block-container { padding:0; min-height:64px }
  .main-title,
  .section-title,
  .differences-container .section-title { padding:30px 0 }
  .section-title:after { margin-top:25px }
  .container-link { z-index:1; position:relative }
  .container-link .block-container { padding:0 }
  .container-logo { float:none; height:64px; width:auto; padding:0 0 0 20px; background:#fff; vertical-align:middle; position:relative; z-index:1; box-shadow:0 2px 3px 0px rgba(0, 0, 0, 0.2) }
  .container-logo #logo,
  .container-logo button { vertical-align:middle; height:64px }
  .container-logo button { vertical-align:middle; width:64px; height:64px; background:url("/web/cma/images/btn-menu-sx.png") no-repeat top left; float:right }

  #logo { display:inline-block; width:220px; height:64px; background-image:url('/web/cma/images/logo-sx.png') }
  #main-nav { float:none; text-align:center; display:block; position:relative;
    -webkit-transition:all 0.3s ease-in-out;
    -moz-transition:all 0.3s ease-in-out;
    -ms-transition:all 0.3s ease-in-out;
    -o-transition:all 0.3s ease-in-out;
    transition:all 0.3s ease-in-out;
    margin-top:-webkit-calc(-100% - 64px);
    margin-top:calc(-100% - 111px);
  }
  #main-nav.showed { margin-top:0 }
  #main-nav li { display:block; padding:0; margin:0 }
  #main-nav li:first-child .main-nav__element { border:0 }
  .main-nav__element { padding:15px 10px 15px; background:#9c0; color:#fff; font-size:18px; border:0; margin:0; border-top:1px solid #fff; text-decoration:none !important; font-weight:500 }
  .main-nav__element:hover { border-color:white; }
  .main-nav__element:active { background:#add633 }

  #floating-actions,
  .container-link #top-bar__welcome-note,
  .container-link .faq,
  .container-link .account { display:none !important }
  #top-bar__top-links,
  .container-link .contact { float:none; display:block !important; text-align:center }

  #main-slider-mobile { background:none no-repeat top center; background-size:cover; padding-top:180px }

  .slide-box { height:auto; float:none; margin-top:0px }
  .slide-box__nav li { width:50% }
  .slide-box__nav__tab { width:auto }
  .slide-box__container { padding:25px 20px }
  .slide-box__actions .btn { margin:0; display:block; width:100% }

  .differences-list { padding:0; background:transparent }
  .differences-list,
  .differences-list .difference { display:block }
  .differences-list .difference:first-child { border-top:0; padding-top:0 }
  .differences-list .difference { padding:20px 0 0; margin-bottom:20px; border-top:1px solid #e0e0e0; border-left:0 }
  .differences-list .difference__step { margin:0 10px 0 -10px; float:left }
  .differences-list .difference__title { }
  .difference-footer { margin:0 -20px; text-align:left }
  .difference-footer__image { margin-top:0; }
  .difference-footer__content { margin-right:95px }

  .actualite { width:auto }
  .actualite__text { float:none; width:100% }
  .actualite__img { float:none; margin:0 auto 10px; display:block }
  .container-actualite .section-actions a { display:block; margin:0 0 10px }

  .assurances-types__list,
  .services-list { white-space:nowrap; overflow:hidden; font-size:0; width:calc(100% + 20px); margin-left:-20px; overflow-x:scroll; -webkit-overflow-scrolling:touch;  }
  .services-list__service { width:60%; display:inline-block }
  .services-list__service + li { margin:0 }

  .assurances-types__list { margin:30px 30px 0 }
  .assurances-types__list.slides { margin:30px 0 0 }
  .assurances-types__list:before,
  .assurances-types__list:after { }
  .assurances-types__list li { width:100%; white-space:nowrap }
  .assurances-types__list li + li { margin:0 }

  .container-assurance.grey { background:#fff }
  .assurance-groups { background:#f7f7f7 }
  .assurance-group { }
  .assurance-group + li { margin:0 }

  .footer__social { width:auto; float:none; margin:0 0 20px }
  .footer__quick-access { white-space:normal }
  .footer__social__link { display:inline-block; border-radius:0; background:none; padding:16px }
  .footer__quick-access__section { display:block }
  /*.footer__quick-access__section ul { display:none }*/
  .footer__quick-access__section + li { margin-left:0 }
  .quick-access__section__title { display:block; border-radius:3px; background:#767676; padding:16px; margin-bottom:2px; text-align:center }
  .quick-access__section__list { margin-bottom:3px; }
  .quick-access__section__elem a { display:block; box-sizing:border-box; padding:10px; background:#eee; color:#767676; font-size:14px; }
  .footer .separator { padding:0 }
  .footer__legal-links { margin:10px 0; }

  .cms-aside__menu,
  .cms-aside__menu__link { width:100% !important; text-align:center; box-sizing:border-box; }
  .cms-aside { width: 100%;}
  .PinIt.isPinned > [data-fixed="true"] { width:-webkit-calc(100% - 40px); width:-moz-calc(100% - 40px); width:calc(100% - 40px); }
  .cms-aside { margin:0 0 40px; }
  .cms-content,
  .fondateurs-block__desc { width:100%; }
  .fondateurs-block__img,
  .cms-block .back { margin:0; margin-bottom: 20px; display:block; font-size:0; text-decoration:underline; }
  .cms-block__article__img {width: 160px;}
  .fondateurs-block.clearfix .fondateurs-block__desc { width:80%; }

  /* carousel*/
  .slideshow-assurances-types .slides, .slideshow-assurances-types .slide { height:160px; }
  /*.slideshow-assurances-types .slide { padding:0 50px; }*/
  .slideshow-assurances-types .nav-control.next,
  .slideshow-assurances-types .nav-control.prev { position:absolute; margin-top:-160px; font-size:5em }
  .slideshow-assurances-types .nav-control.next { right:0px }
  .slideshow-assurances-types .nav-control.prev { left:0px }
  .slideshow-assurances-types .assurance-type { display:inline-block; width:50% }
  .slideshow-assurances-types { width:105%; width:calc(100% + 20px); margin:0 0 0 -20px; }
  .assurances-types__list { overflow:hidden; overflow-x:scroll; -webkit-overflow-scrolling:touch; }

  .slideshow-service .slides, .slideshow-service .slide { height:300px }

  .slideshow-assurance .slides, .slideshow-assurance .slide { /*height:260px;*/ }
  .slideshow-assurance .slide { vertical-align:top; margin:5px 20px; white-space:normal }

  .slideshow-assurance { padding:20px 0; }
  .assurance-groups { white-space:nowrap; width:105%; width:calc(100% + 40px); overflow-x:scroll; overflow-y:hidden; -webkit-overflow-scrolling:touch; margin:0 0 0 -20px; padding:15px 0; }

  .slideshow-actualite .slides, .slideshow-actualite .slide { height:360px }
  .slideshow-actualite .slide { white-space:normal; vertical-align:top; width:300px; margin-right:10px; -webkit-overflow-scrolling:touch; }
  .slideshow-actualite .slide.actualite { margin:0; }
  .slideshow-actualite { white-space:nowrap; overflow:hidden; overflow-x:scroll; -webkit-overflow-scrolling:touch; }
  /* !carousel*/
  #produitSelector .produit-type { width:auto; margin:0 0 10px 0 !important }
  #produitSelector .produit-type input[type=radio] + label { padding:0; display:table; table-layout:fixed; width:100% }
  #produitSelector .produit-type input[type=radio] + label::after { display:none }
  #produitSelector .produit-type input[type=radio] + label::before { width:auto; content:""; background:url('/web/cma/images/produit-selection-type-particulier.jpg') no-repeat left top }
  #produitSelector .produit-type.produit-select-professionnel input[type=radio] + label::before { width:auto; content:""; background:url('/web/cma/images/produit-selection-type-professionnel.jpg') no-repeat left top }
  #produitSelector .produit-type input[type=radio] + label::before,
  #produitSelector .produit-type input[type=radio] + label .produit-type__label { float:none; margin:0; display:table-cell; height:auto }
  #produitSelector .produit-type input[type=radio] + label .produit-type__label { padding:10px; width:75%; min-width:340px }

  #produit-steps .produit-step { display:none }
  #produit-steps .produit-step.selected { display:block; width:auto !important }
  /*#produit-steps .produit-step[data-step="produit"]*/
  #formProduit .form-produit-header { margin:0 }
  #step-produit .form-block,
  #formProduit .form-block { padding:20px }
  #step-produit .form-block { background-image:none; }
  #formProduit .produit-type__image { height:80px; width:80px; }
  #formProduit .produit-type__image,
  #formProduit .form-produit-title { display:block }
  #formProduit .form-produit-title { padding-left:0 }

  .services-content { display:block; margin-bottom:50px }
  .services-content__col--left { display:block; padding-right:0; border-right:none; border-bottom:1px solid #e0e0e0; padding-bottom:30px; margin-bottom:20px; }
  .services-content__col--right { display:block; padding:0 }

  .offre__image { display:none }
  .offre__title { padding:20px }
  .offre__package__header { min-height:60px; height:auto }
  .offre__package__title { line-height:1.3; padding:10px; font-size:14px; }
  .offre__package__service { display:block; margin-bottom:10px }
  .offre__package__service__image { display:block; float:left }
  .offre__package__service__title { display:block; padding-left:90px; width:100%; min-height:70px; font-size:14px; }
  .offre__package__service__content { display:block }

  .offre__actions .demande-en-ligne { margin:20px 0 0 }

  .form-parrainage { margin:0 0 60px }
  .parrainage__header { padding:20px }
  .parrainage__header:before { float:left; margin:3px 15px 3px 0; position:static }
  .parrainage__fields { padding:15px 0 }
  .parrainage__body,
  .parrainage__field { display:block; width:auto; padding:0 2em 1em; border:0; margin-bottom:30px }
  .parrainage__information { display:block; padding:15px 0 0 }

  .action-contact #content { background:none; padding:0; }
  .form-cma-contact label, .form-cma-contact-pro label, .form-cma-contact .form-button { margin-left:0 }
  .form-cma-wcb .form-button .btn { margin-top:20px }
  .form-cma-wcb .form-header { margin-bottom:10px; text-align:center }
  .form-cma-wcb .form-footer { width:100%; margin:0 0 15px; }
  .form-cma-wcb .form-fields { width:100%; }
  .form-cma-wcb .form-mandatory { margin-top:20px; }
  .block-container .form-cma-wcb { margin:0 40px 40px; }
  .form-cma-wcb .form-title { font-size:16px; margin:0 0 15px; line-height:16px; padding:15px 10px 10px; }
  .form-cma-wcb .form-title:before { display:none; }

  #socialShareHolder .dialog-title { margin:0; padding:10px; box-sizing:border-box; width:100%; line-height:normal; text-align:center; height:auto; }
  #socialShare { margin:0; }
  #socialShare .table { display:block; text-align:center; }
  #socialShare .table-cell { display:inline-block; width:30%; padding:30px 0; }
  #socialShare a.sharingLink .sharingLabel { display:none; }
  #socialShare .sharing-col-center { border:0; }

}

@media screen and (max-width:1080px) {
  .block-container, .block-container.produits-container { width:100%; box-sizing:border-box; }
  .form-cma-contact .form-button .form-mandatory { margin-left:10px;}
  .form-cma-contact .form-button,
   .form-cma-satisfaction .form-button { width: 570px;}
   
   #top-bar__top-links li { width: auto;}
}

@media screen and (min-width:768px) and (max-width:1300px) {
  .wrapper-container { min-width:768px; width:100% }
  #back-to-top { display:none }

}

@media screen and (max-width:768px){
  .actualite__img { width:100%;}
  .assurances-types__list li { width:63%; white-space:nowrap }
  .services-list__service { width: 50%;}
  .assurance-group { margin: 0 10px !important;}
  .assurance-group__titre {font-size: 12px;}
   .form-cma-contact-pro .form-button .btn,
   .form-cma-contact-pro .form-button,
   .form-cma-satisfaction .form-button,
  .form-button .btn { margin-left: 0;}
  .slideshow-assurance .slide { width: 260px;}
  .form-cma-contact-pro .form-content .form-mandatory { margin-left: 10px;}
  .legal-notice .block__info-phone {margin-left: 55px;}
  .form-cma-satisfaction .form-button label {margin-left: 0}

  #top-bar__top-links li { width: 100%;}
  #top-bar__top-links li.contact { display: none !important;}

  .form-cma-contact-pro #content, .form-cma-satisfaction #content { background: #FFFFFF; padding: 0}

  .action-produits-netvox .assurances-types__list { margin:30px 0 0; }
  .sousproduits-list { margin-top:10px; }
  .sousproduits-list li { display:block !important; margin:0 0 5px 0 !important; }
  .sousproduits-list .btn { width:100%; }

  #devis-sous-produit-iframe { max-width:100% !important; }

}


@media screen and (max-width:736px) {
  .cms-block__article .cms-block__article__text { width:60%;}
  .fondateurs-block.clearfix .fondateurs-block__desc { width: 75%;}
}

@media screen and (max-width:480px) {
  .fondateurs-block.clearfix .fondateurs-block__desc { width: 68%;}
}

@media screen and (max-width:414px) {

  #logo { width:190px; background-size:contain }
  .legal-notice .block__info-phone {float: left;margin-left: 0px; margin-top: 10px;}
  .legal-notice .block__kernix {float: left; margin-top: 10px; margin-left: 93px; }

  #produitSelector .produit-type input[type=radio] + label::before { display:none }
  #produitSelector .produit-type input[type=radio] + label .produit-type__label { min-width:0 }

  .slideshow-assurance .slide { margin: 5px 10px;}
  .services-list__service { width: 92%;}
  .form-cma-contact .form-button,
  .form-cma-contact-pro .form-button{width: 200px;}
  .cms-block__article .cms-block__article__text { width:100%; }
  .cms-block__article__img { width:100%; height:210px; margin:10px auto; }

  .fondateurs-block.clearfix .fondateurs-block__desc { width: 100%;}
  .fondateurs-block__img, .cms-block .back { margin: 0 auto 20px auto; float: inherit;}
  .fondateurs-block.clearfix h2 {text-align: center !important}

}
