/*

Theme Name: Mrittik Child

Theme URI: http://demo.bravisthemes.com/mrittik/

Author: Bravis-Themes

Author URI: https://themeforest.net/user/bravis-themes/

Description: Mrittik – Architecture and Interior Wordpress theme is a template for architectural studio. It is suitable for interior business. Creative design studio can use this template to present their creative contents more attractively. This template can be used as personal portfolio, construction business etc. It has both dark and light version which very perfect for user attraction.

Version: 1.0.3

License: ThemeForest

License URI: https://themeforest.net/licenses

Template: mrittik

Text Domain: mrittik-child

Tags: architect, architecture, constructor, home decor, interior design, landscape design, real estate

*/

@font-face {
    font-family: 'Century Gothic Normal';
    font-weight: normal;
    font-style: normal;
    src: url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC R.woff') format('woff'),
        url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC R.TTF') format('ttf');
}

@font-face {
    font-family: 'Century Gothic Italic';
    font-weight: normal;
    font-style: italic;
    src: url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC I.woff') format('woff'),
        url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC I.TTF') format('ttf');
}

@font-face {
    font-family: 'Century Gothic Bold';
    font-weight: bold;
    font-style: normal;
    src: url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC B.woff') format('woff'),
        url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC B.TTF') format('ttf');
}

@font-face {
    font-family: 'Century Gothic Bold Italic';
    font-weight: bold;
    font-style: italic;
    src: url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC BI.woff') format('woff'),
        url('https://e-crea.ch/holographe/wp-content/themes/mrittik-child/fonts/Century GOTHIC BI.TTF') format('ttf');
}

:root {
    --color-home: #5894a5
        /*#476d78*/
    ;
    --color-visites-virtuelles: #50a276
        /*#47785e*/
    ;
    --color-animations: #a17956
        /*#785e47*/
    ;
    --color-photographie: #a26351
        /*#785247*/
    ;
    --color-contacts: #a35764
        /*#78474f*/
    ;
    --color-white: #ffffff;
    --color-grey: #EAEAEA;
    --gallery-item-shadow: 0px 0px 15px 0px rgba(0,0,0, .5);
    --color-dark: #1A1A1A;
}

.os-scrollbar-handle {
    background-color: var(--color-grey) !important;
    opacity: .5;

}
.os-scrollbar-handle:hover{
    background-color: var(--color-white) !important;
    opacity: .8;
}

/* Slye Global */
.center{
    text-align: center;
}

/* MOD-MS 10.10.2024 : Mise des pages en pleine hauteur si elles sont plus petite */
html,
body,
.pxl-page {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/*
Header
*/
.current-menu-item:nth-of-type(1) .elementor-item,
.menu-item:nth-of-type(1) .elementor-item:before,
.menu-item:nth-of-type(1) .elementor-item:after {
    background-color: var(--color-home) !important;
}

.current-menu-item:nth-of-type(2) .elementor-item,
.menu-item:nth-of-type(2) .elementor-item:before,
.menu-item:nth-of-type(2) .elementor-item:after {
    background-color: var(--color-visites-virtuelles) !important;
}

.current-menu-item:nth-of-type(3) .elementor-item,
.menu-item:nth-of-type(3) .elementor-item:before,
.menu-item:nth-of-type(3) .elementor-item:after {
    background-color: var(--color-animations) !important;
}

.current-menu-item:nth-of-type(4) .elementor-item,
.menu-item:nth-of-type(4) .elementor-item:before,
.menu-item:nth-of-type(4) .elementor-item:after {
    background-color: var(--color-photographie) !important;
}

.current-menu-item:nth-of-type(5) .elementor-item,
.menu-item:nth-of-type(5) .elementor-item:before,
.menu-item:nth-of-type(5) .elementor-item:after {
    background-color: var(--color-contacts) !important;
}

.menu-item .elementor-item {
    padding-top: 15px !important;
}

.menu-item .elementor-item:before {
    min-height: 10px;
    opacity: 1 !important;
}

.menu-item a {
    font-family: 'Century Gothic Bold';
}

.pxl-header-menu {
    background-color: var(--bglight-color);
}
/* MOD-MS 11.10.2024 : Ajout d'une lumière sous l'onglet séléctionné */
li.current_page_item::after{
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: -30px !important;
    height: 30px !important;
    border: none !important;
    background: linear-gradient(180deg, rgba(255,255,255,0.10) 0%, rgba(0,0,0,0) 75%) !important;
}

/*
Body
*/
#pxl-main {
    padding: 50px 0 0px 0;
}

.pxl-wapper {
    position: relative;
    background-image: url(https://e-crea.ch/holographe/wp-content/uploads/2024/10/fond_2-scaled.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.elementor-slideshow__footer {
    display: none;
}

/* .menu-item.menu-item-9437:hover a span,
.menu-item.menu-item-9437.current-menu-item a span{
    color: var(--color-home);
}
.menu-item.menu-item-9550:hover a span,
.menu-item.menu-item-9550.current-menu-item a span{
    color: var(--color-contacts);
} */

/*
Galerie
*/
.filter-gallery-separator {
    display: flex;
    align-items: center;
    justify-self: center;
}
[class*=" eicon-"],
[class^=eicon]{
    font-size: 50px;
    color: var(--color-grey);
}
[class*=" eicon-"]:hover,
[class^=eicon]:hover,
.elementor-swiper-button:hover [class*=" eicon-"],
.elementor-swiper-button:hover [class^=eicon]{
    color: var(--color-white);
}
.elementor-slideshow__header{
    padding-inline-end: 4.5em;
}
.e-gallery-image{
    opacity: .8;
}
.e-gallery-item:hover .e-gallery-image{
    opacity: 1;
}
.e-gallery-image:hover:after {
    content: "";
    display: block;
    /* width: 100%;
    height: 100%; */
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.4) 70%, rgba(0, 0, 0, .7) 100%);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.e-gallery-item:hover{
    -webkit-box-shadow: var(--gallery-item-shadow);
    box-shadow: var(--gallery-item-shadow);
}

/* Page visite 360 */
.visite-360-container img:hover{
    -webkit-box-shadow: var(--gallery-item-shadow);
    box-shadow: var(--gallery-item-shadow);
}
/* Iframe */
.visite-360-iframe-container{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--color-dark);
}
.visite-360-iframe-container .visite-360-iframe{
    height: 100%;
    width: 100%;
    border: none;
}
.visite-360-iframe-container .visite-360-close{
    position: absolute;
    top: 20px;
    right: 20px;
    color: var(--color-dark);
    z-index: 1000;
}
.visite-360-iframe-container .visite-360-close i{
    color: var(--color-dark);
    opacity: .8;
    /* transition: opacity .3s; */
}
.visite-360-iframe-container .visite-360-close:hover i{
    opacity: 1;
}

/* Page Animations */
.animations-list-container .animations_3d .elementor-widget-video{
    opacity: .8;
}
.animations-list-container .animations_3d .elementor-widget-video:hover{
    -webkit-box-shadow: var(--gallery-item-shadow);
    box-shadow: var(--gallery-item-shadow);
    opacity: 1;
}

/* Scroll to top */
.pxl-scroll-top{
    left: 50%;
    right: 50%;
    -webkit-box-shadow: 0px 0px 20px 0px #000000;
    box-shadow: 0px 0px 20px 0px #000000;
    /* -webkit-box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0, 0, 0, 0); */
    /* box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0, 0, 0, 0); */
}



/*
Mobile
*/
@media (max-width: 767px) {

    /*
    Header
    */
    .menu-item a {
        border-left: none !important;
    }

    .current-menu-item:nth-of-type(1) a,
    .menu-item:nth-of-type(1) a:hover {
        background-color: var(--color-home) !important;
    }

    .current-menu-item:nth-of-type(2) a,
    .menu-item:nth-of-type(2) a:hover {
        background-color: var(--color-visites-virtuelles) !important;
    }

    .current-menu-item:nth-of-type(3) a,
    .menu-item:nth-of-type(3) a:hover {
        background-color: var(--color-animations) !important;
    }

    .current-menu-item:nth-of-type(4) a,
    .menu-item:nth-of-type(4) a:hover {
        background-color: var(--color-photographie) !important;
    }

    .current-menu-item:nth-of-type(5) a,
    .menu-item:nth-of-type(5) a:hover {
        background-color: var(--color-contacts) !important;
    }

    /*
Body
*/
#pxl-main {
    padding: 0px 0 0px 0;
}
}