/* basics */

.body-editmode section[data-qsedit].qs-edit-in > .qs-menu,
.body-editmode section[data-qsedit].qs-edit-out > .qs-menu,
.body-editmode section[data-qsedit].qs-edit-top > .qs-menu {
    margin-left: 80px !important;
}


html, body {
    min-height: 100%;
    height: 100%;
}

body.mce-content-body {
	padding: 15px;
    height: auto;
    min-height: auto;
}

b, strong {
    font-weight: 800;
}

.SystemPageTitle, .SystemTable, .SystemPageAboutSummary {
    max-width: 80%;
    margin: auto;

}

.SystemPageTitle {
    padding: 50px !important;
    margin: 50px auto 50px auto;
}

.navbar {
    z-index: 1020;
}

a:focus {
	outline: none;
}

article a:hover {
    text-decoration: underline;
}

a:hover .icon-hover {
    display: block !important;
}


.card .d-hover {
    top: 10%;
    transition: all 0.2s ease-out;   
}

.card:hover .d-hover {
    top: 0;
    opacity: 1 !important;
}

.list-group .list-group-item {
    border-color: var(--bs-primary);
}

.list-group .list-group-item:hover {
    border-top: solid 1px var(--bs-primary);
    border-color: var(--bs-primary);
    margin-top: -1px;
    transition: border-color 0.8s ease-out;
}

.list-group .list-group-item:hover {
    border-top: solid 1px var(--bs-primary);
    border-color: var(--bs-primary);
    margin-top: -1px;
}

.list-group .list-group-item {
    opacity: 0.5;
    transition: opacity 0.8s ease-out;
}


.list-group .list-group-item:hover {
    opacity: 1;
}

.tplHtmlBodyHome #carousel-header {
    height: 65vh;
    width: 100%;
}

.bg-light-hover:hover {
	background-color: #F6F6F6;
    transition: background-color .2s ease-out;
}

.body-overlay {
    background-color: var(--bs-gray);
}

.truncate-2l {
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 2.4em;
    line-height: 1.2em;
}
@media (min-width: 768px) { 
    .columns-2 {
        columns: 2;
    }

    .break-inside-avoid-column {
        -moz-column-break-inside: avoid;
        break-inside: avoid-column;
    }
}

/* .bg-custom-gradient */

.body-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    /* background: linear-gradient(110deg, rgba(98,138,199,.9) 0%, rgba(140,198,63,0.9) 130%); */
}

.body-overlay.active {
    opacity: 0.9;
    visibility: visible;
    z-index: 1001;
    transition: all 0.8s ease-out;
}

.text-shadow {
	text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.7);
}

/* system */

.SystemTable {
    text-align: left;   
}

.system-message {
    font-size: inherit;   
}

.systemfooter p {
    margin-bottom: 0rem;   
}

/* images */

img.contain {
    object-fit: contain;
    padding: 15px;
}

img.cover {
    object-fit: cover;
}

img.cover-top {
    object-position: top center;
}

img.scale-down {
    object-fit: scale-down;
}

img.none {
    object-fit: none;
}

table.table td p {
    margin-bottom: 0;
}

.bg-initial {
	background: initial;
}

.bg-cover {
	background-size: cover;
    background-position: center center;
}

.bg-contain {
	background-size: contain;
    background-position: center center;
}

.border-transparent {
    border-color: transparent !important;
}

.mt-n1px {
    margin-top: -1px;
}

/* hover, combinable avec https://animate.style/ */ 

a:hover .d-flex-hover {
	display: flex !important;
}

a:hover .d-block-hover {
	display: block !important;
}

a:hover .d-inline-block-hover {
	display: inline-block !important;
}

/* formulaires */

.g-recaptcha {
    display: inline-block;
}

.has-error .form-control {
    border-color: #fa3737;
}

.has-error .form-control-feedback {
    color: #fa3737;   
}

i.form-control-feedback {
    display: block;
    float: right;
    margin-top: -33px;
    padding-right: 10px;
    font-size: 20px;
}

/* BS4, BS5, stop stretched-link cover / hack from doc Bootstrap ABR/MBE */

.no-stretched-link {
	z-index: 2;
}

/* customs by project */

.bg-hover-primary:hover {
    background: linear-gradient(110deg, rgba(98,138,199,1) 0%, rgba(140,198,63,1) 130%) !important;
}

.bg-hover-primary:hover * {
    color: #ffffff !important;  
}

.bg-hover-primary:hover .qs-menu .dropdown-menu * {
    color: initial !important;  
}

.primary-gradient {
    background: linear-gradient(110deg, rgba(98,138,199,1) 0%, rgba(140,198,63,1) 130%);   
}

.primary-gradient article a, .primary-gradient article a:hover {
	color: #fff;
    text-decoration: underline;
}

.primary-gradient a:hover {
	opacity: 0.8;
}

.bg-light-green {
    background: #e0f2c6;
    /* background: rgb(246 250 240); */
}

.tplDphChilds .border-gradient:before {
    content: '';
    position: absolute;
    left: 0;
    width: 3px;
    height: 100%;
	background: linear-gradient(45deg, rgba(98,138,199,1) -30%, rgba(140,198,63,1) 150%);
}

.dark-opacity {
    background: rgba(0,0,0,0.75);   
}

.carousel-indicators a.active .icon {
    display: none !important;
}
.carousel-indicators a.active .icon-active {
    display: inline !important;
}
.carousel-indicators a:nth-child(2) {
	transform: rotate(45deg);
}
.carousel-indicators a:nth-child(3) {
	transform: rotate(90deg);
}
.carousel-indicators a:nth-child(4) {
	transform: rotate(135deg);
}
.carousel-indicators a:nth-child(5) {
	transform: rotate(180deg);
}
.carousel-indicators a:nth-child(6) {
	transform: rotate(225deg);
}
.carousel-indicators a:nth-child(7) {
	transform: rotate(270deg);
}
.carousel-indicators a:nth-child(8) {
	transform: rotate(315deg);
}

.tplDphDossierSpecial {
	position: absolute;
    z-index: 3;
    right: 0;
    bottom: 0;
}

.tplDphDossierSpecial a {
    display: table-caption;
}

.navbar-brand img,
.trelex-armoiries-underline,
.footer-brand img,
.trelex-armoiries-negative-underline {
    width: 40px;
    z-index: 1000;
}

.trelex-armoiries-underline,
.trelex-armoiries-negative-underline {
    height: 10px;
}

.navbar-brand span,
.footer-brand span  {
    font-size: 35px;
    font-weight: 800;
}

@media (min-width: 991px) {
    .navbar-brand span,
    .footer-brand span  {
        font-size: 40px;
    }
    .tplDphDossierSpecial {
        width: 35vw;
    }
    .body-scroll .navbar {
        width: 100%;
        position: fixed;
        top: 0px;
    }
    .body-scroll .tplMenuHBootstrap {
        padding-top: 20px !important;
    }
    header .logo {
        width: 100px;
    }
    .navbar .nav-item > a::after,
    .break-line::after,
    .break-line-footer {
        content: '';
        display: block;
        position: relative;
        height: 10px;
        border: solid 1px transparent;
        margin-bottom: -1px;
    }
    .navbar .nav-item.active > a::after,
    /* .navbar .nav-item > a:hover::after, */
    .navbar .nav-item > a:focus::after {
        border: solid 1px var(--bs-primary);
        border-bottom: solid 1px white;
        background: white;
    }
    .navbar .nav-item > a.show::after,
    .navbar .nav-item > a:focus::after {
        border: solid 1px var(--bs-primary);
        border-bottom: solid 1px var(--bs-light);
        background: var(--bs-light) !important;
        transition: background 0.8s ease-out;
    }
}

@media (max-width: 767px) { 
    .tplContextTabs h5 {
    	font-size: 14.5px;
    }
    .tplContextTabs .tab-pane small {
    	font-size: .75em !important;
    }
    #news-carousel .display-1 {
        font-size: 4rem;
    }
}

.navbar .nav-item .nav-link {
    padding-top: 25px !important;
}

.navbar .nav-item.active .nav-link,
.navbar .nav-link:hover {
    color: var(--bs-primary) !important;
}

.break-line::after,
.break-line-footer {
    content: '';
    display: block;
    position: relative;
    height: 10px;
    border: solid 1px transparent;
    margin-bottom: -1px;
}

.break-line::after {
    border: solid 1px var(--bs-primary);
    border-bottom: solid 1px white;
    background: white;
}

.break-line-footer {
    border: solid 1px white;
    border-top: solid 1px var(--bs-primary);
    background: var(--bs-primary);
}
.bg-light .break-line::after {
    border: solid 1px var(--bs-primary);
    border-bottom: solid 1px var(--bs-light);
    background: var(--bs-light);
}

.navbar .nav-item.active .nav-link,
.navbar .nav-link:hover a {
    color: var(--bs-primary) !important;
}
.navbar .dropdown-menu a {
    transition: all 0.8s ease-out;
}

.breadcrumb-item+.breadcrumb-item::before {
    color: inherit;
}

a.link-light:hover,
.card:hover img.icon-plus,
a:hover img.icon-plus {
    filter: brightness(0) saturate(100%) invert(83%) sepia(53%) saturate(2797%) hue-rotate(360deg) brightness(102%) contrast(102%);
}

.link-dark:hover {
    color: var(--bs-primary) !important;
}

.img-white {
    filter: brightness(0) saturate(100%) invert(98%) sepia(100%) saturate(0%) hue-rotate(349deg) brightness(103%) contrast(102%);
}


.icon-plus {
    height: 22px;
    width: auto;
}

.icon-chevron {
    height: 13px;
    width: auto;
}

.h1 img.icon-chevron,
h1 img.icon-chevron {
    height: 26px;
    width: auto;
    margin-bottom: 5px;
}

article ul li,
body.mce-content-body ul li {
    display: block;
	line-height: 1.2em;
    padding: 5px 0px;
}

article ul li:before,
body.mce-content-body ul li:before {
    display: inline-block;
    width: 25px;
    height: 1rem;
    content: "";
    background-image: url('/data/dataimages/upload/trelex-icon-chevron.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: left center;
    margin-left: -25px;
}

article table.table td a {
	display: inline-block;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: inherit;
}

@media (max-width: 767px) { 
    article table.table,
    article table.table tbody,
    article table.table tr,
    article table.table td {
        display: block;
        width: 100% !important;
        width: auto !important;
        height: auto !important;
        text-align: left !important;
    }
    article table.table td {
        padding: 5px 15px !important;
    }
    article table.table td p {
        margin: 0px !important;
        padding: 0px !important;
        text-align: left !important;
    }
    .tplDphHeaderLinks .fa-3x {
        font-size: 2rem;
        font-weight: 300;
    }
    .btn-group label {
        font-size: 0.85rem;
    }
}

    
.btn-up {
    display: none;
    transition: all 0.5s ease-out;
    bottom: 40px;
    right: 40px;
    width: 55px;
    height: 55px;
    z-index: 10;
    opacity: 0;
}

.body-scroll .btn-up {
    display: block;
    opacity: 1;
    transition: all 1.5s ease-out;
}

.tplContextTabs nav .nav-link.active {
	background-color: #fff !important;
    color: #000 !important;
}

.tplContextTabs nav .nav-link.active svg * {
	fill: #000;
}

/* FIGCAPTION */

.caption {
    color: #FFFFFF;
    font-size: .875em;
}

.caption-vertical {
    margin-top: -30px;
    transform: rotate(-90deg);
    transform-origin: top left;
}

/* a verifier pourquoi encore nécessaire avec BS5 > ABR */

.dropdown-toggle:after {
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    font-family: "Font Awesome 7 Pro";
    font-weight: 900;
    content: "\f107";
}

/* deapsearch custom classes */ 

.btn.active .d-none {
    display: block !important;
}

.btn.btn-dark.active {
    border: none;
    border-left: solid 5px #fa3737 !important;
}

.btn.btn-light.active {
    border: none;
    border-left: solid 5px #fa3737 !important;
}


.splide__pagination {
    position: relative !important;
    bottom: auto !important;
    padding: 20px;
}

.splide__pagination .splide__pagination__page {
    background-color: var(--bs-white);
    border: 0;
    border-radius: 0;
    display: inline-block;
    opacity: initial;
    transition: transform .2s linear;
    width: 15px;
    height: 5px;
}

.splide__pagination .splide__pagination__page.is-active {
    background-color: var(--bs-primary);
    transform: initial;
    z-index: auto;
}