.logo-azienda{
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 100%;
  height: 200px;
  margin:0 auto;
  transition: 0.3s;
  Margin-bottom: 35px;
} 

.logo-azienda:hover{
  transform: scale(1.04);
transition-timing-function: cubic-bezier(.93,0,.63,.76);
}


.terah{
  background-image: url(../assets/img/Terah_LOGO.svg);
}

.terah_green{
  background-image: url(../assets/img/Terah_Green_LOGO.svg);
}

.terah_point{
  background-image: url(../assets/img/Terah_Point_LOGO.svg);
}

.mpco{
  background-image: url(../assets/img/logo_mpco.svg);
}

.mpco_rental{
  background-image: url(../assets/img/MPCO_Rental_LOGO.svg);
}

.mandatofacile{
  background-image: url(../assets/img/logo_mandatofacile.svg);
}

.mkt-lab{
  background-image: url(../assets/img/logo_mkt-lab.svg);
}


.phg_immobiliare{
  background-image: url(../assets/img/PHG_Immobiliare_LOGO.svg);
}

.phg_strategy{
  background-image: url(../assets/img/PHG_Strategy_LOGO.svg);
}

.logo{
  background-image: url(../assets/img/logo_white.svg);
  width: 50px;
  height: 50px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.logo_slide{
  background-image: url(../assets/img/logo_stroke_panza copia.svg);
  width: 30vw;
  height: 30vh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  margin: 0 auto;
}



 #mainNav.navbar-shrink .logo {
  -webkit-filter:invert(1);
      filter:invert(1);
}

.h-img{
  height: ;
}

.mission1{
  background-image: url(../assets/img/portfolio/thumbnails/1.jpg);
  max-width: 100%;
}

.mission2{
  background-image: url(../assets/img/portfolio/thumbnails/2.jpg);
    max-width: 100%;
}

.mission3{
  background-image: url(../assets/img/portfolio/thumbnails/3.jpg);
    max-width: 100%;
}

.img-fluid{
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  display: flex;
  align-items: center;
}


#mission .row{
    padding-right: 0!important;
    padding-left: 0!important;
    margin-top: 0!important;
  }

#mission .col{
    padding-right: 0!important;
    padding-left: 0!important;
    margin-top: 0!important;
  }





/* CONTATORE */

.counter-box {
    display: block;
    background: #f6f6f6;
    padding: 40px 20px 37px;
    text-align: center
}

.counter-box p {
    margin: 5px 0 0;
    padding: 0;
    color: #909090;
    font-size: 18px;
    font-weight: 500
}

.counter-box i {
    font-size: 60px;
    margin: 0 0 15px;
    color: #d2d2d2
}

.counter {
    display: block;
    font-size: 32px;
    font-weight: 700;
    color: #666;
    line-height: 28px
}

.counter-box.colored {
    background: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity));
}

.counter-box.colored p,
.counter-box.colored i,
.counter-box.colored .counter {
    color: #fff
}





.img1{
  background-image: url(../);
   
 
}

.img2{
  background-image: url(../assets/img/portfolio/thumbnails/2.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; 
 
}

.img3{
  background-image: url(../assets/img/portfolio/thumbnails/3.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;

}

.image {
  
  width: 100%;
  height: 100%;
  overflow: hidden;
  transition: transform 0.5s ease;
  text-align: center;
}
.image:hover {
  transform: scale(1.0);
}
.image--inverted:hover {
  transform: scale(0.96);
}
.image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.8s ease;
}
.image--inverted {
  transition: transform 0.5s ease;
}
.image:hover img {
  transform: scale(1.15);
}

h2 {
  padding: 0 15%;
  position: relative;
  z-index: 1000;
  
}

img:hover h2,
img:focus h2{
  display: block;
}


.up-img{
  position: absolute;
  
  padding-top: 18vh;
}

.up-img-bis{
  position: absolute;
  width: 50vw;
  padding-top: 35vh;
}

#overlay {
  position: relative; /* Sit on top of the page content */
  display: ; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  
  background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}


.container-mission {  
  height: 80vh;
  display: grid;
  grid-template-columns: 50% 50%;
  grid-template-rows: 50% 50%;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "img1 img2"
    "img1 img3";
}

.img1 { grid-area: img1; }

.img2 { grid-area: img2; }

.img3 { grid-area: img3; }




@media (max-width: 800px) {
    .container-mission {  
      display: grid;
      grid-template-columns: 100%;
      grid-template-rows: 350px;
      gap: 0px 0px;
      grid-auto-flow: row;
      grid-template-areas:
        "img1"
        "img2"
        "img3";
    }


    .up-img{
      position: absolute;
      text-align: center;
      padding-top: 15vh;
      margin: 0 10%;
    }

    .up-img-bis{
      position: absolute;
      text-align: center;
      padding-top: 15vh;
      width: 100%;
    }
        
    .container-mission{
      display: contents;
    }    

    .image img{
      height: 350px;
    }
}




#reveal1 {
    opacity: 0;
    -webkit-transform: scale(0.9);
       -moz-transform: scale(0.9);
        -ms-transform: scale(0.9);
         -o-transform: scale(0.9);
            transform: scale(0.9);
    -webkit-transition: all 1s ease-in-out;
       -moz-transition: all 1s ease-in-out;
        -ms-transition: all 1s ease-in-out;
         -o-transition: all 1s ease-in-out;
            transition: all 1s ease-in-out;
  }
  #reveal1.visible {
    opacity: 1;
    -webkit-transform: none;
       -moz-transform: none;
        -ms-transform: none;
         -o-transform: none;
            transform: none;
  }



 /* SVG ANIMATION */
/***************************************************
 * Generated by SVG Artista on 11/18/2024, 4:54:46 PM
 * MIT license (https://opensource.org/licenses/MIT)
 * W. https://svgartista.net
 **************************************************/

.controls{
  display: none;
}

svg .svg-elem-1 {
  stroke-dashoffset: 128.1259994506836px;
  stroke-dasharray: 128.1259994506836px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.8s;
}

svg.active .svg-elem-1 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-2 {
  stroke-dashoffset: 138.94569396972656px;
  stroke-dasharray: 138.94569396972656px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 0.9s;
}

svg.active .svg-elem-2 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-3 {
  stroke-dashoffset: 69.84402465820312px;
  stroke-dasharray: 69.84402465820312px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1s;
}

svg.active .svg-elem-3 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-4 {
  stroke-dashoffset: 136.85693359375px;
  stroke-dasharray: 136.85693359375px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.1s;
}

svg.active .svg-elem-4 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-5 {
  stroke-dashoffset: 51.08403015136719px;
  stroke-dasharray: 51.08403015136719px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2000000000000002s;
}

svg.active .svg-elem-5 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-6 {
  stroke-dashoffset: 139.41763305664062px;
  stroke-dasharray: 139.41763305664062px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3s;
}

svg.active .svg-elem-6 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-7 {
  stroke-dashoffset: 120.38805389404297px;
  stroke-dasharray: 120.38805389404297px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.4000000000000001s;
}

svg.active .svg-elem-7 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-8 {
  stroke-dashoffset: 120.38587188720703px;
  stroke-dasharray: 120.38587188720703px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.5s;
}

svg.active .svg-elem-8 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-9 {
  stroke-dashoffset: 140.30580139160156px;
  stroke-dasharray: 140.30580139160156px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.96s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 0.96s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.6s;
}

svg.active .svg-elem-9 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-10 {
  stroke-dashoffset: 138.94432067871094px;
  stroke-dasharray: 138.94432067871094px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.08s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.08s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7000000000000002s;
}

svg.active .svg-elem-10 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-11 {
  stroke-dashoffset: 115.11726379394531px;
  stroke-dasharray: 115.11726379394531px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.2s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.8s;
}

svg.active .svg-elem-11 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-12 {
  stroke-dashoffset: 118.65804290771484px;
  stroke-dasharray: 118.65804290771484px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3199999999999998s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.3199999999999998s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 1.9000000000000001s;
}

svg.active .svg-elem-12 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-13 {
  stroke-dashoffset: 516.3360595703125px;
  stroke-dasharray: 516.3360595703125px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.44s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.44s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2s;
}

svg.active .svg-elem-13 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-14 {
  stroke-dashoffset: 314.11309814453125px;
  stroke-dasharray: 314.11309814453125px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.56s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.56s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.1s;
}

svg.active .svg-elem-14 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-15 {
  stroke-dashoffset: 269.5844421386719px;
  stroke-dasharray: 269.5844421386719px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.68s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.68s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.2s;
}

svg.active .svg-elem-15 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-16 {
  stroke-dashoffset: 266.7451171875px;
  stroke-dasharray: 266.7451171875px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7999999999999998s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.7999999999999998s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.3s;
}

svg.active .svg-elem-16 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-17 {
  stroke-dashoffset: 219.50982666015625px;
  stroke-dasharray: 219.50982666015625px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.92s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 1.92s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4000000000000004s;
}

svg.active .svg-elem-17 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-18 {
  stroke-dashoffset: 52.08258056640625px;
  stroke-dasharray: 52.08258056640625px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.04s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.04s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.5s;
}

svg.active .svg-elem-18 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-19 {
  stroke-dashoffset: 219.5082550048828px;
  stroke-dasharray: 219.5082550048828px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.16s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.16s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.6s;
}

svg.active .svg-elem-19 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-20 {
  stroke-dashoffset: 52.08256149291992px;
  stroke-dasharray: 52.08256149291992px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.28s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.7s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.28s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.7s;
}

svg.active .svg-elem-20 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-21 {
  stroke-dashoffset: 610.5868530273438px;
  stroke-dasharray: 610.5868530273438px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.8s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.4s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.8s;
}

svg.active .svg-elem-21 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}

svg .svg-elem-22 {
  stroke-dashoffset: 610.5904541015625px;
  stroke-dasharray: 610.5904541015625px;
  fill: transparent;
  -webkit-transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.52s,
                        fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.9000000000000004s;
          transition: stroke-dashoffset 1s cubic-bezier(0.47, 0, 0.745, 0.715) 2.52s,
                fill 0.7s cubic-bezier(0.47, 0, 0.745, 0.715) 2.9000000000000004s;
}

svg.active .svg-elem-22 {
  stroke-dashoffset: 0;
  fill: rgb(255, 255, 255);
}


 /* HAMBURGER */

 
.toggle {
  display: block;
  cursor: pointer;
}
.toggle input {
  display: none;
}
.toggle input + div {
  width: 20px;
  height: 14px;
  position: relative;
}
.toggle input + div div {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  transition: transform 0.5s ease;
}
.toggle input + div div span {
  display: block;
  position: absolute;
  left: 0;
  right: 0;
}
.toggle input + div div span:first-child {
  top: 0;
}
.toggle input + div div span:first-child:before, .toggle input + div div span:first-child:after {
  top: 0;
}
.toggle input + div div span:last-child {
  bottom: 0;
}
.toggle input + div div span:last-child:before, .toggle input + div div span:last-child:after {
  bottom: 0;
}
.toggle input + div div span:before, .toggle input + div div span:after {
  content: "";
  display: block;
  width: 47%;
  height: 2px;
  border-radius: 1px;
  background: black;
  position: absolute;
  -webkit-backface-visibility: hidden;
  transition: transform 0.5s ease, border-radius 0.3s ease, background 0.4s ease;
}
.toggle input + div div span:before {
  left: 0;
  transform-origin: 0 50%;
  transform: translate(1px, 0) scaleX(1.1);
}
.toggle input + div div span:after {
  right: 0;
  transform-origin: 100% 50%;
  transform: translate(-1px, 0) scaleX(1.1);
}
.toggle input + div svg {
  display: block;
  fill: none;
  stroke: black;
  stroke-width: 2px;
  width: 44px;
  height: 44px;
  stroke-linecap: round;
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -22px 0 0 -22px;
  stroke-dasharray: 0 82.801 8 82.801;
  stroke-dashoffset: 82.801;
  transform-origin: 50% 50%;
  -webkit-backface-visibility: hidden;
  transform: scale(1);
  transition: stroke-dashoffset 0.5s ease, stroke-dasharray 0.6s ease, transform 0.5s ease, stroke 0.4s ease;
}
.toggle input + div svg:nth-child(3) {
  transform: rotate(180deg) scale(1);
}
.toggle input:checked + div div {
  transform: rotate(90deg);
}
.toggle input:checked + div div span:before, .toggle input:checked + div div span:after {
  background: black;
}
.toggle input:checked + div div span:first-child:before {
  transform: rotate(45deg) translate(2.2px, -3px) scaleX(1.05);
}
.toggle input:checked + div div span:first-child:after {
  transform: rotate(-45deg) translate(-2.2px, -3px) scaleX(1.05);
}
.toggle input:checked + div div span:last-child:before {
  transform: rotate(-45deg) translate(2.2px, 3px) scaleX(1.05);
}
.toggle input:checked + div div span:last-child:after {
  transform: rotate(45deg) translate(-2.2px, 3px) scaleX(1.05);
}
.toggle input:checked + div svg {
  stroke-dashoffset: 62;
  stroke-dasharray: 0 82.801 62 82.801;
  transform: rotate(90deg);
  stroke: black;
}
.toggle input:checked + div svg:nth-child(3) {
  transform: rotate(270deg);
}

body .dribbble {
  position: fixed;
  display: block;
  right: 24px;
  bottom: 24px;
}
body .dribbble img {
  display: block;
  width: 76px;
}
.hamburger{
    display: none;
  }

@media (max-width: 992px){
  .hamburger{
    display: unset;
  }
}