/* ------------------ Ajustements de résolutions responsive ----------------------	*/

/* ------------------ mobile : 10px > 767px ----------------------	*/

@media (min-width: 10px) and (max-width: 767px) {
    header.site-header {
        grid-template-columns: 1fr;
        padding-bottom: 85px;
    }

    .site-logo {
        margin-bottom: 10px;
    }

    .main-navigation {
        grid-column: 1 / span 6;
        font-size: 20px;
    }

    #navbar-toggle {
        display: inline-block;
    }

    .menu-menu-principal-container {
        display: none;
    }

    #site-footer .menu-menu-principal-container {
        display: block;
    }

    .menu-menu-principal-container.visible {
        display: block;
        padding: 0 20px 20px 20px;
    }

    ul.menu li {
        display: block;
        margin: 3px 8px;
    }

    ul.menu-principal,
    ul.menu-principal>li,
    ul.menu-principal>li>a {
        display: block;
        text-align: center;
    }

    .menu-item-has-children>.sub-menu {
        position: static;
    }

    .menu-item-has-children>.sub-menu>li {
        margin: 3px 0;
        display: block;
        text-align: center;
    }

    .menu-item-has-children>.sub-menu>li a {
        margin: 0 auto;
        width: 100%;
        text-align: center;
        font-size: 16px;
    }

    .menu-item-has-children>a::after {
        border-top: 6px solid var(--color-4);
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        border-bottom: 0;
        margin: 0 0 3px 8px;
    }

    .menu-item-has-children.open>a::after {
        border-right: 4px solid transparent;
        border-bottom: 6px solid var(--color-4);
        border-left: 4px solid transparent;
        border-top: 0;
        margin: 0 0 3px 8px;
    }

    .menu-item-has-children.current-menu-ancestor>a::after {
        border-top: 6px solid var(--color-2a);
    }

    .menu-item-has-children.current-menu-ancestor.open>a::after {
        border-bottom: 6px solid var(--color-2a);
    }

    .articles-colonnes {
        grid-template-columns: 1fr;
    }

    .container {
        padding: 0;
    }

    .container.site-content {
        padding: 0 0 10px 0;
    }

    #site-footer {
        grid-template-columns: 1fr;
    }

    #rappel-menu {
        margin: 0 0 0 25px;
        padding: 0;
        text-align: center;
    }

    #site-footer .site-logo {
        padding: 100px 20px 60px 20px;
        background: url(img/logo-footer.webp) no-repeat top 15px center;
    }

    #rappel-menu li {
        display: block;
        margin-bottom: 15px;
    }

    #rappel-menu li a {
        font-size: 16px;
    }

    #rappel-menu .menu-item-has-children>ul.sub-menu>li>a {
        font-size: 15px;
    }

    .articles-liste .article {
        display: block;
    }

    .page .content-area {
        padding: 10px;
    }

    .home .zone-slider {
        margin-right: 0;
    }

    .home .accueil-presentation {
        grid-template-columns: 1fr;
        margin-right: 0;
        padding: 10px;
    }

    .contenu-accueil h2,
    .competences h2,
    .actualites h2,
    .zone-agenda h2 {
        display: block;
        margin: 0 0 20px 0;
        text-align: center;
        position: static;
    }

    .home #main .competences {
        padding: 40px 10px;
    }

    .home #main .competences .blocs {
        grid-template-columns: 1fr;
        margin-top: 0;

        h3 {
            font-size: 26px;
			line-height: 1.1;
        }

        p {
            font-size: 16px;
        }
    }

    .home #main .competences .blocs .bloc .textwidget {

    }
	    .home #main .competences .blocs .bloc:not(:hover) .textwidget {
        transform: translateY(calc(100% - 80px));
    }

    .home #main .competences .bloc .textwidget p.suite a {
        font-size: 14px;
    }

    .home #main .actualites {
        padding: 20px 10px;
    }

    .home #main .actualites .bloc-article,
    .articles-rangees .bloc-article {
        grid-template-columns: 1fr;
        margin: 30px 0;
    }

    .actualites .voir-tout,
    .zone-agenda .voir-tout {
        position: static;
    }

    .actualites .content-area .entry-content {
        max-width: 100%;
    }

    .home #main .zone-agenda {
        padding: 20px;
    }

    .home .zone-actus {
        grid-template-columns: 1fr;
    }

    .page:not(.home) .actualites #main.visuel h1:first-child {
        margin: 0;
        bottom: 0;
        padding: 10px 30px;
    }

    .page:not(.home) #main.actualites h1:first-child {
        margin: 40px 0 0 40px;
    }

    .page:not(.home) .actualites .articles-rangees {
        padding: 0 20px;
    }

    .page:not(.home) .actualites .articles-rangees .article {
        padding: 0 20px;
    }

    .page .actualites .articles .vignette img {
        width: 100%;
    }

    .page #main.accueil-formations .wp-block-group:first-child>div::before {
        right: 0px;
    }

    .page #main.accueil-formations .colonnes-formations {
        margin: 0 40px 70px 40px;
        padding-top: 20px;
        height: auto;
        overflow: visible;
    }

    #main.accueil-formations .colonnes-formations p {
        opacity: 0.8;
    }

    #main.accueil-formations .colonnes-formations p.lien-suite {
        padding: 0 0 30px 0;
    }

    .wp-block-group.marge-droite,
    .wp-block-group.marge-gauche {
        margin-right: 0;
        margin-left: 0;
        padding-left: 10px;
        padding-right: 10px;
    }

    .wp-block-group.marge-gauche .bloc-texte,
    .wp-block-group.marge-droite .bloc-texte,
    .wp-block-group.marge-gauche.lier-blocs .bloc-texte,
    #main.accueil-formations .wp-block-group ol>div>h2+p.bloc-texte {
        margin: 0;
        padding: 15px 30px;
    }

    .page #main.accueil-formations .wp-block-group:first-child::before {
        height: 350px;
        background: url(img/visuel-formations.webp);
        left: 0;
        right: 0;
        background-size: cover;
    }

    .page #main.accueil-formations .colonnes-formations {
        margin: 0 20px 70px 20px;
    }

    .page #main.accueil-formations .wp-block-group:first-child>div::before {
        display: block;
        position: relative;
        width: 100%;
    }

    .page #main.accueil-formations div.wp-block-group.rayures-formation p.bloc-texte,
    .page #main.accueil-formations div.wp-block-group.rayures-formation:first-child p.bloc-texte,
    .page #main.accueil-formations .wp-block-file.lien-pdf {
        margin: 0;
    }

    .page #main.accueil-formations div.wp-block-group.rayures-formation:first-child .wp-block-paragraph {
        margin: 0;
    }

    .page #main.formations-continues,
    .page #main.formations-diplomantes {
        padding: 10px 10px 20px 10px;
    }

    .page #main.formations-continues .visuel,
    .page #main.formations-diplomantes .visuel,
    .page .marcel-marchand #main .visuel,
    .page .septentrionales #main .visuel,
    .page .animation-regionale #main .visuel {
        top: 0;
        height: 300px;
        left: 0;
        right: 0;
    }

    .page #main.formations-continues .entry-content,
    .page #main.formations-diplomantes .entry-content {
        width: auto;
        margin: 0;
        padding: 20px;
    }

    #main.accueil-formations .wp-block-group h1,
    #main.accueil-formations .wp-block-group h2 {
        margin: 130px 0 15px 0;
        display: block;
        text-align: center;
    }

    #main.accueil-formations .wp-block-spacer {
        height: 50px !important;
    }

    .page #main.accueil-formations div.wp-block-group.rayures-formation:first-child .wp-block-file.lien-pdf {
        margin: 0;
    }

    .wp-block-group.rayures-formation p {
        padding: 20px;
        margin: 0 10px;
    }

    .wp-block-group.rayures-formation ul {
        padding: 20px 20px 20px 25px;
        margin: 0 10px;
    }

    .single #main {
        padding: 15px;
    }

    .single .container.site-content,
    .page .container.site-content {
        padding: 0 0 20px 0;
    }

    .single .container.site-content>.visuel {
        margin: 0;
        position: static;
        height: auto;
    }

    .page .container.site-content>.visuel {
        margin: 0;
    }

    .page.page-template-default .container.site-content .visuel {
        right: 0;
        margin-top: 0px;
        margin-left: 0px;
        margin-right: 0px;
    }

    .page.page-template-default .container.site-content #main {
        padding: 20px;
    }

    .single .container.site-content h1 {
        position: static;
        margin: 0 0 20px 0;
    }

    .single:not(.single-formations, .single-droitsantetravail) .container.site-content article {
        margin-top: 0px;
    }

    .single:not(.single-formations, .single-droitsantetravail) .container.site-content article {

        .entry-content,
        .entry-meta {
            padding: 0 20px;
        }
    }

    .single .posted-on {
        margin-left: 20px;
    }

    .page:not(.home) #main,
    .single #main,
    .archive #main {
        padding: 0;
    }

    .page #main.formations-continues::before,
    .page #main.formations-diplomantes::before {
        right: -10px;
        left: -10px;
    }

    .page #main.formations-continues .page-header h1,
    .page #main.formations-diplomantes .page-header h1 {
        display: block;
        text-align: center;
    }

    .page #main.formations-continues .logo,
    .page #main.formations-diplomantes .logo {
        position: relative;
        width: 100%;
    }

    .page #main.formations-diplomantes .page-header h1 {
        margin: 105px 0 0 0;
    }

    .page #liste-formations .article-accordeon ul.colonnes {
        grid-template-columns: 1fr;
        row-gap: 40px;
    }

    .page #liste-formations .article-accordeon .article-body {
        padding: 20px;
        max-height: 10px;
    }

    .page #liste-formations .article-accordeon.open .article-body {
        padding: 30 px;
    }

    .single.single-formations #main .description-formation {
        padding: 0 10px 40px 10px;

        .colonnes {
            grid-template-columns: 1fr;
        }

        .visuel.vide {
            background: url(img/visuel-formations.webp) right;
        }

        .visuel {
            left: 0;
        }

        .logo {
            right: 0;
            height: 200px;
            background: no-repeat url(img/Logo-ISTNF-Formation-Sante-Travail.webp) center top 15px / 230px auto;
        }

        .gauche {
            border-right: 0 !important;
            padding: 0 20px;
        }

        .droite {
            padding: 0 20px;
        }
    }

    .single.single-formations #main .formation-categories {
        grid-template-columns: 1fr;
    }

    .single.single-formations #main .formation-categories .formation-categorie a {
        right: 0;
    }

    .single.single-formations #main .description-formation h1 {
        padding: 20px;
    }

    .single.single-formations #main .details,
    .single.single-formations #main .programme {
        padding: 0;
        margin: 30px;
    }

    .programme ul {
        padding-left: 20px;
    }

    .page .droit-sante-travail #main h1.page-header {
        margin: 0;
        bottom: -20px;
    }

    #compte-droit-sante-travail {
        grid-template-columns: 1fr;
    }

    .page #dernieres-publications {
        padding: 0 20px 40px 20px;
    }

    .page #dernieres-publications h2:first-child {
        margin: 0;
        top: -20px;
    }

    .page .droit-sante-travail #main div.fond-rayures {
        padding: 0 10px 40px 10px;
        margin-right: 0;
    }

    .page .droit-sante-travail #main .visuel {
        height: 350px;
        position: static;
        margin-left: -10px;
        margin-right: -10px;
        top: 0;
    }

    .page .droit-sante-travail #main .entry-content {
        padding: 40px 20px;
        margin: 0;
    }

    #compte-kalipso {
        grid-template-columns: 1fr;
        margin: 60px 20px 80px 20px
    }

    .page #zone-documents-categories,
    .page #zone-actus-agenda {
        grid-template-columns: 1fr;
    }

    .page .droit-sante-travail .categories-droit-sante-travail {
        padding-top: 40px;
    }

    .page .droit-sante-travail .zone-recherche {
        padding: 20px;
    }

    .page .droit-sante-travail .zone-recherche::before {
        top: 60px;
        height: 160px;
    }

    .page .droit-sante-travail #zone-actus-agenda {
        grid-template-columns: 1fr;
    }

    .page .droit-sante-travail #zone-actus-agenda .actualites,
    .agenda-droit.zone-agenda {
        padding: 20px;
    }

    .page .droit-sante-travail #zone-actus-agenda .actualites .bloc-article {
        grid-template-columns: 1fr;
    }

    .page .droit-sante-travail #zone-actus-agenda .actualites .bloc-article .article {
        padding: 0 20px 20px 20px;
    }

    .single-droitsantetravail .container.site-content {
        padding: 10px;
    }

    .single-droitsantetravail #main {
        padding: 20px;
    }

    .single-droitsantetravail .categories-droit-sante-travail li {
        max-width: none;
        width: 100%;
    }

    .single-droitsantetravail .categories-droit-sante-travail li a {
        margin: 0 0 5px 0;
    }

    .single-droitsantetravail .container.site-content .page-header {
        margin: 0 -20px 40px -20px;
    }

    .archive.tax-categories_droitsantetravail #main {
        padding: 15px;
    }

    .tax-categories_droitsantetravail .categories-droit-sante-travail li {
        display: block;
        max-width: none;
        width: 100%;
        margin-top: -1px;
    }

    .page .actualites .content-area .visuel {
        position: relative;
        left: 0;
        bottom: 80px;
        top: 0;
    }

    .wpcf7-form>p {
        flex-direction: column;
        gap: 5px;
    }

    .wpcf7-form>p label, .wpcf7-form>p .wpcf7-form-control-wrap {
        width: 100%;
    }
}


/* ------------------ tablettes : 768px > 990px ----------------------	*/


@media (min-width: 768px) and (max-width: 990px) {
    .articles-colonnes {
        grid-template-columns: 1fr 1fr;
    }

    .articles-liste .article {
        grid-template-columns: 40% 1fr;
    }

    .home .accueil-presentation {
        grid-template-columns: 1fr;
        margin-right: 0;
        padding: 70px 10px;
    }

    .home #main .competences .blocs {
        grid-template-columns: 1fr 1fr;

        h3 {
            font-size: 20px;
        }

        p {
            font-size: 16px;
        }

        .textwidget {
            min-height: 280px;
        }
    }

    .home #main .competences .blocs .bloc:not(:hover) .textwidget {
        transform: translateY(calc(100% - 75px));
    }

    .page #main.formations-continues .logo,
    .page #main.formations-diplomantes .logo {
        background: no-repeat url(img/Logo-ISTNF-Formation-Sante-Travail.webp) right 15px top 5px / 170px auto;
    }
	
	.page .droit-sante-travail #main .entry-content {
        padding: 40px 20px;
        margin: 0 150px 0 0;
    }
	
	.page .droit-sante-travail #zone-actus-agenda .actualites .bloc-article {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 15px;
		.article { padding-bottom: 10px; }
		h3 { font-size: 16px; }
		.suite { font-size: 14px; }
	}
	
}


/* ------------------ desktop : 991px > 1200px ----------------------	*/

@media (min-width: 991px) and (max-width: 1200px) {
    .articles-liste .article {
        grid-template-columns: 30% 1fr;
    }

    .home #main .competences .blocs .bloc:not(:hover) .textwidget {
        transform: translateY(calc(100% - 55px));
    }

    .home #main .competences .blocs .bloc .textwidget {
        padding: 8px 10px;
    }

    .home #main .competences .blocs h3 {
        font-size: 16px;
        margin: 2px 0;
        padding: 0 0 5px 0;
        line-height: 1.1;
    }

    .home #main .competences .bloc .textwidget p.suite a {
        margin: 0;
    }
}


/* ------------------ desktop large : 1201px >  ----------------------	*/


@media (min-width: 1201px) {}