/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

/* ----------------------------------------------------------------
	Text
-----------------------------------------------------------------*/

.grey-text {
    color: #666666;
}

/* ----------------------------------------------------------------
	Hyperlinks
-----------------------------------------------------------------*/

.hl {
    position: relative;
    font-weight: 500 !important;
    color: #000 !important;
    text-decoration: none;
}
  
.hl:hover {
    color: #000 !important;
}
  
.hl::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #000;
    transform: scaleX(0);
    transition: transform 0.2s ease;
}
  
.hl:hover::before {
    transform: scaleX(1);
}

/* ----------------------------------------------------------------
	Sections
-----------------------------------------------------------------*/

.background-grey {
    background-color: #ededed !important;
}

.sectiontitle {
    padding-bottom: 20px !important;
}

/* ----------------------------------------------------------------
	Portfolio Filter
-----------------------------------------------------------------*/

.grid-filter.gf-jop li a { border-radius: 0; border: none; }

.grid-filter.gf-jop li a:after { content: ""; position: absolute; display: block; width: 100%; height: 1px; bottom: 0; left: 0; background-color: #000; transform: scaleX(0); transition: transform 0.2s ease; }

.grid-filter.gf-jop li:hover, .grid-filter.gf-jop li.active { background-color: transparent; }

.grid-filter.gf-jop li:hover a, .grid-filter.gf-jop li.active a { color: #3c4043; background-color: transparent; }

.grid-filter.gf-jop li:hover a:after, .grid-filter.gf-jop li.active a:after { transform: scaleX(1); }


/* ----------------------------------------------------------------
	Portfolio Description
-----------------------------------------------------------------*/

.portfolio-item .portfolio-description {
    width: 100% !important;
}

/* ----------------------------------------------------------------
	Portfolio Open Gallery
-----------------------------------------------------------------*/

.portfolio-item .portfolio-item-wrap .gallery-open {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 4;
}

/* ----------------------------------------------------------------
	Video Modal
-----------------------------------------------------------------*/
.mfp-ready .modal {
    background: none !important;
    border-radius: 0 !important;
    padding: 0px !important;
}

.mfp-close-btn-in .mfp-close {
    color: #000  !important;
}

/* ----------------------------------------------------------------
	Outils Tabs
-----------------------------------------------------------------*/

.nav-link.active {
    color: #000 !important;
    border-right: 2px solid #ededed !important;
    background-color: #ededed !important;
    border-bottom: none !important;
}

/* ----------------------------------------------------------------
	Footer
-----------------------------------------------------------------*/

.copyright-text {
    color: #fff !important;
    font-size: 14px !important;
	font-weight: 600 !important;
}