/*
Theme Name: Salient Child Theme
Theme URI: http: //mysite.com/
Description: This is a custom child theme for Salient
Author: My Name
Author URI: http: //mysite.com/
Template: salient
Version: 0.1
*/

/* FONT */

h1, h2, h3, h4 {
    font-family: "tuppence",serif;
}

/* ANIMATION ROUE */

.hell_roulette {
    position: relative;
}
img.roue {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
	animation-duration: 3s;
  	animation-name: cestparti;
	transform: rotate(0deg);
}

@keyframes cestparti {
	from {transform: rotate(0deg);}
	5% {transform: rotate(0deg);}
	5% {transform: rotate(-80deg);}
	to {transform: rotate(1440deg);}
}

/* HEADER */

a#logo{position: relative;}
a#logo:hover:before{
	content:'';
	background-image: url(https://agencehell.com/wp-content/uploads/2022/03/logo-bleu.png);
	background-size: contain;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	z-index: 1;
}
a#logo:hover img{opacity: 0;}

#header-outer header .nectar-menu-icon, #header-outer header .nectar-menu-icon-img {margin-right: 0;}

#header-outer ul.sf-menu>li:not(.menu-item-40)>a>.nectar-menu-icon-img {
    max-height: 20px;
}
#header-outer header .nectar-menu-icon-img{width: auto !important;}

li.menu-item a:before{
	content: '';
	background-size: contain;
    position: absolute;
    z-index: 20;
    top: 0;
    bottom: 0;
    left: 25px;
    right: 25px;
	opacity: 0;
	transition: all 0.3s ease-in-out;
}
li.menu-item:hover a:before{opacity: 1;}
li.menu-item:hover a{opacity: 0;}

li#menu-item-35 a:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/icon_metier2.png);}
li#menu-item-36 a:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/icon_clients2.png);}
li#menu-item-37 a:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/icon_team2.png);}
li#menu-item-38 a:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/icon_contact2.png);}
li#menu-item-40 a:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/icon_home2.png);}
li#menu-item-346 a:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/05/formation2.png);}

#header-outer ul.sf-menu>li>a>.nectar-menu-icon-img {
    max-height: 25px;
}

/* FOOTER */

.social_block {
    position: fixed;
    bottom: 50px;
    left: 0;
    right: 0;
    transition: all 0.3s ease-in-out;
	z-index: 100;
}

.social-link{
	width: 30px;
	height: 30px;
	display: inline-block;
	margin: 0 10px;
	background-size: contain;
	color: transparent;
}
.social-link:hover{color: transparent;}

.social-link.ig{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/ig.png);}
.social-link.fb{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/fb.png);}
.social-link.lk{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/lk.png);}
.social-link.ig:hover{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/ig2.png);}
.social-link.fb:hover{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/fb2.png);}
.social-link.lk:hover{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/lk2.png);}

/* CONTACT */

.contact h2 {
    font-style: italic;
    font-size: 60px;
}

form.wpcf7-form input, form.wpcf7-form textarea {
    background: none;
    border-bottom: 2px solid #3B0E49;
    border-top: none;
    border-left: none;
    border-right: none;
    padding: 10px 0;
    border-radius: 0;
    color: #41054C;
    margin-top: 15px;
    font-family: 'tuppence', serif;
    font-size: 24px !important;
    line-height: 34px;
    font-style: italic;
}

form.wpcf7-form input:focus, form.wpcf7-form textarea:focus, form.wpcf7-form input:hover, form.wpcf7-form textarea:hover {
    border-bottom: 2px solid #FCF1DE !important;
    box-shadow: none !important;
}

form.wpcf7-form textarea {
    height: 120px;
}

form.wpcf7-form input::placeholder, form.wpcf7-form textarea::placeholder {
    color: #41054C;
}

form.wpcf7-form input:focus::placeholder, form.wpcf7-form textarea:focus::placeholder, form.wpcf7-form input:hover::placeholder, form.wpcf7-form textarea:hover::placeholder{
	color: #FCF1DE;
}

form.wpcf7-form .fire_wrap input[type=submit].wpcf7-submit {
    background: none !important;
    border: none !important;
    font-style: initial;
    font-size: 48px !important;
    padding: 15px 0 !important;
}

form.wpcf7-form .fire_wrap:hover input[type=submit].wpcf7-submit{
	color: #FCF1DE;
	border: none !important;
	box-shadow: none !important;
	transform: translateY(0px) !important;
    -webkit-transform: translateY(0px) !important;
}

.wpcf7-spinner{display: none;}

.fire_wrap {
    text-align: right;
    width: 50%;
    margin-left: 50%;
}

.fire_wrap:after {
    content: '';
    background-image: url(https://agencehell.com/wp-content/uploads/2022/03/flamme-white.png);
    background-size: contain;
    background-position: bottom;
    background-repeat: no-repeat;
    position: fixed;
    height: 300px;
    left: 0;
    right: 0;
    bottom: 0;
	display: none;
}
.fire_wrap:hover:after{display:block;}

/* METIERS */

.metier {
    font-family: 'tuppence', serif;
    font-size: 34px;
    line-height: 40px;
    position: relative;
}

.metier span{display: inline-block;position: relative;}
.metier:hover span{color: #FCF1DE;}

.metier:hover span:before {
    content: '';
    background-size: contain;
    background-repeat: no-repeat;
    height: 100px;
    position: absolute;
    left: 0;
    right: 0;
}
.metier.strategie span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/05/strategie-flamme.png);top: -33px;}
.metier.smm span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/smm.png);top: -33px;}
.metier.pm span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/pm.png);top: -24px;}
.metier.influence span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/influence.png);top: -20px;}
.metier.gdc span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/gdc.png);top: -17px;}
.metier.formation span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/05/formationflamme.png);top: -21px;}
.metier.cm span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/cm.png);top: -28px;}
.metier.cdc span:before {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/cdc.png);top: -43px;}

/* TITRE */

.hell_title p strong {
    font-style: italic;
}
.hell_title p, .hell_title p strong {
    font-family: 'tuppence', serif;
    font-size: 74px;
    line-height: 79px;
    letter-spacing: 1px;
}

.hell_title {
    margin-left: 50px;
}

.hell_title:hover p, .hell_title:hover p strong{color:#999bf8;}

/* TEAM */

.hell_team {
    position: relative;
}
.hell_team:before {
    content: '';
    background-image: url(https://agencehell.com/wp-content/uploads/2022/03/team-hell-1.jpg);
    background-size: contain;
	background-repeat: no-repeat;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

.hell_team:before {
	animation-duration: 5s;
	animation-iteration-count: infinite;
  	animation-name: hellteam;
	opacity: 0;
}

@keyframes hellteam {
	from {opacity: 0;}
	25% {opacity: 0;}
	30% {opacity: 0.2;}
	31% {opacity: 1;}
	32% {opacity: 0.2;}
	33% {opacity: 1;}
	34% {opacity: 0.2;}
	50% {opacity: 0.6;}
	51% {opacity: 1;}
	52% {opacity: 0.65;}
	80% {opacity: 1;}
	to {opacity: 0;}
}

.hell_team:hover:after {
    content: '';
    background-image: url(https://agencehell.com/wp-content/uploads/2022/03/flamme-red.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    position: fixed;
    top: calc(100vh - 300px);
    left: 0;
    right: 0;
    height: 300px;
    display: block;
}

.hell_team_text h1 {
    color: #FCF1DE;
    font-weight: 100;
    letter-spacing: 0.02em;
    font-size: 70px;
    line-height: 70px;
    margin-bottom: 30px;
}

/* NOTRE VISION */

.notre-vision .row-bg {
    background-size: contain;
}

.vision_text h1 {
    color: #FCF1DE;
    margin-bottom: 30px;
}

/* EQUIPE */

.equipe_text h2{color: #FF6666;}

.equipe_text em, .equipe_text i {
    font-family: 'tuppence', serif;
    letter-spacing: 0.02em;
    font-size: 20px;
}

.hell_marion .ht_img {
    width: 60% !important;
}

img.ht_img {
    width: 80% !important;
}

.hell_marion, .hell_linda, .hell_emma, .hell_alexia, .hell_pauline, .hell_amandine {
    position: relative;
}
.hell_marion:before, .hell_linda:before, .hell_emma:before, .hell_alexia:before, .hell_pauline:before, .hell_amandine:before {
    content: '';
    background-size: contain;
	background-repeat: no-repeat;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
.hell_marion:before{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/marion-hell-1.jpg);left: 20%;}
.hell_linda:before{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/linda-hell-1.jpg);left: 10%;}
.hell_emma:before{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/emma-hell-1.jpg);left: 10%;}
.hell_alexia:before{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/alexia-hell-1.jpg);left: 10%;}
.hell_pauline:before{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/pauline-hell.jpg);left: 10%;}
.hell_amandine:before{background-image: url(https://agencehell.com/wp-content/uploads/2022/05/amandine2.jpg);left: 10%;}


.hell_marion:before, .hell_linda:before, .hell_emma:before, .hell_alexia:before, .hell_pauline:before, .hell_amandine:before {
	animation-duration: 5s;
	animation-iteration-count: infinite;
  	animation-name: hellteam;
	opacity: 0;
}

.hell_marion:before{animation-delay: 1s;}
.hell_linda:before{animation-delay: 1.7s;}
.hell_emma:before{animation-delay: 0s;}
.hell_pauline:before{animation-delay: 3.5s;}
.hell_alexia:before{animation-delay: 1s;}
.hell_amandine:before{animation-delay: 2s;}

/* CLIENTS */

.clients {
    z-index: 101 !important;
}

.nectar-flickity h3, .clients_text h3 {
    color: #FF6666;
    text-transform: uppercase;
    font-size: 24px;
    letter-spacing: 0.05em;
}
.nectar-flickity b, .nectar-flickity strong {
    color: #9999FF;
    font-weight: 300;
    font-style: italic;
}
.nectar-flickity p {
    padding-bottom: 5px;
    color: #F8F0DD;
}

.client_logo a {
    display: inline-block;
    position: relative;
}

.client_logo a:after {
    content: '';
    background: url(https://agencehell.com/wp-content/uploads/2022/03/flamme_bleue.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    position: absolute;
    top: -35px;
    left: 0;
    right: 0;
    height: 30px;
	transition: all 0.2s ease-in-out;
	opacity: 0;
}
.client_logo a:hover:after {
    opacity: 1;
	transition: all 0.2s ease-in-out;
}

.client_logo a img {
    max-width: 140px !important;
	max-height: 100px;
    background-color: #ff6666;
    margin: auto !important;
    display: block;
	transition: all 0.2s ease-in-out;
}
.client_logo a:hover img {
    background-color: #9a95ff;
	transition: all 0.2s ease-in-out;
}
.client_logo a:before {
    content: '';
    position: absolute;
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px;
    display: block;
    border: 2px solid #41054c;
}

button.flickity-button.flickity-prev-next-button:before {
    background: transparent !important;
}
button.flickity-button.flickity-prev-next-button.next {
    right: 0 !important;
}
button.flickity-button.flickity-prev-next-button.prev {
    left: 0 !important;
}
button.flickity-button.flickity-prev-next-button svg, button.flickity-button.flickity-prev-next-button:after {
    display: none !important;
}

button.flickity-button.flickity-prev-next-button {
    width: 80px !important;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    top: auto !important;
    bottom: -80px;
	transition: all 0.2s ease-in-out;
}
button.flickity-button.flickity-prev-next-button.next{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/arrow.png);}
button.flickity-button.flickity-prev-next-button.next:hover{background-image: url(https://agencehell.com/wp-content/uploads/2022/03/arrow2.png);}
button.flickity-button.flickity-prev-next-button.previous {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/arrow3.png); left: 0 !important;}
button.flickity-button.flickity-prev-next-button.previous:hover {background-image: url(https://agencehell.com/wp-content/uploads/2022/03/arrow4.png);}
button.flickity-button.flickity-prev-next-button.next:before {
    content: 'client suivant';
    color: #9999FF;
    font-family: 'tuppence', serif;
    text-transform: uppercase;
    text-align: right;
    display: block;
    font-size: 12px;
    width: 140px;
    height: 40px;
    line-height: 36px;
    position: absolute;
    right: 80px;
    left: auto;
    top: 0px;
	opacity: 0;
}
button.flickity-button.flickity-prev-next-button.previous:before {
    content: 'client précédent';
    color: #9999FF;
    font-family: 'tuppence', serif;
    text-transform: uppercase;
    text-align: left;
    display: block;
    font-size: 12px;
    width: 140px;
    height: 40px;
    line-height: 36px;
    position: absolute;
    right: auto;
    left: 80px;
    top: 0px;
	opacity: 0;
}
.nectar-flickity[data-controls*=arrows_overlaid] .flickity-prev-next-button:hover:before {
    -webkit-transform: scale(1) translateZ(0);
    transform: scale(1) translateZ(0);
}
button.flickity-button.flickity-prev-next-button.next:hover:before{
	right: 90px;
	opacity: 1;
}
button.flickity-button.flickity-prev-next-button.previous:hover:before{
	left: 90px;
	opacity: 1;
}

.nectar-flickity.nectar-carousel.nectar-carousel:not(.masonry) .flickity-viewport {
    margin-top: 100px;
}

/* Page Formation */

a.nectar-button.medium.regular.extra-color-2.regular-button.formation_dl:hover {
    box-shadow: none !important;
	opacity: 1;
}
a.nectar-button.medium.regular.extra-color-2.regular-button.formation_dl {
    font-family: "tuppence",serif !important;
    color: #41054c;
    font-size: 26px;
    font-style: italic;
    border-radius: 4px !important;
    padding: 16px 30px 20px;
}


/* RESPONSIVE */

.off-canvas-menu-container .nectar-menu-icon-img {
    max-width: initial;
    height: 30px;
    margin-right: 10px;
    width: auto;
}
#slide-out-widget-area li.menu-item-40 > a .nectar-menu-icon-img{
	width: 30px;
    height: 30px;
}

@media only screen and (max-width: 1280px){
	.metier {
		font-size: 36px;
		line-height: 44px;
	}
}

@media only screen and (min-width: 1000px){

	.clients_mobile {
		display: none !important;
	}
	
}

@media only screen and (max-width: 999px){

	.clients_desktop {
		display: none !important;
	}
	
	.m_clients_box {
		margin: 60px auto !important;
		width: 90%;
	}
	
}

@media only screen and (max-width: 999px) and (min-width: 691px){
	
	.m_clients_box {
		margin: 60px auto !important;
		width: 70%;
	}
	
	.m_clients_box img{
		max-width: 60% !important;
	}
	
	.nectar_video_player_self_hosted.wpb_video_widget.wpb_content_element.vc_clearfix.vc_video-aspect-ratio-916.vc_video-el-width-100.vc_video-align-center {
		max-width: 60%;
		margin: auto;
	}
	
}

@media only screen and (max-width: 690px){
	
	.m_clients_box img{
		max-width: 70% !important;
	}
	
	.nectar_video_player_self_hosted.wpb_video_widget.wpb_content_element.vc_clearfix.vc_video-aspect-ratio-916.vc_video-el-width-100.vc_video-align-center {
		max-width: 70%;
		margin: auto;
	}
	
	.nectar-flickity.nectar-carousel.vertical-alignment-middle .flickity-slider .cell .inner-wrap-outer > .inner-wrap {
		justify-content: flex-start;
	}
	
	.cell .vc_col-sm-3, .cell .vc_col-sm-2 {
		display: none !important;
	}
	
	.cell .vc_col-sm-6:nth-child(2) {
		display: none !important;
	}
	
	.client_logo p {
		text-align: center;
	}
	
	.vision_text h1 {
		margin-bottom: 10px;
	}
	
	.home .vc_col-sm-7 {
		margin-bottom: 15px;
	}
	
	.hell_title p, .hell_title p strong {
		font-size: 28px;
		line-height: 36px;
	}
	.hell_roulette img {
		margin-bottom: 0 !important;
	}
	.home .vc_col-sm-5 {
		margin-bottom: 0;
	}
	.home .row_col_wrap_12 {
		margin-bottom: 0;
	}
	
	.metier {
		font-size: 26px;
		line-height: 40px;
	}
	.metier.strategie span:before {top: -18px;}
	.metier.smm span:before {top: -18px;}
	.metier.pm span:before {top: -12px;}
	.metier.influence span:before {top: -8px;}
	.metier.gdc span:before {top: -7px;}
	.metier.formation span:before {top: -8px;}
	.metier.cm span:before {top: -13px;}
	.metier.cdc span:before {top: -21px;}
	
	.contact h2 {
		font-size: 50px;
	}
	
	form.wpcf7-form .fire_wrap input[type=submit].wpcf7-submit {
		font-size: 38px !important;
		padding: 5px 0 !important;
	}
	
	
	.clients_text {
		padding-left: 0;
		text-align: center;
	}
	.nectar-flickity[data-controls*=arrows_overlaid] .flickity-prev-next-button.previous {
		left: 0;
	}
	button.flickity-button.flickity-prev-next-button.next:hover:before, button.flickity-button.flickity-prev-next-button.previous:hover:before{display:none;}
	
	.client_mobilehide{display: none !important;}
	
	h1 {
		font-size: 30px;
	}
	
	.vision_text p {
		line-height: 18px;
		font-size: 15px;
	}
	
	.hell_team_text h1, .hell_team_text p {
		text-align: center;
	}
	
	.hell_team:hover:after{display:none !important;}
	
	img.ht_img {
		width: 60% !important;
		margin: auto;
	}
	
	.hell_marion:before, .hell_linda:before, .hell_emma:before, .hell_alexia:before, .hell_pauline:before, .hell_amandine:before {
		left: 20%;
	}
	
	.hell_team:before {
		left: 20%;
	}
	
	.contact .vc_col-sm-4, .contact .vc_col-sm-6 {
		margin-bottom: 0;
	}
	
	.contact .wpb_text_column {
		margin-bottom: 0;
	}
	
	.contact h2 {
		font-size: 30px !important;
		text-align: center !important;
	}
	.contact p {
		text-align: center !important;
	}
}