/*------------------------------------------------
Author: Salvatore Cozzolino
Site version 1.0
Main CSS style
------------------------------------------------*/
/*------------------------------------------------
* Design Name: LeafItalia
* Author: Salvatore Cozzolino
* Site: https://www.cozzolinosalvatore.it
------------------------------------------------*/
/*------------------------------------------------
General style
------------------------------------------------*/
html{
  width: 100%;
  height: 100%;
  overflow: hidden;
}
body{
  font-family: var(--leb-fontface-page);
  font-size: 1rem;
  color: var(--leb-color-text);
  background-color: var(--leb-color-light);
  line-height: 1.5;
  font-weight: 400;
}
@media only screen and (min-width: 768px){
  body{
    font-size: 1.25rem;
  }
}
/*headers*/
 h1, h2, h3, h4, h5, h6,
.h1,.h2,.h3,.h4,.h5,.h6{
  margin-bottom: 1.25rem;
  font-family: var(--leb-fontface-main);
  color: var(--leb-color-main);
  font-weight: 700;
  line-height: 1.2;
}
@media only screen and (min-width: 1400px){
   h1, h2, h3, h4, h5, h6,
  .h1,.h2,.h3,.h4,.h5,.h6{
    /*margin-bottom: 3rem;*/
  }
  h1,.h1{font-size: 3.50rem;}
  h2,.h2{font-size: 3.00rem;}
  h3,.h3{font-size: 2.00rem;}
  h4,.h4{font-size: 1.75rem;}
  h5,.h5{font-size: 1.50rem;}
  h6,.h6{font-size: 1.25rem;}
}
.p1{font-size: 3.50rem;}
.p2{font-size: 3.00rem;}
.p3{font-size: 2.00rem;}
.p4{font-size: 1.75rem;}
.p5{font-size: 1.50rem;}
.p6{font-size: 1.25rem;}

/*general links*/
/**/
a{
  font-weight: inherit;
  color: inherit;
  text-decoration: none;
}
/*bold type*/
strong{
  color: var(--leb-color-main);  
}
/*multimedia element*/
video{
  width: 100%;
}
/*link in sections
a{
  text-decoration: none;
  font-family: inherit;
  color: inherit;
}*/
/*section p a {
  color: var(--leb-color-accent);
  transition: color .35s ease;
}
section p a:hover {
  color: var(--leb-color-third);
  text-decoration: none;
}*/
/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/
#header{
  height: 80px;
  transition: all 0.5s;
  z-index: 9999;
  background: var(--leb-color-white);
  -webkit-box-shadow: 0px 5px 15px 0px rgba(36,54,46,0.15); 
  box-shadow: 0px 5px 15px 0px rgba(36,54,46,0.15);
}
#header .logo img{
  padding: 0;
  margin: 0;
  max-height: 40px;
}
/*--------------------------------------------------------------
Navigation Menu
--------------------------------------------------------------*/
/*Desktop Navigation*/
.navbar{
  padding: 0;
}
.navbar ul{
  margin: 0;
  padding: 0;
  display: flex;
  display: -webkit-flex;
  list-style: none;
  align-items: center;
}
.navbar li{
  position: relative;
}
.navbar a, .navbar a:focus{
  display: flex;
  display: -webkit-flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0 10px 32px;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 80px;
  font-family: var(--leb-fontface-page);
  color: var(--leb-color-main);
  white-space: nowrap;
  text-decoration: none;
  transition: all 0.3s;
}
.navbar a i, .navbar a:focus i{
  font-size: 1.25rem;
  line-height: 0;
  margin-left: .5rem;
}
.navbar > ul > li > a:before{
  content:"";
  position: absolute;
  width: 0;
  height: 6px;
  bottom: 6px;
  left: 30px;
  background-color: var(--leb-color-accent);
  visibility: hidden;
  transition: all 0.3s ease-in-out 0s;
}
.navbar a:hover:before, .navbar li:hover > a:before, .navbar .active:before{
  visibility: visible;
  width: calc(100% - 30px);
}
.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a{
  color: var(--leb-color-accent);
}
.navbar .active{
  font-weight: 700;
}
.navbar .dropdown ul{
  display: block;
  position: absolute;
  left: 30px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background-color: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
  border-radius: 4px;
}
.navbar .dropdown ul li{
  min-width: 200px;
}
.navbar .dropdown ul a{
  padding: 1.5rem;
  font-size: 1rem;
  font-weight: 400;
  text-transform: none;
  text-decoration: none;
  color: var(--leb-color-main);
}
.navbar .dropdown ul a i{
  font-size: .75rem;
}
.navbar .dropdown ul a:hover, .navbar .dropdown ul .active:hover, .navbar .dropdown ul li:hover > a{
  color:  var(--leb-color-accent);
}
.navbar .dropdown:hover > ul{
  opacity: 1;
  top: 100%;
  visibility: visible;
}
.navbar .dropdown .dropdown ul{
  top: 0;
  left: calc(100% - 24px);
  visibility: hidden;
}
.navbar .dropdown .dropdown:hover > ul{
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}
@media (max-width: 1366px){
  .navbar .dropdown .dropdown ul{
    left: -90%;
  }
  .navbar .dropdown .dropdown:hover > ul{
    left: -100%;
  }
}
/*Mobile Navigation*/
.mobile-nav-toggle{
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
}
@media (max-width: 1199px){
  .mobile-nav-toggle{
    display: block;
  }
  .navbar ul{
    display: none;
  }
}
.navbar-mobile{
  position: fixed;
  overflow: hidden;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: rgba(80, 80, 80, 0.75);
  transition: 0.3s;
  z-index: 999;
}
.navbar-mobile .mobile-nav-toggle{
  position: absolute;
  top: 12px;
  right: 12px;
}
.navbar-mobile ul{
  display: block;
  position: absolute;
  top: 55px;
  right: 12px;
  bottom: 12px;
  left: 12px;
  padding: 12px 0;
  border-radius: 12px;
  background: #fff;
  overflow-y: auto;
  transition: 0.3s;
}
.navbar-mobile > ul > li > a:before{
  left: 20px;
}
.navbar-mobile a, .navbar-mobile a:focus{
  padding: 16px 20px;
  font-size: 1.25rem;
  color: var(--leb-color-main);
}
.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a{
  color: var(--leb-color-accent);
}
.navbar-mobile .getstarted, .navbar-mobile .getstarted:focus{
  margin: 12px;
}
.navbar-mobile .dropdown ul{
  position: static;
  display: none;
  margin: 12px 24px;
  padding: 12px 0;
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: #fff;
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
}
.navbar-mobile .dropdown ul li{
  min-width: 200px;
}
.navbar-mobile .dropdown ul a{
  font-size: 1rem;
  padding: 12px 24px;
}
.navbar-mobile .dropdown ul a i{
  font-size: 12px;
}
.navbar-mobile .dropdown ul a:hover, .navbar-mobile .dropdown ul .active:hover, .navbar-mobile .dropdown ul li:hover > a{
  color: var(--leb-color-accent);
}
.navbar-mobile .dropdown > .dropdown-active{
  display: block;
}
/*-----------------------------------------------------------------------------
Accordion Style fow FAQ
-----------------------------------------------------------------------------*/
.list-faq a{
  text-decoration: none;
  color: var(--leb-color-second) !important;
}
.list-faq a.active{
  text-decoration: none;
  color: var(--leb-color-main) !important;
}
.accordion-item{
}
.accordion-header{
  line-height: 1.3;
  font-weight: 700;
  font-size: inherit;
  font-family: var(--leb-fontface-page);
  color: var(--leb-color-fourth);
}
.accordion-button{
  padding: 1.5rem;
}

.accordion-button:not(.collapsed) {
  color: var(--leb-color-main);
  background-color: var(--leb-color-white);
  box-shadow: none;
}
.accordion-button:hover {
  z-index: 2;
}
.accordion-button:focus {
  z-index: 3;
  outline: 0;
  box-shadow: none;
}

@media only screen and (min-width: 1200px){
  .accordion-button{
    padding: 1rem;
    font-size: inherit;
  }
}
.accordion-body{
  padding: 1.5rem;
  font-size: 1.25rem;
  line-height: 1.4;
  font-weight: 400;
  background-color: var(--leb-color-light);
  border: 0;
}

/*------------------------------------------------
Featuring section style
------------------------------------------------*/
.featuring{
  background: var(--leb-color-main) url("../img/leb-consulting-homepage-background.jpg") no-repeat top left / contain;
}
@media only screen and (min-width: 992px){
  .featuring{
    background: var(--leb-color-main) url("../img/leb-consulting-homepage-background.jpg") no-repeat center center / cover;
  }
}
.featuring *{
  color: var(--leb-color-light);
}
.featuring {
}
.featuring h1{
/*font-size: 2.375rem;*/
color: var(--leb-color-accent);
}
.featuring-key .col-key{
  padding: 1.5rem;
  border: 1px solid rgba(86,117,112,1);
  background-color: rgba(86,117,112,.1);
  border-radius: .75rem;
}
@media (hover: hover){
  .featuring-key .col-key{
    padding: 1.5rem;
    border: 1px solid rgba(86,117,112,0);
    transition: all .35s ease;
    background-color: rgba(86,117,112,0);
    border-radius: 1.5rem;
  }
  .col-key:hover{
    border: 1px solid rgba(86,117,112,1);
    background-color: rgba(86,117,112,.1);
  }
}
.featuring-key .col-key p{
  color: var(--leb-color-second);
}
@media screen and (max-width: 992px){
  .featuring-col-right{
    display: none;
  }
}
/*------------------------------------------------
Services section style
------------------------------------------------*/
.services{
  position: relative;
}
.service-img{
  position: relative;  
}
.service-link{
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all .35s ease-in-out;
  background-color: rgba(182,157,116,.5);
  z-index: 2;
  border-radius: .75rem;
}
.service-link-icon{
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 4rem;
  height: 4rem;
  background-color: var(--leb-color-main);
  border-radius: 4rem;
  transition: all .35s ease-in-out;
  transform: scale(0);
}
.service-link-icon i{
  color: var(--leb-color-light);
}
.service-info{
  padding: 2.5rem 0;
}
.line-bottom{
  position: relative;
  width: 100%;
  height: 2px;
  background-color: var(--leb-color-third);
  z-index: 0;
}
.line-bottom::after{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background-color: var(--leb-color-main);
  z-index: 1;
  transition: all .35s ease;
}
.service-card:hover .service-link{
  opacity: 1;
}
.service-card:hover .service-link-icon{
  transform: scale(1);
}
.service-card:hover img{
  transform: scale(1.1) rotate(.75deg);
}
.service-card:hover .line-bottom::after{
  width: 100%;
}
.service-detail{
  padding: 1.5rem;
  border: 1px solid rgba(86,117,112,.3);
  background-color: rgba(86,117,112,.1);
  border-radius: .75rem;
  transition: all .35s ease;
}
.service-detail:hover{
  border: 1px solid rgba(86,117,112,1);
  background-color: rgba(86,117,112,.25);
}
/*------------------------------------------------
About section style
------------------------------------------------*/
.about{
  position: relative;
  background: var(--leb-color-main) url("../img/leb-consulting-homepage-background.jpg") no-repeat center left / cover;
}
.about p{
  color: var(--leb-color-light);
}
/*@media only screen and (min-width: 992px){
  .about-description{
    font-size: 1.75rem;
  }
}*/
.about-pro{
  position: relative;
  overflow: hidden;
}
.about-pro-info{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  opacity: 0;
  background-color: rgba(12,41,36,.5);
  transition: opacity .35s ease;
  border-radius: .75rem;
  z-index: 2;
}
.about-pro:hover .about-pro-info{
  opacity: 1;
}
.about-pro:hover img{
  transform: scale(1.1) rotate(.75deg);
}
.about-pro-info p{
  font-size: 2rem;
}
/*------------------------------------------------
Pro-section style
------------------------------------------------*/
.pro-container *{
  color: var(--leb-color-light);
}

.proCollaptible{
  cursor: pointer;
}
/*------------------------------------------------
Cta-section style
------------------------------------------------*/
.cta-section-left{
  background: var(--leb-color-main) url("../img/leb-consulting-homepage-background.jpg") no-repeat center left / cover;
  padding: 2rem;
}
@media screen and (min-width: 992px){
  .cta-section-left{
    padding: 8.3333333333%;
  }
}
.cta-section-right{
  aspect-ratio: 4/3;
  background: url("../img/leb-consulting-homepage-background-cta.jpg") no-repeat center center/ cover;
}
@media only screen and (min-width: 992px){
  .cta-section-right{
    aspect-ratio: auto;
  }
}
/*Newsletter*/
.newsletter{
  display: flex;
  flex-direction: column;
}
.newsletter input{
  box-sizing: border-box;
  display: inline-block;
  margin-bottom: 1rem;
  padding: 0 1.5rem;
  height: 4rem;
  box-shadow: none;
  border: 2px solid var(--leb-color-accent);outline: none;
  border-radius: 4rem;
  font-size: 1rem;
  line-height: 4rem;
  font-weight: 400;
  color: var(--leb-color-accent);
  background-color: var(--leb-color-main);
}
.newsletter input::placeholder{
  color: var(--leb-color-accent) !important;
}
.newsletter button{
  box-sizing: border-box;
  display: inline-block;
  padding: 0 1.5rem 0 1rem;
  height: 4rem;
  font-size: 1rem;
  line-height: 4rem;
  font-weight: 700;
  color: var(--leb-color-light);
  background-color: var(--leb-color-accent);
  border: 2px solid var(--leb-color-accent);
  box-shadow: none;
  outline: none;
  border-radius: 4rem;
}
@media only screen and (min-width: 576px){
  .newsletter{
    flex-direction: row;
  }
  .newsletter input{
    flex-grow: 2;
    border-radius: 4rem 0 0 4rem;
    margin-bottom: 0;
  }
  .newsletter button{
    border-radius: 0 4rem 4rem 0;
  } 
}
/*------------------------------------------------
FAQ section style
------------------------------------------------*/
.link-list{
  color: var(--leb-color-third);
  transition: all .35s ease;
}
.link-list:hover{
  color: var(--leb-color-main);
}
.link-list .active{
  color: var(--leb-color-main);
}
/*------------------------------------------------
News section style
------------------------------------------------*/
.news{
  position: relative;
}
.news-img{
  position: relative;  
}
.news-link{
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all .35s ease-in-out;
  background-color: rgba(182,157,116,.5);
  z-index: 2;
  border-radius: .75rem;
}
.news-link-icon{
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  width: 4rem;
  height: 4rem;
  background-color: var(--leb-color-main);
  border-radius: 4rem;
  transition: all .35s ease-in-out;
  transform: scale(0);
}
.news-link-icon i{
  color: var(--leb-color-light);
}
.news-info{
  padding: 2.5rem 0;
}
.line-bottom{
  position: relative;
  width: 100%;
  height: 2px;
  background-color: var(--leb-color-third);
  z-index: 0;
}
.line-bottom::after{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background-color: var(--leb-color-main);
  z-index: 1;
  transition: all .35s ease;
}
.news-card:hover .news-link{
  opacity: 1;
}
.news-card:hover .news-link-icon{
  transform: scale(1);
}
.news-card:hover img{
  transform: scale(1.1) rotate(.75deg);
}
.news-card:hover .line-bottom::after{
  width: 100%;
}
.news-date{
  font-size: 1rem;
  color: var(--leb-color-main);
}
.news-date i{
  color: var(--leb-color-accent);
}
.news-category{
  display: inline-block;
  padding: .5rem;
  font-size: .75rem;
  color: var(--leb-color-light);
  background-color: var(--leb-color-accent);
  border: 1px solid var(--leb-color-accent);
  border-radius: 2rem;
  
}
/*------------------------------------------------
Form section style
------------------------------------------------*/
#ajax-contact{
  display: block;
  width: 100%;
  background-color: var(--leb-color-main);
}
#ajax-contact label{
  margin-bottom: 1.5rem;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  color: var(--leb-color-accent);
}
#ajax-contact input, #ajax-contact textarea{
  width: 100%;
  margin-bottom: 1rem;
  padding: 1rem 1rem 1rem 0;
  box-shadow: none;
  border: 0;
  border-bottom: 2px solid var(--leb-color-second);
  border-radius: 0;
  outline: none;
  font-size: 1rem;
  line-height: 1;
  font-weight: 400;
  color: #fff;
  background-color: var(--leb-color-main);
}
input::placeholder, textarea::placeholder {
  font-size: 1rem;
  font-weight: 400;
  color: var(--leb-color-second) !important;
}
#ajax-contact .gdpr-capcha label{
  font-size: 1rem;
  line-height: 1.4em;
  font-weight: 400;
  color: var(--leb-color-second);
  hyphens: auto;
  text-align: left;
}
@media only screen and (min-width: 768px){
  #ajax-contact .gdpr-capcha label{
    text-align: justify;
  }
}
#ajax-contact button{
  display: inline-block;
  width: auto;
  height: auto;
  padding: 1rem 1.5rem;
  color: var(--leb-color-light);
  background-color: var(--leb-color-accent);
  border: 0;
  border-radius: 4rem;
}
.form-messages{
  display: block;
  padding: 1rem;
}
/*------------------------------------------------
Footer style
------------------------------------------------*/
footer{
  padding-top: 1.5rem;
  background: var(--leb-color-main);
}
footer *{
  color: var(--leb-color-light);
}
footer a{
  font-size: 1rem;
  text-decoration: none;
  transition: color .35s ease;
}
footer a:hover{
  color: var(--leb-color-accent);
}
footer.credits{
  text-align: center;
}
@media screen and (min-width: 768px){
  footer{
    padding-top: 3.375rem;
  }
  footer .credits{
    text-align: right;
  }
}
/*------------------------------------------------
End main style
------------------------------------------------*/