.viewer-element body {
    font-family: Hind, serif;}

.viewer-element .page-content-front {
    width: 1200px !important;}

.viewer-element .wrapper,
.viewer-element .viewer-content,
.viewer-element .checkout-bundle .ck-form-element,
.viewer-element .form-element .form-group label {
    font-size: 15px;    color: #4a4a4a;}

.viewer-element a,
.viewer-element .wrapper a,
.viewer-element .viewer-content a {
    font-size: 15px;    color: #4a4a4a;}

.viewer-element a:hover,
.viewer-element .wrapper a:hover,
.viewer-element .viewer-content a:hover
.viewer-element a:active,
.viewer-element .wrapper a:active,
.viewer-element .viewer-content a:active,
.viewer-element a:focus,
.viewer-element .wrapper a:focus,
.viewer-element .viewer-content a:focus {
    font-size: 15px;    color: #ec0002;}
.viewer-element h1,
.viewer-element .title-lvl-1 {
    font-size: 50px;    color: #e3e3e3;}
.viewer-element h2,
.viewer-element .title-lvl-2 {
    font-size: 18px;    color: #ec0002;}
.viewer-element h3,
.viewer-element .title-lvl-3 {
    font-size: 15px;    color: #ec0002;}
.viewer-element h4,
.viewer-element .title-lvl-4 {
    font-size: 15px;    color: #990001;}
.viewer-element h5,
.viewer-element .title-lvl-5 {
    font-size: 14px;    color: #777777;}
.viewer-element h6,
.viewer-element .title-lvl-6 {
    font-size: 14px;    color: #777777;}

/* ------------------------
// BUTTONS
 ------------------------ */
.viewer-element .form-button,
.viewer-element .wrapper-front .form-element .btn.btn-primary,
.viewer-element .input-group-btn,
.viewer-element .carousel-caption a.btn,
.viewer-element .article-new .article-new-link,
.viewer-element .outlined-btn.btn,
.viewer-element .btn.btn-primary,
.viewer-element .btn-default-link,
.viewer-element .iframe-preview-menu-btn {
    color: #ffffff;    background-color: #ec0002;    font-size: 15px;}

.viewer-element .form-button:hover,
.viewer-element .wrapper-front .form-element .btn.btn-primary:hover,
.viewer-element .input-group-btn:hover,
.viewer-element .carousel-caption a.btn:hover,
.viewer-element .article-new .article-new-link:hover,
.viewer-element .outlined-btn.btn:hover,
.viewer-element .btn.btn-primary:hover,
.viewer-element .btn-default-link:hover,
.viewer-element .iframe-preview-menu-btn:hover,
.viewer-element .iframe-preview-menu-btn.is-active {
    background-color: #990001;    color: #ffffff;    font-size: 15px;}

/* -----------------------
 CAROUSEL
 ------------------------ */
.viewer-element .carousel-element .swiper-pagination-bullet,
.viewer-element .carousel-indicators li {
    background-color: #ec0002;
}
.viewer-element .carousel-element .carousel-element-button {
    color: #ec0002;
}

.viewer-element .carousel-element .swiper-pagination-bullet-active,
.viewer-element .carousel-indicators .active {
    background-color: #990001;
}
.viewer-element .page-catalog-details .owl-carousel .owl-prev,
.viewer-element .page-catalog-details .owl-carousel .owl-next,
.viewer-element .page-catalog-details .item-carousel-controls .item-carousel-prev,
.viewer-element .page-catalog-details .item-carousel-controls .item-carousel-next {
    color: #990001;
}

/* ------------------------
// COOKIE
  ------------------------ */
.viewer-element body .cc-window.cc-banner {
    color: #4a4a4a;    background-color: #f6f6f6; }

.viewer-element a.cc-btn.cc-dismiss {
    color: #f6f6f6;    background-color: #ec0002;    font-size: 15px ;}

.viewer-element a.cc-btn.cc-dismiss:hover,
.viewer-element a.cc-btn.cc-dismiss:active {
    color: #f6f6f6;    background-color: #990001;    font-size: 15px ;}

/* -----------------------
 BUNDLE - ecommerce
 ----------------------- */
.viewer-element .ck-form-element.ck-form-element--radio a,
.viewer-element .ck-form-element.ck-form-element--checkbox a,
.viewer-element .ck-form-element label sup,
.viewer-element .checkout .checkout-fail .checkout-title,
.viewer-element .checkout-bundle .checkout-pagination a.is-active {
    color: #ec0002;
}
.viewer-element .ecommercebundle-list.is-loading::after,
.viewer-element .popin-connect .popin-loader::after,
.viewer-element .ecommercebundle-detail.is-loading .ecommercebundle-detail-buy::after,
.viewer-element .checkout-bundle .checkout-loader::after {
    border-top-color: #ec0002;
}
.viewer-element .ck-form-element.ck-form-element--radio a,
.viewer-element .ck-form-element.ck-form-element--checkbox a {
    border-color: #ec0002;
}
.viewer-element .noUi-connect,
.viewer-element .ecommercebundle-filters-radio + label::after,
.viewer-element .ck-form-element.ck-form-element--radio input[type=checkbox]:checked + label::before,
.viewer-element .ck-form-element.ck-form-element--radio input[type=radio]:checked + label::before,
.viewer-element .ck-form-element.ck-form-element--checkbox input[type=checkbox]:checked + label::before,
.viewer-element .ck-form-element.ck-form-element--checkbox input[type=radio]:checked + label::before {
    background-color: #ec0002;
    border-color: #ec0002;
}
.viewer-element .ecommercebundle-filters-treecat.is-some::after {
    background-color: #ec0002;
}
.viewer-element .ecommercebundle-filters-treecat.is-all::after,
.viewer-element .ecommercebundle-filters-checkbox + label::after {
    color: #ec0002;
}

.viewer-element .ecommerce-component .ecommerce-components-connexion-link,
.viewer-element .ecommerce-component .ecommerce-components-cart-link {
    color: #4a4a4a;
}
.viewer-element .ecommerce-component [data-header-hassubmenu]::after {
    border-color: #4a4a4a transparent transparent transparent;
}

.viewer-element .ck-flash-message,
.viewer-element .ck-promo .ck-promo-wrapper .ck-promo-valid-btn,
.viewer-element .ck-total .ck-promo-element .ck-promo-valid-btn,
.viewer-element .login .login-btn,
.viewer-element a.ck-btn,
.viewer-element button.ck-btn {
    color: #ffffff;    background-color: #ec0002;    font-size: 15px;}
.viewer-element .ck-product .ck-product-btn-quantity,
.viewer-element .ecommercebundle-detail .ecommercebundle-detail-quantity-button {
    color: #ffffff;    background-color: #ec0002;}

.viewer-element .ck-promo .ck-promo-wrapper button:hover,
.viewer-element .ck-promo .ck-promo-wrapper button:focus,
.viewer-element .ck-resume-promo .ck-promo-element button:hover,
.viewer-element .ck-resume-promo .ck-promo-element button:focus,
.viewer-element .ck-total .ck-promo-element button:hover,
.viewer-element .ck-total .ck-promo-element button:focus,
.viewer-element .login .login-btn:hover,
.viewer-element .login .login-btn:focus,
.viewer-element a.ck-btn:hover,
.viewer-element a.ck-btn:focus,
.viewer-element button.ck-btn:hover,
.viewer-element button.ck-btn:focus {
    background-color: #990001;    color: #ffffff;    font-size: 15px;}
.viewer-element .ck-product .ck-product-btn-quantity:hover,
.viewer-element .ecommercebundle-detail .ecommercebundle-detail-quantity-button:hover {
    background-color: #990001;    color: #ffffff;}

/* ------------------------
// BUNDLE - social network
 ------------------------ */
// social network - mosaic view
.viewer-element .socialnetwork-element .socialnetwork-element-content,
.viewer-element .socialnetwork-element .socialnetwork-element-title {
     font-size: 15px;     color: #990001;}

/* social network - list view */
.viewer-element .socialnetwork-list-loader {
    border-top-color: #ec0002;
}

.viewer-element .socialnetwork-element .socialnetwork-element-content,
.viewer-element .socialnetwork-element .socialnetwork-element-title {
     font-size: 15px;     color: #990001;}
.viewer-element .socialnetwork-list .socialnetwork-list-button {
     font-size: 15px;      color: #ffffff;         background-color: #ec0002;
    border-color: #ec0002;
    }
.viewer-element .socialnetwork-list .socialnetwork-list-button:hover,
.viewer-element .socialnetwork-list .socialnetwork-list-button:focus {
    background-color: #990001;
    border-color: #990001;
}

/* ------------------------
// ACCORDION
------------------------ */
.viewer-element .accordion_element .panel-title .panel-button {
    font-size: 15px;    color: #4a4a4a;}
.viewer-element .accordion_element .panel-title .panel-button:hover {
    color: #ec0002;
}
.viewer-element .accordion_element .panel-body {
    font-size: 15px;    color: #4a4a4a;}

/* ------------------------
// NEW HEADER
// NEW HEADER - top header
------------------------ */
            .viewer-element .is-scrolling .header-new--classic-scroll-fixed .header-top,
    .viewer-element .is-scrolling .header-new--classic-scroll-fixed .header-top-nav-element ul,
    .viewer-element .is-scrolling .header-new--burger-scroll-fixed .header-top,
    .viewer-element .is-scrolling .header-new--burger-scroll-fixed .header-top-nav-element ul {
        background-color: #fe0103;
    }
        .viewer-element .header-top .header-top-nav-link {
                    }
    .viewer-element .header-top .header-top-nav-link.active,
    .viewer-element .header-top .header-top-nav-link:focus,
    .viewer-element .header-top .header-top-nav-link:hover {
                    }
        
        
/* ------------------------
// NEW HEADER - main header
------------------------ */
    
    
    
    
    
    .viewer-element .header-main .header-main-nav-link {
                    }
    .viewer-element .header-main .header-main-nav-link:focus,
    .viewer-element .header-main .header-main-nav-link:hover,
    .viewer-element .header-main .header-main-nav-link.active {
                    }
                        
.viewer-element body {
            background-position: top center;
}
#site {width: 100%;}

.main-header.menu-header-element .navbar-nav>li {
  font-weight: bold !important;}

.top img {margin-top: 10px;}
.top {
	position: fixed;
    z-index: 2;
	width: 55px;
	height: 55px;
	bottom: 15px;
	right: 10px;
	background-color: #ec0002;
	font-size: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	visibility: hidden;
	transition: 0.8s;
	opacity: 0;}

.top a::after{ visibility: hidden;}
.top a:hover::after { visibility: hidden;}
.top.voirBt {
	visibility: visible;
	opacity: 1;}


/*CSS 24 FEVRIER PAGE NOS PROJETS*/

.lightboxOverlay {
  background-color: transparent !important;}

.categories-projets {position: fixed ; z-index:2;}
.categories-projets a:focus {font-weight : 900;}
.categories-projets a:active {font-weight : 900;}

.prestations-call:hover > .zone-a-figure .zone-a-image {transform: scale(1.2) !important; }
.prestations-call > .zone-a-figure .zone-a-image {
  -webkit-transition: 0.9s;}


.nos-projets-description a:hover {color: #4a4a4a !important;}


/* LIGHTBOX 100% */

.lb-image {
  height: auto !important;
      margin-top: -50px !important;
    width: 1400px !important;
}


/*Galerie site entier*/
.image-box img {
    max-width: 100%;
    transition: all 0.3s;
    display: block;
    width: 100%;
    height: auto;
    transform: scale(1);
}

.image-box img { display: block;  overflow: hidden;  z-index: 99;}
.image-box:hover img {
    transform: scale(1.1);
}


/* Général - Typos */
h2 {line-height: 30px;}
a:hover {text-decoration : none;}
.titre-acc1 {margin-top: 0px !important;}

/* Général - Template D */
.viewer-element .zone-d .zone-d-content {width: 60% !important;}
.viewer-element .zone-d .zone-d-media-image {
  margin-left: 110px;
  width: 70% !important;}

/* Général - Marge bottom sous template A*/
.viewer-element .zone-a.marges-test {margin-bottom: 20px !important;}

/* Général - Marges */
.viewer-element .zone-a.zn-not-marg{
	padding-left: 0px !important;
	padding-right: 0px !important;
	margin-bottom: 0px !important;}

.col-sm-4 {
	padding-left: 0px !important;
	padding-right: 0px !important;}
.col-sm-8 {
	padding-left: 0px !important;
	padding-right: 0px !important;}

.marges {
	margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 0px !important;}

.marges2 {
	margin-left: 60px;
	margin-right: 60px;
	margin-bottom: 0px !important;}

.marges-top-bottom {
	margin-left: 50px;
	margin-right: 50px;
	margin-bottom: 60px;
	margin-top: 70px;}

.padding {
  	padding-left: 80px;
	padding-right: 80px;
	margin-bottom: 0px !important;}

/* Header - Menu superposé */
.menu-up {
  	width: 100%;
  	height: 123px;
  	position: absolute;
	z-index: 99;}

/* Header */
.header {height: 650px !important;}

.header2 {height: 750px !important;}

/* Accueil header - Slider fade photos*/
#slider {position: relative;}
#slider img {
    position: relative;
    z-index: 1;
    opacity:1;
    transition: opacity 0.5s;
    background-color: black;
  	width: 100%;}
#slider.fadeOut-animation img:first-child {opacity: 0;}
#slider img:nth-child(2n) {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;}

#slider.fadeOut {opacity:0.1;}

/* Page accueil - Photos */
.photo1 {height: 650px;}
.photo2 {height: 300px;}

/* Page accueil - Texte bas */
.accueil-desc h3 {
	line-height: 27px !important;
	font-size: 19px !important;}

/* Titre page Agence / Le Houedec */
.titre {
    padding-bottom: 50px;
	padding-left: 110px;}

/* Page catalogue - Bouton retour */
.viewer-element .item .btn-retour {
    position: relative;
    background-color: #ec0002;
    padding: 7px;
    color: #ffffff;}

.viewer-element .item .btn-retour:hover {color: #ffffff !important;}

/* Catalogue */
.category-filters {margin: 150px 0 20px;}
.col-md-9.col-xs-12 {margin-top: 130px !important;}
.container.item-page{margin-top: 130px !important;}
.item-detail h1 {
	color: #4a4a4a !important;
	font-size: 18px!important;
	line-height: 30px!important;
	margin-bottom: 20px!important;} 

.page-catalog-list h1 {
	color: #4a4a4a !important;
	font-weight: bold;
  	font-size: 25px!important;}

.page-catalog-list .item-title a {font-size: 3px !important;}

/* Actualités - Page détail */
.legended-picture {margin-bottom: 0px;}
.viewer-element .page-article {margin-top: 150px;}
.viewer-element .page-article h1 {
	font-size: 30px;
	margin-left: 20px;
	color: #4a4a4a !important}
.viewer-element .btn-default-link:not(input) {margin-left: 20px;}

.viewer-element .article-new .article-new-menu-content { 
 	background-color: #ec0002;
	margin-top: 82px;}
.viewer-element .article-new .article-new-menu-content a { color: #ffffff;}
.viewer-element h2, .viewer-element .title-lvl-2 {font-size: 15px !important;}
.viewer-element .article-new .article-new-menu-list-element a {font-size: 15px !important;}
.viewer-element .article-new .article-new-menu-list-element a:hover {color: #990001 !important;}

/* Push projets */
.projets a {font-size:20px !important;}
.projets {height: 350px !important;}

/* Contact - Coordonnées (liens) */
.marges-test a, .marges-test a:hover, .marges-test a:focus 
{text-decoration: none !important;
 font-size: 16pt !important;
 color: #ec0002 !important;}

/* Footer */
.footer a {font-size:12px !important;}


/*_________ Responsive tablette PRO _________ */
@media all and (min-width: 1024px) and (max-width: 1308px) {

  /*HEADER*/
  .logo-alh-header {margin-left: -100px !important;}
  .navbar-nav>li>a {line-height: 0px !important;}
  
  .menu-alh {margin-top: 25px !important;
    margin-left: -58px !important;}
  
  .main-header.menu-header-element .navbar-nav li>a {
    font-size: 12px !important;}
  
  /*GENERAL*/
  .titre-header {padding-left: 60px !important;}
  .titre-header h2 {margin-top: -10px !important;}
  .titre-general-page {margin-left: 50px !important;}
  
  /*Actu*/
  .titre {padding-left: 0px !important;}
  .article-new-menu-content {position: inherit !important;}
  
  /*contact*/
  .zone-cooronnees , .map {margin-left: -40px !important;}
  .nos {margin-left: -10px !important;}

  /* realisation */ 
  
  .titreal {margin-left: 40px !important;}
    .auto img { max-width: 100% !important;
    height: auto !important;}
}

/*---------------- tablette IPAD --------------*/ 
@media all and (min-width: 768px) and (max-width: 1023px) {

  .carre {width: 80px !important;
    height: 80px !important;}
.titre-header {margin-top : 40px !important;}
.titre-header h2 {margin-top: -18px !important;}
  
  
  /*Accueil*/
  .accueil-desc {
    margin-left: -280px !important;
    margin-top: 0px !important;}
  
  /*Contact*/
  .nos {margin-left: -32px !important;}
  
  /*Actualités*/
  .viewer-element .article-new .article-new-menu-content {
    margin-top: 0px !important;}
  .article-new-menu-content {position: inherit !important;}

  
  .actu-bloc {padding-right: 0px !important;}
  
.main-header.menu-header-element .navbar-nav li>a {
    font-size: 14px !important;}

  .logo-alh-header {margin-top: 70px !important;
    margin-left: -150px;}
  
  .logo-alh-header img {height: 50px !important;}
  /* Fond menu header hover */
nav.menu-header-element .navbar-collapse {background-color: #ffffff !important;}
  
  /* realisations */
  .titreal {margin-left: -80px !important;}
    .auto img { max-width: 100% !important;
    height: auto !important;}

}

/* telephone */ 

@media only screen and (max-width: 767px) {
  
  .logo-alh-header {margin-left: 50px !important;}
  .titre-header {margin-left: 20px !important;}

/* Taille typo H1 */
h1 {font-size: 32px !important;} 
  
  .viewer-element .title-lvl-1 {font-size: 32px !important;}

/* Fond menu header hover */
nav.menu-header-element .navbar-collapse {background-color: #ffffff !important;}
  
/* Slider page accueil */
#slider img {width: 230%;}
  
/* Général - Marges */
.marges {
	margin-left: 10px;
	margin-right: 10px;}
  
.marges-top-bottom {
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 20px;
	margin-top: 20px;}
  
.padding {
  	padding-left: 0px;
	padding-right: 0px;
	margin-bottom: 0px !important;}

/* Header toutes pages */
.header {height: 450px !important;}  
.titre-general-page {margin-left: 20px !important;}
 
/* Carré accueil */
.carre img{
  	width: 20%;
	height: 20%;}

/* Titre page Agence / Le Houedec */   
.titre {
    padding-bottom: 0px;
	padding-left: 20px;}  

  .actu-bloc {padding-left: 0px !important; padding-right: 30px !important; margin-right: 0px !important;}

  
  /*Actualités*/
  .actu-bloc {padding-right: 0px !important;}
  .viewer-element .article-new .article-new-list {    width: 103% !important;}
  .article-new-menu-content {
    margin-top: 0px !important;
    margin-right: -18px !important;}
  .article-new-menu-content {position: inherit !important;}


  /*Alain Le Houedec*/
 .viewer-element .zone-f .zone-f-media {width: 100% !important;}
  .viewer-element .zone-f .zone-f-content-text {width: 100% !important;}
  
/* realisations*/
  .auto img { max-width: 100% !important;
    height: auto !important;}

}