/*** STYLE du THEME ***/

/********************/
/******* VAR ********/
/********************/
:root {
    /* COULEURS */
    --wh: #ffffff;
    --blk: #32373B;
    --kate: #0016b7;
    --grisf: #2F2310;
    --grismed: #DCDBD9;
    --grisc: #F3F3F3;
    --orangef: #C65100;
    --orangec: #F4DDCD;

    /* RADIUS */
    --rad90: 90px;
}


/********************/
/******* LIENS ******/
/********************/
a:link {
    color: var(--grisf);
}
a:visited {
    color: var(--grisf);
}
a:active,
a:hover {
    color: var(--grisf);
}


/********************/
/****** POLICES *****/
/********************/
/* epilogue-regular */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Epilogue';
    font-style: normal;
    font-weight: 400;
    src: local(''),     /* IE9 Compat Modes */
        url('../fonts/epilogue/epilogue-v20-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
        url('../fonts/epilogue/Epilogue-Regular.woff') format('woff'),
        url('../fonts/epilogue/Epilogue-Regular.eot') format('eot'),
        url('../fonts/epilogue/Epilogue-Regular.ttf') format('ttf');
}

/* epilogue-italic */
@font-face {
    font-display: swap;
    font-family: 'Epilogue';
    font-style: italic;
    font-weight: 400;
    src: local(''),
        url('../fonts/epilogue/epilogue-v20-latin-italic.woff2') format('woff2'),
        url('../fonts/epilogue/Epilogue-Italic.woff') format('woff'),
        url('../fonts/epilogue/Epilogue-Italic.eot') format('eot'),
        url('../fonts/epilogue/Epilogue-Italic.ttf') format('ttf');
}

/* epilogue-500 medium */
@font-face {
    font-display: swap;
    font-family: 'Epilogue';
    font-style: normal;
    font-weight: 500;
    src: local(''),
        url('../fonts/epilogue/epilogue-v20-latin-500.woff2') format('woff2'),
        url('../fonts/epilogue/Epilogue-Medium.woff') format('woff'),
        url('../fonts/epilogue/Epilogue-Medium.eot') format('eot'),
        url('../fonts/epilogue/Epilogue-Medium.ttf') format('ttf');
}

/* epilogue-500italic medium */
@font-face {
    font-display: swap;
    font-family: 'Epilogue';
    font-style: italic;
    font-weight: 500;
    src: local(''),
        url('../fonts/epilogue/epilogue-v20-latin-500italic.woff2') format('woff2'),
        url('../fonts/epilogue/Epilogue-MediumItalic.woff') format('woff'),
        url('../fonts/epilogue/Epilogue-MediumItalic.eot') format('eot'),
        url('../fonts/epilogue/Epilogue-MediumItalic.ttf') format('ttf');
}


/**************/
/*** BASICS ***/
/**************/
body {
    font-family: 'Epilogue', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: var(--blk);
}
h1, h2, h3, h4, h5, h6 {
    display: block;
}


/********************/
/**** STRUCTURE *****/
/********************/
.widzlarge {
    width: 1728px;
    margin-right: auto;
    margin-left: auto;
}
.widzmain {
    width: 1228px;
    margin-right: auto;
    margin-left: auto;
}


/*** TITLES ***/
/**************/
.classic_title_h2_white,
.classic_title_h3_white,
.classic_title_h4_white{
    color: var(--wh);
}
.classic_title_h2_orangef {
    color: var(--orangef);
}

/*** BUTTONS ***/
/***************/
.classic_btn_white,
.classic_btn_orange,
.classic_btn_black {
    position: relative;
    width: fit-content;
}
.classic_btn_white a,
.classic_btn_orange a,
.classic_btn_black a {
    position: relative;
    display: inline-block;
    padding: 11px 50px 11px 25px;
    font-size: 15px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    text-decoration: none;
    border-radius: 30px;
    transition: all 0.3s;
    z-index: 2;
}
.classic_btn_white a {
    color: var(--wh);
    border: 1px solid var(--wh);
}
.classic_btn_orange a {
    color: var(--orangef);
    border: 1px solid var(--orangef);
}
.classic_btn_black a {
    color: var(--grisf);
    border: 1px solid var(--grisf);
}
.classic_btn_white:hover a {
    color: var(--orangec);
    border: 1px solid var(--orangec);
    transition: all 0.3s;
}
.classic_btn_orange:hover a {
    color: var(--grisf);
    border: 1px solid var(--grisf);
    transition: all 0.3s;
}
.classic_btn_black:hover a {
    color: var(--orangef);
    border: 1px solid var(--orangef);
    transition: all 0.3s;
}
.classic_btn_white::after,
.classic_btn_white::before,
.classic_btn_orange::after,
.classic_btn_orange::before,
.classic_btn_black::after,
.classic_btn_black::before {
    position: absolute;
    content: '';
    width: 30px;
    height: 30px;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s;
    z-index: 1;
}
/* ::before = icône hover (cachée par défaut) */
/* ::after  = icône par défaut (visible par défaut) */
.classic_btn_white::after {
    background: url(../img/classic_btn_white_arrow.svg) no-repeat;
    opacity: 1;
}
.classic_btn_white::before {
    background: url(../img/classic_btn_orangec_arrow.svg) no-repeat;
    opacity: 0;
}

.classic_btn_orange::after {
    background: url(../img/classic_btn_orangef_arrow.svg) no-repeat;
    opacity: 1;
}
.classic_btn_orange::before {
    background: url(../img/classic_btn_black_arrow.svg) no-repeat;
    opacity: 0;
}

.classic_btn_black::after {
    background: url(../img/classic_btn_black_arrow.svg) no-repeat;
    opacity: 1;
}
.classic_btn_black::before {
    background: url(../img/classic_btn_orangef_arrow.svg) no-repeat;
    opacity: 0;
}

/* Au hover : on inverse les opacités */
.classic_btn_white:hover::after,
.classic_btn_orange:hover::after,
.classic_btn_black:hover::after {
    opacity: 0;
    right: 15px;
    transition: all 0.3s;
}
.classic_btn_white:hover::before,
.classic_btn_orange:hover::before,
.classic_btn_black:hover::before {
    opacity: 1;
    right: 15px;
}



/*******************/
/**** CLASSICS *****/
/*******************/
.bloc_seo,
.classic_content_01,
.classic_content_02,
.classic_content_03 {
    margin-bottom: 23px;
    overflow: hidden;   /* pour que les img en float soient comprises dans la section */
}


/**********************/
/**** PAGE-HENTRY *****/
/**********************/
.page_hentry h1,
.classic_title_h1 {
    font-size: 56px;
    font-style: normal;
    font-weight: 400;
    line-height: 59px;
}
.page_hentry h2,
.classic_title_h2,
.classic_title_h2_white,
.classic_title_h2_orangef {
    font-size: 36px;
    font-style: normal;
    font-weight: 400;
    line-height: 43px;
    margin-bottom: 14px;
}
.page_hentry h3,
.classic_title_h3,
.classic_title_h3_white {
    font-size: 22px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    margin-bottom: 16px;
}
.page_hentry h4,
.classic_title_h4,
.classic_title_h4_white {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    margin-bottom: 12px;
}
.page_hentry p {
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 25px;
    margin-bottom: 27px;
}
.page_hentry p:has(a) {
    position: relative;
    display: inline-block;
    transition: all 0.3s ease;
}
.page_hentry p:has(a) a:hover {
    text-decoration: unset !important;
    color: var(--wh);
    background-color:var(--orangef);
    transition: all 0.3s ease;
}
.page_hentry ul {
    padding: 0;
    margin: 0 0 27px;
}
.page_hentry ul li {
    position: relative;
    line-height: 27px;
    padding: 0 0 0 14px;
    margin: 0;
}
.page_hentry ol {
    list-style: decimal;
    margin-left: 20px;   /* pour l’indentation */
}
.page_hentry ol li {
    line-height: 26px;
    list-style-type: decimal;
}
.page_hentry ul li:before {
    position: absolute;
    content: '';
    width: 4px;
    height: 4px;
    top: 11px;
    left: 1px;
    background: var(--grisf);
    border-radius: var(--rad90);
}
.page_hentry img {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 603px;
    border-radius: 5px;
}
.page_hentry p:has(.alignleft):has(.alignright) > img.alignleft,
.page_hentry p:has(.alignleft):has(.alignright) > img.alignright {
    width: 49% !important;
    margin: 0 0 32px;
}
.page_hentry p.wp-caption-text {
    font-size: 12px;    /* pour les légendes d'images */
}
/* gallery-item */
.page_hentry .gallery dl {
    flex: 1;
    margin-top: 0 !important;
}
.page_hentry .gallery dl dt {
    height: 603px;
}
.page_hentry .gallery dl dt a img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: unset !important;
}

/* TABLES */
.page_hentry figure {
    margin: 32px 0 42px;
}
.page_hentry table {
    border: 2px solid var(--orangef);
    border-radius: 13px;
    border-collapse: separate !important;
}
.page_hentry table thead tr th {
    box-sizing: border-box;
    padding: 20px 24px;
    text-align: center;
    border-right: 1px solid var(--grisf);
    border-bottom: 2px solid var(--grisf);
}
.page_hentry table tbody tr td {
    box-sizing: border-box;
    padding: 15px 27px;
    border-right: 1px solid var(--grisf);
    border-bottom: 1px solid var(--grisf);
}
.page_hentry table thead tr th:last-child,
.page_hentry table tbody tr td:last-child {
    border-right: none;
}
.page_hentry table tbody tr:last-child td {
    border-bottom: none;
}


/**************************/
/* Bouton MENU Responsive */
/**************************/
#navtop_bt {
    display: none;
    position: absolute;
    width: 36px;
    height: 27px;
    background-color: var(--grisf);    /* couleur de mes barres horizontales */
    top: 11px;
    right: 35px;
    cursor: pointer;
    z-index: 888;
}
#navtop_bt.bt_navtop_hover {
    background-color: var(--orangec) !important;
}
.navtop_bt_span {
    position: relative;
    display: block;
    width: 36px;
    height: 1px;
    margin: auto;
    background: var(--grisf);
}
.navtop_bt_span:last-of-type {
    background: linear-gradient(to left, transparent 50%, var(--grisf) 50%);
}
.bt_navtop_hover .navtop_bt_span:first-of-type {
    transform: rotate(-45deg);
    top: 9px;
    background-color: var(--grisf) !important;
}
.bt_navtop_hover .navtop_bt_span:nth-child(2) {
    display: none;
}
.bt_navtop_hover .navtop_bt_span:last-of-type {
    transform: rotate(45deg);
    top: -4px;
    background-color: var(--grisf) !important;
}
.bt_navtop_hover .navtop_bt_span {
    background: none;
    transition: all 0.3s;
}

/******************/
/*** BREADCRUMB ***/
/******************/
#breadcrumb_content{
    display: block;
    font-size: 0;
    line-height: 20px;
    padding: 20px 0 33px;
}
.breadcrumb_item {
    display: inline-block;
    font-size: 12px;
    color: var(--grisf);
}
.breadcrumb_item:last-of-type {
    color: var(--orangef);
}
.breadcrumb_item:not(:last-of-type):after{
    content: '';
    display: inline-block;
    height: 2px;
    width: 2px;
    margin: 0 4px 0 2px;
    background-color: var(--grisf);
    border-radius: 90px;
}
.breadcrumb_item a{
color: var(--blk);
text-decoration: none;
}
.breadcrumb_item a:hover{
text-decoration: underline;
}