.home-swiper {
position: relative;
z-index:20
}
.home-swiper-image {
position: absolute;
z-index: 1;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.slider-link {
color: #FFFFFF;
}
.slider-link:hover {
color: var(--jaune);
}
.slider-link::after {
font-family: 'icomoon' !important;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
content: "\e90f";
}
.slider-image {
height: 100%;
display: flex;
}
.slider-image img {
object-fit: cover;
width:100%; height:100%;
}
.slider-degrade {
content:"";
display: block;
width: 100%;
height: 100%;
position: absolute;
z-index: 2;
left: 0;
bottom: 0;
background-image: linear-gradient(to right, rgba(11,108,130,1), rgba(11,108,103,0));
}
.home-swiper-image::before {
content:"";
display: block;
width: 100%;
height: 100%;
position: absolute;
z-index: 3;
left: 0;
bottom: -1px;
background: transparent url(//www.had-nantesetregion.fr/wp-content/themes/had/images/home-slider-bottom-left.svg) no-repeat bottom left;
background-size: 50%;
}
.home-swiper-image::after {
content:"";
display: block;
width: 100%;
height: 100%;
position: absolute;
z-index: 3;
left: 0;
bottom: -1px;
background: transparent url(//www.had-nantesetregion.fr/wp-content/themes/had/images/home-slider-bottom-right.svg) no-repeat bottom right;
background-size: 50%;
}
.home-swiper-content {
position: relative;
z-index: 3;
color: var(--blanc);
height: 55vh;
}
.home-swiper .slider-title{
font-weight: bold;
font-size:2.5rem;
}
.home-swiper .swiper-pagination-bullet{
background-color: var(--blanc);
opacity:.5
}
.home-swiper .swiper-pagination-bullet-active{
opacity:1
}
.home-swiper .swiper-button-prev, .home-swiper .swiper-button-next{
background-color: var(--blanc);
width:40px; height: 40px;
border-radius: 50%;
background-position: center;
background-repeat: no-repeat;
background-size:contain;
}
.home-swiper .swiper-button-prev::after, .home-swiper .swiper-button-next::after{
display:none;
}
.home-swiper .swiper-button-prev{
background-image: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/arrow-left.svg);
left:2rem
}
.home-swiper .swiper-button-next{
background-image: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/arrow-right.svg);
right:2rem
}
.slider-content {
width:80%;
display: flex;
flex-direction: column;
align-items: flex-start;
justify-content: center;
}
@media screen and (min-width: 992px) {
.home-swiper .slider-title{
font-size:3.5rem;
}
.slider-content .wrapper {
width:60%;
}
}
.slider-btn {
background: #FFD2A2;
color: var(--bleu-fonce);
margin-right: 1rem;
padding: .6rem 1.5rem;
border-radius: 2.5rem;
border:2px solid #FFD2A2;
}
.slider-btn:hover{
background-color: var(--bleu-fonce);
border-color: var(--blanc);
color: var(--blanc)
}
.swiper-slide .max-container {
height: 100%;
} .home-swiper-actus {
padding-bottom: 3rem;
}
.home-swiper-actus .swiper-wrapper {
height: 100%;
}
.home-swiper-actus .swiper-slide {
background: #FFFFFF;
border-radius: 1rem;
overflow: hidden;
display: flex;
flex-direction: column;
height: auto;
align-self: stretch;
box-shadow: 1px 4px 6px rgba(0,0,0,0.15);
}
.home-swiper-actus .swiper-slide .news-card .resume{
font-size:0.9rem;
}
.home-swiper-actus .swiper-pagination-bullet-active {
background-color: var(--bleu-fonce);
}
.accroche p{
margin: 0;
}
.news-image img {
border-bottom-left-radius: 70%;
border-bottom-right-radius: 40%;
object-fit: cover
}
.news-title {
padding: .5rem 0;
}
.news-meta {
padding: 0;
}
.news-summary {
padding: 0;
display: block;
}
.news-meta {
font-size: .85rem;
padding-top: 1rem;
box-sizing: border-box;
}
.news-meta .post-categories {
list-style: none;
padding: 0;
margin: 0 0 0 1rem;
}
.post-categories li{
background: none !important;
}
.news-meta .post-categories li a {
display: inline-block;
padding: .25rem 1rem;
background: var(--turquoise);
border-radius: 1.5rem;
text-transform: uppercase;
font-size:0.7rem;
} .bloc-chiffres .accroche{
position: absolute;
left:0; top:0;
width:100%; height:100%;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/humanisme.svg) no-repeat top 5% center / contain;
opacity:0.35
}
.bloc-chiffres::before{
content:"";
display:block;
position: absolute;
left:0; top:0;
width:100%; height:100%;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/courbe.svg) no-repeat left bottom / contain;
}
.key-figure--el {
margin: 0;
text-align: center;
}
.key-figure--val {
font-size: 4rem;
font-weight: bold;
background: -webkit-linear-gradient(45deg, #ffc107, #ff682d 65%);
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
line-height:1
}
.key-figure--text {
margin-bottom: 2rem;
} .section-valeur {
padding-top: 4rem;
padding-bottom: 4rem;
} .bloc-home-map {
position:relative;
height: 980px;
overflow: clip;
z-index:1;
}
.bloc-home-map .infos{
position: absolute;
left:0; bottom:0;
background-color: var(--bleu-fonce);
}
#map {
height: 100%;
border-radius:0 0 3rem 3rem;
}
#map-info {
position: absolute;
z-index: 500;
background: #0B6C82;
color: #ffffff;
padding: 2rem;
width: 100%;
max-width: 400px;
bottom: 0;
left: 0;
font-size: .9rem;
border-top-right-radius: 40px;
}
@media screen and (min-width: 992px) {
.bloc-home-map {
height: 580px;
}
.home .bloc-home-map {
margin-top:-200px !important;
}
}
.maker-el {
display: flex;
align-items: center;
padding: .4rem 0;
}
.maker-el span {
width: 28px;
text-align: center;
} .bloc-onglets{
overflow: clip;
z-index:5
}
@media screen and (min-width: 992px) {
.bloc-onglets{
box-shadow:0 0.5rem 0.5rem rgba(0,0,0,.25);
border-bottom-left-radius: 5vw;
border-bottom-right-radius: 5vw;
}
}
.bloc-home-tabs {
position: relative;
z-index: 2; }
@media screen and (min-width: 992px) {
.bloc-home-tabs.alignfull {
padding: 5vw calc(-50% - -50vw) 0 calc(-50% - -50vw) !important;
}
}
.tab-contents {
margin: 0;
padding: 0;
position: relative;
z-index: 5;
}
.tab-content .ico svg {
width:90px;
}
.bloc-home-tabs li{
overflow: clip
}
.bloc-home-tabs li:nth-child(1), .tab-content:nth-child(1) {
background: var(--gris-clair);
color: var(--bleu);
}
.bloc-home-tabs li:nth-child(2), .tab-content:nth-child(2) {
background: #F5D0A8;
color: var(--orange);
}
.bloc-home-tabs li:nth-child(3), .tab-content:nth-child(3) {
background: #FFEBB5;
color: var(--jaune);
}
#tab-3 .btn-circle{
background-color: var(--jaune);
border-color: var(--jaune);
color: var(--bleu-fonce)
}
#tab-2 .btn-circle{
background-color: var(--orange);
border-color: var(--orange);
}
.bloc-home-rejoindre {
padding: 3rem 0;
position: relative;
z-index: 1;
overflow: hidden;
border-top-right-radius: 5rem;
}
.bloc-home-rejoindre .container {
position: relative;
z-index: 4;
color: #FFFFFF;
}
.bloc-home-rejoindre .mask-bleu {
position: absolute;
z-index: 1;
width: 100%;
height: 100%;
left:0;
top: 0;
background: linear-gradient(to right, #0D7489 0%, #00A2C3 100%);
}
.bloc-home-rejoindre .content{
z-index:2;
color: var(--blanc)
}
.bloc-home-team::before{
content:"";
display:block;
position: absolute;
left:0; top:0;
width:50%; height: 100%;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/fd-before-team.svg) no-repeat left bottom;
z-index:1
}
.bloc-home-team::after{
content:"";
display:block;
position: absolute;
right:0; top:0;
width:50%; height: 100%;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/fd-after-team.svg) no-repeat right bottom;
z-index:1
}
@media screen and (min-width: 768px) {
.key-figure--val {
font-size: 6rem;
}
}
@media screen and (min-width: 992px) {
.bloc-home-tabs::before{
content:"";
display: block;
position:absolute;
right:0; top:-1px;
width:30%;
height:100px;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/before-home-tags.svg) no-repeat top right / contain
}
.bloc-onglets{
position:absolute;
top:0;
width:100%;
z-index:10
}
}
@media screen and (orientation: landscape) {
.home-swiper-content {
height: 77.5vh;
}
}
@media screen and (min-width: 1200px) {
.slider-content .wrapper {
width:50%;
}
.key-figure--val {
font-size: 5rem;
}
.bloc-home-rejoindre .mask-bleu {
left: 0%;
top: 50%;
content: "";
display: block;
border-radius: 0 50% 50% 0;
width:60%; height:auto;
transform: translateY(-50%)
}
.bloc-home-rejoindre .back{
position: absolute;
left:0; top:0;
width:100%; height:100%;
background-size: cover;
background-repeat: no-repeat;
background-position: right center
}
.rejoindre-visuel {
width: 80%;
}
}
.bloc-home-actus {
padding-top: 2rem;
padding-bottom: 2rem;
} .section-equipe {
padding-top: 4rem;
}
.bloc-home-team {
padding-top: 2rem;
padding-bottom: 2rem;
}
.tem-tab {
padding: 1.5rem;
margin-bottom: 1rem;
background: linear-gradient( to right, #005162 0%, #00A2C3 100%);
color: #FFFFFF;
cursor: pointer;
position: relative;
overflow: hidden;
border-radius: 0.75rem;
transition:all 0.2s ease;
}
.tem-tab:hover{
box-shadow:0 0 0.5rem rgba(0,0,0,.3);
background: linear-gradient( to left, #005162 0%, #00A2C3 100%);
}
.tem-tab.current{
background: var(--blanc);
color: var(--bleu-fonce);
box-shadow:0 0 0.5rem rgba(0,0,0,.3)
}
.tem-tab:last-child {
margin-bottom: 0;
}
.tem-tab--image {
position: absolute;
left: 0;
top: 50%;
border-radius: 0 50% 50% 0;
height: 100%;
width: 150px;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
-webkit-transform: translate(-15%, -50%); transform: translate(-15%, -50%);
}
.tem-tab--content {
padding-left: 35%;
position: relative;
z-index: 3;
}
.tem-tab .round-arrow{
width:25px; height:25px;
border-radius: 50%;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/round-arrow.svg) no-repeat center bottom / 100% auto;
transition: all 0.2s ease;
}
.tem-tab.current .round-arrow{
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/round-arrow.svg) no-repeat center top / 100% auto;
}
.tem-tab:hover .round-arrow{
-webkit-transform: scale(1.2); transform: scale(1.2)
}
.tems-list {
display: flex; flex: 1 1 auto;
}
.tems-list .tems-content {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
width: 100%;
color: #FFFFFF;
flex-direction: column;
border-radius: 10px;
}
.tems-list .tems-content a {
display: flex;
flex-direction: column;
color: #FFFFFF;
text-align: center;
}
.tems-list .tem-subtitle{
text-shadow: 0 0 15px rgba(0,0,0,.7)
}
.tems-content:not(.current) {
display: none;
}
.tems-content .icon-play-circle {
font-size: 8rem;
margin-bottom: 3rem;
margin-top: 3rem;
}
.tems-content .icon-quote-left {
font-size: 2rem;
}
.liste-parcours a{
overflow: clip;
border-radius:1rem;
box-shadow: 0 0 1rem rgba(0,0,0,.1);
flex:1 0 auto;
}
.liste-parcours a:hover{
box-shadow: 0 0 1rem rgba(0,0,0,.25);
}
.liste-parcours a .vignet{
background-color: var(--gris-fonce);
-webkit-mask-image: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/mask-vignet.svg);
mask-image: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/mask-vignet.svg);
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
.liste-parcours a:hover .vignet img{
-webkit-transform: translate(-50%, -50%) scale(1.1); transform: translate(-50%, -50%) scale(1.1);
}
.liste-parcours a .taxo{
font-size:0.85rem; font-weight: bold;
color: var(--bleu)
}
.liste-parcours a .lien{
font-weight: bold
}
.liste-parcours a .lien{
color: var(--bleu);
}
.liste-parcours a .lien .icone{
display: inline-block;
width:24px; height: 24px;
border: 2px solid var(--bleu);
border-radius: 50%;
margin-left: 0.5rem;
background:url(//www.had-nantesetregion.fr/wp-content/themes/had/images/arrow-right-bleue.svg) no-repeat center / 100%;
-webkit-transition: all 0.2s ease; transition: all 0.2s ease;
}
.liste-parcours a:hover .lien .icone{
transform: scale(1.5);
}
.liste-parcours a .resume{
font-size:0.9rem
}
.tri{
gap:2px;
}
.tri a{
flex: 1 0 auto;
padding:0.65rem 1rem;
border: 1px solid var(--bleu-fonce);
font-weight: 500;
text-align:center;
}
.tri a > span{
display:inline-block;
}
.tri a:hover, .tri a.current{
background-color: var(--bleu);
color: var(--blanc) !important;
border-color: var(--bleu);
}
.tri a.current{
pointer-events: none;
}
.liste-offres .item{
border-radius: 1rem;
}
.liste-offres .item h3{
border-bottom:1px solid var(--bleu);
padding-bottom:1rem;
}
.liste-offres .item .contrat, .liste-offres .item .date{
font-weight: bold;
font-size:0.9rem;
}
.liste-offres .item .antenne{
font-size:0.9rem;
}
.liste-offres .item a{
color: var(--orange);
font-weight: bold;
text-decoration: none;
}
.liste-offres .item a::after{
content:""; display: inline-block;
width:30px; height:30px;
border:2px solid var(--orange);
border-radius: 50%;
background: url(//www.had-nantesetregion.fr/wp-content/themes/had/images/arrow-right-orange.svg) no-repeat center / contain;
margin-left:0.5rem;
transition: all 0.2s ease;
}
.liste-offres .item a:hover::after{
transform: translateX(15%)
}
@media screen and (min-width: 1680px) {
.slider-content .wrapper {
width:40%;
}
.home-swiper .slider-title{
font-size:3.85rem;
}
.key-figure--val {
font-size: 5rem;
}
}