/**
 * Jobs.it - Style SCSS 
 */
/**
 * Corporate colour
 */
/**
 * Brands
 */
/**
 * FFG Corporate
 */
/**
 * FFG Distribution
 */
@font-face {
  font-family: "Slick";
  font-style: normal;
  font-weight: 400;
  src: local("Slick"), local("Slick"), url(https://www.jobs.it/libraries/slick/slick/fonts/slick.woff) format("woff2");
  font-display: swap;
}
/* Body */
body {
  font-family: Open Sans, serif;
  -webkit-text-size-adjust: none !important;
}

#page-wrapper {
  background-color: #EEEEEE;
}

a {
  text-decoration: none;
  color: #004687;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

a:hover {
  text-decoration: none;
  color: #0056a7;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

/* Headings */
h2.head-h2 {
  font-size: 40px;
  color: #33373A;
  font-weight: 300;
  text-transform: uppercase;
  background: linear-gradient(0deg, #FFFF00 35%, transparent 20%);
  display: inline-block;
  line-height: 85%;
}

h3.head-h3 {
  font-size: 25px;
  color: #33373A;
  font-weight: 300;
  text-transform: uppercase;
}

/* Jobs Button */
.btn-yellow {
  border-radius: 40px;
  border-color: #FFFF00;
  background: #FFFF00;
  /* Old browsers */
  background: linear-gradient(to right, #393939 50%, #FFFF00 50%);
  background-size: 205% 105%;
  background-position: right bottom;
  transition: all 0.2s ease;
  color: #393939;
  border: 0px solid #FFFF00;
  /* adding: .375rem .75rem; ORIGINAL PADDING */
  padding: 0.575rem 0.95rem;
}

.btn-yellow:hover {
  background-position: left bottom;
  border-color: #393939;
  color: #FFFFFF;
  transition: all 0.2s ease;
  border: 0px solid #393939;
}

.btn-yellow:focus {
  box-shadow: none;
}

.btn-yellow:not(:disabled):not(.disabled):active,
.btn-yellow:not(:disabled):not(.disabled).active {
  color: #FFFFFF;
  background-color: #000000;
  box-shadow: none;
}

.btn-black, button.btn-black {
  border-radius: 40px;
  border-color: #393939;
  background: #393939;
  /* Old browsers */
  background: linear-gradient(to right, #FFFF00 50%, #393939 50%);
  background-size: 200% 100%;
  background-position: right bottom;
  margin-left: 10px;
  transition: all 0.2s ease;
  color: #FFFFFF !important;
  border: 0px solid #393939;
  /* adding: .375rem .75rem; ORIGINAL PADDING */
  padding: 0.575rem 0.95rem;
}

.btn-black:hover {
  background-position: left bottom;
  border-color: #FFFF00;
  color: #393939 !important;
  transition: all 0.2s ease;
  border: 0px solid #FFFF00;
}

.btn-black:focus {
  box-shadow: none;
}

.btn-black:not(:disabled):not(.disabled):active,
.btn-black:not(:disabled):not(.disabled).active {
  color: #FFFFFF !important;
  background-color: #000000;
  box-shadow: none;
}

/* Navbar + masthead */
.shrink {
  position: inherit;
  width: 100%;
  top: 0;
  z-index: 1035;
  left: 0;
}

.navbar-brand img {
  height: 50px;
}

#header {
  z-index: 200;
  position: relative;
  /*top: -16px*/
}

.page-view-frontpage .navbar {
  background: rgba(255, 255, 255, 0.7);
}

.page-view-frontpage .navbar#navbar-top {
  padding: 0 1rem;
  background: rgba(255, 255, 255, 0.7);
}

.page-view-frontpage .branding {
  background: rgba(255, 255, 255, 0.7);
}

.navbar {
  background: rgb(255, 255, 255);
}

.navbar#navbar-top {
  padding: 0 1rem;
  background: rgb(255, 255, 255);
}

.branding {
  background: rgb(255, 255, 255);
}

#block-loghibrand img {
  height: 60px;
}

#block-loghibrand p {
  margin-bottom: 0;
}

.navbar-light .navbar-nav .nav-link {
  color: #000;
  text-transform: uppercase;
  font-size: 21px;
  font-weight: 300;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

.masthead.shrink .navbar-light .navbar-nav .nav-link {
  font-size: 18px;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

.masthead.shrink {
  background: #FFFFFF;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  padding-top: 10px;
}

.masthead .navbar-brand img, .masthead #block-loghibrand img {
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

.masthead .navbar-brand img {
  position: relative;
}

.masthead.shrink .navbar-brand img {
  height: 50px;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

.masthead.shrink #block-loghibrand img {
  height: 35px;
  transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
}

.masthead.shrink nav.navbar.navbar-expand-lg {
  width: 100%;
  padding: 0 1rem 0 1rem;
}

nav.navbar.navbar-expand-lg {
  width: 100%;
  padding: 1rem;
}

#navbar-top {
  flex-direction: row;
  justify-content: flex-end;
}

.navbar-brand {
  float: none;
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0px;
}

.navbar-brand img {
  height: 80px;
}

#block-topmenu .nav {
  background-color: #E5E5E5;
  font-family: Open Sans;
  font-size: 13px;
  color: #33373A;
}

#block-topmenu .nav a {
  font-size: 13px;
  color: #33373A;
  text-transform: uppercase;
  margin: 0 2rem;
}

#block-topmenu .nav-link {
  display: block;
  padding: 0.3rem 0.5rem;
}

nav.navbar {
  justify-content: flex-end !important;
}

.menu-item--expanded .dropdown-toggle::after {
  border: none;
  font-family: "fontello";
  font-weight: 900;
  content: "\f004";
  vertical-align: 0;
  height: auto;
  width: auto;
}

.dropdown-toggle[aria-expanded=true]:after {
  transform: rotate(180deg);
  transition: 0.4s;
}

.dropdown-toggle:after {
  transition: 0.4s;
}

.dropdown.show .dropdown-menu {
  border: 0;
  border-radius: 0;
}

.dropdown.show .dropdown-menu li:hover {
  background: transparent;
}

.dropdown-menu {
  position: absolute;
  z-index: 1000;
  display: none;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0;
  font-size: 18px;
  color: #393939;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 0;
  border-radius: 0;
}

.dropdown-menu a {
  color: #000000;
}

.dropdown-menu a:hover {
  color: #000000;
}

.dropdown-item {
  font-weight: 300;
}

.dropdown-item.active, .dropdown-item:active {
  color: #000000;
  background-color: #f0f0f0;
}

.dropdown-item:hover {
  color: #000000;
  background-color: #f0f0f0;
}

/*.dropdown-item.active {
    color: $black;
    background-color: $gray08;
    font-weight: 600;
}*/
.navbar-toggler {
  color: transparent;
  border-color: transparent;
  border: none;
}

.navbar-toggler:focus {
  box-shadow: none;
}

/* Define the shape and color of the hamburger lines */
.navbar-toggler span {
  display: block;
  background-color: #4f4f4f;
  height: 3px;
  width: 25px;
  margin-top: 5px;
  margin-bottom: 5px;
  position: relative;
  left: 0;
  opacity: 1;
  transition: all 0.35s ease-out;
  transform-origin: center left;
}

/* top line needs a little padding */
.navbar-toggler span:nth-child(1) {
  margin-top: 0.3em;
}

/**
 * Animate collapse into X.
 */
/* top line rotates 45 degrees clockwise and moves up and in a bit to close the center of the X in the center of the button */
.navbar-toggler:not(.collapsed) span:nth-child(1) {
  transform: translate(15%, -33%) rotate(45deg);
}

/* center line goes transparent */
.navbar-toggler:not(.collapsed) span:nth-child(2) {
  opacity: 0;
}

/* bottom line rotates 45 degrees counter clockwise, in, and down a bit to close the center of the X in the center of the button  */
.navbar-toggler:not(.collapsed) span:nth-child(3) {
  transform: translate(15%, 33%) rotate(-45deg);
}

/**
 * Animate collapse open into hamburger menu
 */
/* top line moves back to initial position and rotates back to 0 degrees */
.navbar-toggler span:nth-child(1) {
  transform: translate(0%, 0%) rotate(0deg);
}

/* middle line goes back to regular color and opacity */
.navbar-toggler span:nth-child(2) {
  opacity: 1;
}

/* bottom line goes back to initial position and rotates back to 0 degrees */
.navbar-toggler span:nth-child(3) {
  transform: translate(0%, 0%) rotate(0deg);
}

/* Language selector */
#block-languagedropdownswitcher {
  margin-top: -4px;
}

#block-languagedropdownswitcher .form-select {
  border: none;
  background-color: #000;
  color: #FFFFFF;
  border-radius: 0;
  font-size: 13px;
  text-transform: uppercase;
}

#block-languagedropdownswitcher .form-item-lang-dropdown-select {
  display: inherit;
}

#block-languagedropdownswitcher .form-select option {
  font-size: 13px;
  text-transform: uppercase;
  color: #FFFFFF;
}

#block-languagedropdownswitcher .form-select {
  padding: 0.2rem 2.25rem 0.2rem 0.75rem;
  background: #000 url(/themes/jobs/img/icon/arrow-down.svg);
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}

/* Social Header */
#block-socialheadertop .content ul li {
  display: inline;
  font-size: 14px;
  color: #000000;
}

#block-socialheadertop .content ul li a, #block-socialheadertop .content ul li a:hover {
  font-size: 20px;
  color: #000000;
  margin: 0 0.5rem;
  text-decoration: none;
}

/* Node page style */
.node--type-page #page-wrapper {
  background-color: #FFFFFF;
}

/* None paragraph light style */
.node--type-page .node__content, .node--type-page .node__content p {
  font-weight: 100;
  line-height: 140%;
}

.node--type-page .node__content .block-field-blocknodepagefield-allegati-pagine-base table tr th {
  color: #000000;
  font-weight: 400;
}

/* Company page - page--node--36.html.twig */
.company-shape {
  width: 250px;
  height: 250px;
  background: url(/themes/jobs/img/company/bkg-company-shape.svg);
  position: absolute;
  bottom: 0;
}

.company-splash {
  background: url(/themes/jobs/img/company/company-01.jpg);
  min-height: 62vh;
  position: relative;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.company-shape h2 {
  position: absolute;
  color: #FFFF00;
  bottom: 0;
  margin: 15px;
  font-size: 2rem;
  font-weight: 600;
}

.block-views-blockstory-block-1 .slick-arrow::before {
  color: #D9D9D9;
  font-size: 36px;
  font-size: 3rem;
}

.block-views-blockstory-block-1 .slick-slide {
  margin: 0 1rem;
  padding: 1rem;
}

.block-views-blockstory-block-1 .views-field-field-anno-storia {
  font-size: 3em;
  font-weight: 800;
  color: #717171;
  text-align: center;
  margin-bottom: 1em;
}

.block-views-blockstory-block-1 .views-field-field-immagine-storia img {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1em;
}

.block-views-blockstory-block-1 .views-field-body {
  font-size: 0.8em;
}

.block-views-blockstory-block-1 .slick-current {
  background: #EEEEEE;
}

.block-views-blockstory-block-1 .slick-current .views-field-field-anno-storia {
  color: #33373A;
}

.company-parallax {
  background: url(/themes/jobs/img/company/bkg-company-parallax.jpg) no-repeat center center;
  width: 100%;
  height: 450px;
  background-size: cover;
  background-attachment: fixed;
  overflow: hidden;
  background-color: rgba(0, 0, 0, 0.5);
  background-blend-mode: multiply;
  display: flex;
  align-items: center;
  justify-content: center;
}

.company-parallax::before {
  content: "";
  background-color: #717171;
}

#block-companyctabutton .btn-yellow {
  text-transform: uppercase;
  font-weight: 800;
}

#block-companyctatitle .content h2 {
  font-size: 2em;
  color: #FFFFFF;
  font-weight: 800;
}

#block-companyctabutton .content {
  font-size: 1.3em;
  color: #FFFFFF;
  font-weight: 800;
}

/* Missione e valori - page--node--124 */
.page-node-124 .mission-block p {
  color: #000000;
  font-size: 1.1rem;
  text-align: center;
}

.page-node-124 h4 {
  font-size: 1.4rem;
  font-weight: 600;
  background-color: #FFFF00;
  min-height: 10rem;
  padding: 2rem;
  text-align: center;
  vertical-align: middle;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.2s ease;
}

.page-node-124 h4.sviluppo {
  background: #FFFF00 url(/themes/jobs/img/icon/ico-sviluppo.png) no-repeat left bottom;
}

.page-node-124 h4.crescita {
  background: #FFFF00 url(/themes/jobs/img/icon/ico-crescita.png) no-repeat left bottom;
}

.page-node-124 h4.sostenibilita {
  background: #FFFF00 url(/themes/jobs/img/icon/ico-sostenibilita.png) no-repeat left bottom;
}

.page-node-124 h4.performance {
  background: #FFFF00 url(/themes/jobs/img/icon/ico-performance.png) no-repeat left bottom;
}

.page-node-124 h4.sviluppo:hover, .page-node-124 h4.crescita:hover, .page-node-124 h4.sostenibilita:hover, .page-node-124 h4.performance:hover {
  background-color: #D9D9D9;
  transition: all 0.2s ease;
}

/* Politica aziendale e certificazioni - page--node--117 */
.page-node-117 .certifications img {
  border: 1px solid #f0f0f0;
}

.page-node-117 .certifications img:hover {
  opacity: 0.8;
}

/* FFG Group - page--node--118 */
.page-node-118 .separator {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  height: 0.5rem;
}

/* Contact page - page--node--76.html.twig */
.page-node-76 #page-wrapper {
  background-color: #FFFFFF;
}

.page-node-76 .contact-border {
  border-bottom: 1px solid #EEEEEE;
  background-color: #f8f7f7;
}

.page-node-76 h3 {
  color: #303030;
  font-weight: 800;
  position: relative;
}

.page-node-76 h3:after {
  background-color: #FFFF00;
  content: "";
  height: 4px;
  left: 0;
  bottom: -5px;
  position: absolute;
  transform: translateX(0%);
  width: 20%;
}

.page-node-76 h4 {
  color: #303030;
  font-weight: 800;
  font-size: 1.2rem;
}

.page-node-76 h4::before {
  font-family: "fontello";
  font-weight: 900;
  content: "\e803";
  border-left: none;
  border-right: none;
  border-top: none;
  margin-right: 0.5rem;
}

.page-node-76 .separator {
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  height: 0.5rem;
}

.page-node-76 .contact-location::before {
  font-family: "fontello";
  font-weight: 900;
  content: "\e806";
  border-left: none;
  border-right: none;
  border-top: none;
  margin-right: 0.5rem;
}

.page-node-76 .contact-phone::before {
  font-family: "fontello";
  font-weight: 900;
  content: "\e802";
  border-left: none;
  border-right: none;
  border-top: none;
  margin-right: 0.5rem;
}

.page-node-76 .contact-fax::before {
  font-family: "fontello";
  font-weight: 900;
  content: "\f1ac";
  border-left: none;
  border-right: none;
  border-top: none;
  margin-right: 0.5rem;
}

.page-node-76 .contact-email::before {
  font-family: "fontello";
  font-weight: 900;
  content: "\f0e0";
  border-left: none;
  border-right: none;
  border-top: none;
  margin-right: 0.5rem;
}

.page-node-76 .node__content a {
  font-weight: 800;
}

/* Small devices (landscape phones, 576px and up) */
/* Medium devices (tablets, 768px and up) */
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .navbar-brand {
    float: left;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0px;
  }
}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .shrink {
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 1035;
    left: 0;
  }
  #block-jobs-main-menu .navbar-nav li.nav-item {
    border-bottom: 2px solid transparent;
    position: relative;
  }
  #block-jobs-main-menu .navbar-nav li.nav-item::after {
    content: "";
    position: absolute;
    width: 0px;
    height: 2px;
    left: 50%;
    bottom: 0;
    background-color: #FFFF00;
    transition: all ease-in-out 0.3s;
  }
  #block-jobs-main-menu .navbar-nav li.nav-item:hover::after {
    width: 100%;
    left: 0;
    background-color: #FFFF00;
  }
  .navbar-brand {
    float: left;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: -30px;
  }
  .navbar-brand img {
    height: 90px;
  }
  .masthead.shrink .navbar-brand {
    float: left;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0px;
  }
  .masthead.shrink .navbar-brand img {
    height: 60px;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
  }
  .masthead.shrink #block-loghibrand img {
    height: 40px;
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
  }
  .company-shape {
    width: 350px;
    height: 350px;
    background: url(/themes/jobs/img/company/bkg-company-shape.svg);
    position: absolute;
    bottom: 0;
  }
  .company-splash {
    background: url(/themes/jobs/img/company/company-01.jpg);
    min-height: 62vh;
    position: relative;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
  }
  .company-shape h2 {
    position: absolute;
    color: #FFFF00;
    bottom: 0;
    margin: 15px;
    font-size: 3rem;
    font-weight: 600;
  }
  #block-companyctatitle .content h2 {
    font-size: 2.6em;
    color: #FFFFFF;
    font-weight: 800;
  }
}