*,
*::after,
*::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

:root {
  scroll-behavior: smooth;
  --main-color: #212529;
  --second-hue: 0;
  --second-saturation: 84%;
  --second-lightness: 44%;
  --second-color: hsl(
    var(--second-hue),
    var(--second-saturation),
    var(--second-lightness)
  );
  --section-light-gray: #eee;
  --hover-ligt-color: hsl(0, 84%, 49%);
  --selection-color: hsla(
    var(--second-hue),
    var(--second-saturation),
    var(--second-lightness),
    0.7
  );

  --body-font: "Open Sans", system-ui;
  --h2-h1-font: "Amatic SC", sans-serif;
  --h3-h4font: "Inter", sans-serif;
  --last-font: Arial, Helvetica, sans-serif;
  --md-gray: rgb(125, 125, 125);
  --transition-du: 400ms;
  --p-header-color: rgb(79, 79, 90);
  --h1-header-color: rgb(55, 55, 63);
  --light-graytext: rgb(127, 127, 144);
  scroll-padding-top: 5rem;
  --txt-select-color-white: white;
  --section-white:white;
  --nav-hover:black;
  --mark-color: rgb(33, 37, 41);
  --color-contact-inner:#F5F5F5;
  --input-background:white;
  --dayess: rgb(33, 37, 41);
  --cheefs:white;
  --selsection-color:white;
}


.dark{
  --second-color:#C17E1F;
  --selection-color:#926321;
  --txt-select-color:#171717;
  --hover-ligt-color:#D78C23;
  --section-light-gray: #252525;
  --section-white:#202020;
  --nav-hover:white;
  --mark-color:white;
  --h1-header-color:white; 
  --color-contact-inner:#0D0D0D;
  --input-background:#171717;
  --dayess:white;
  --cheefs:#171717;
  --selsection-color:black;
}

body {
  margin: 0;
  font-family: var(--body-font);
}
h1,
h2 {
  font-family: var(--h2-h1-font);
}
h3,
h4,
h5,
h6 {
  font-family: var(--h3-h4font);
  font-family: Arial, Helvetica, sans-serif;
}

a {
  text-decoration: none;
  color: inherit;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.container {
  width: 85%;
  margin: 0 auto;
}

::-moz-selection {
  color: var(--selsection-color);
  background-color: var(--selection-color);
}

::selection {
  color: var(--selsection-color);
  background-color: var(--selection-color);
}


h2 {
  color: var( --nav-hover) ;
  font-size: 3.125rem;
  margin: 0;
  font-weight: 400;
}
.spacial {
  color: var(--selection-color);
}
.title {
  text-align: center;
  margin-block: 2.5rem;
}
h3 {
  color: var( --nav-hover) ;
  font-weight: 700;
  font-size: 1.1875rem;
  margin: 0.1875rem;
}
span.sections {
  color: var(--light-graytext);
  font-size: 0.875rem;
  text-transform: uppercase;
}

#mark span::after {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  background-color: var(--second-color);
  position: absolute;
  bottom: 0.25rem;
  border-radius: 50%;
}

/* start nav */
nav .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  position: fixed;
  width: 100%;
  z-index: 9999999;
  padding: 1.25rem 3.75rem;
  -webkit-box-shadow: 0px 0px 0.3125rem gray;
          box-shadow: 0px 0px 0.3125rem gray;
  background-color: var(--section-white);
}
nav .container li {
  display: inline-block;
  margin: 0.625rem;
}

.links ul a::after {
  content: "";
  width: 0%;
  height: .1875rem;
  background-color: var(--second-color);
  position: absolute;
  bottom: -0.1875rem;
  left: 0;
  -webkit-transition: var(--transition-du) width;
  -o-transition: var(--transition-du) width;
  transition: var(--transition-du) width;
}
.links ul a:hover::after {
  width: 100%;
}

.links a {
  position: relative;
  text-align: center;
  -webkit-transition: var(--transition-du) color;
  -o-transition: var(--transition-du) color;
  transition: var(--transition-du) color;
}
nav .container a:hover {
  color: var(--nav-hover);
}

#mark span {
  color:var(--mark-color);
  font-weight: 700;
  font-size: 1.875rem;
  position: relative;
  padding-left: 3.75rem;
}

.links {
  font-size: 1.0625rem;
  font-weight: 600;
  color: var(--md-gray);
}



:target nav:has(a){
  color: aquamarine;
}

ul li.active a{
     color: var(--nav-hover);
     border-bottom: solid 3px var(--second-color);
}

/* for dark & light mode */
.toggle {
  width: 3.125rem;
  height: 3.125remx;
  height: 2.5rem;
  position: relative;
  padding-right: 3.75rem;
}

.toggle i {
  font-size: 1.875rem;
  pointer-events: none;
}
.toggle .fa-moon {
  position: absolute;
  top: 20%;
  left: 50%;
  -webkit-transform: translate(-50%);
      -ms-transform: translate(-50%);
          transform: translate(-50%);
}
.toggle .fa-sun {
  opacity: 0;
  position: absolute;
  top: 20%;
  left: 50%;
  -webkit-transform: translate(-50%);
      -ms-transform: translate(-50%);
          transform: translate(-50%);
  color: white;
}

.toggle input {
  opacity: 0;
  width: 3.125rem;
  height: 1.875rem;
  cursor: pointer;
}

.toggle input:checked + .toggle-botton .fa-moon {
  opacity: 0;
}
.toggle input:checked + .toggle-botton .fa-sun {
  opacity: 1;
}

/* end nav */

/* start section header */

header {
  background-color: var(--section-light-gray);
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  padding-bottom: 4.375rem;
}

header#home .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.contant-head {
  width: 40%;
}

header picture {
  width: 40%;
}
header picture img {
  width: 100%;
}

.contant-head .head-title h1 {
  font-size: 4.0625rem;
  font-weight: 700;
  color: var(--h1-header-color);
  margin: 0;
}
.contant-head .head-title p {
  color: var(--p-header-color);
  margin-bottom: 1.25rem;
}

.head-botton {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

.head-botton .a-button1 {
  width: 28%;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  background-color: var(--second-color);
  text-align: center;
  padding: 0.75rem;
  border-radius: 0rem 3.125rem 3.125rem;
  color: var(--input-background);
  margin-right: 1.875rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: var(--transition-du) background-color;
  -o-transition: var(--transition-du) background-color;
  transition: var(--transition-du) background-color;
}
.head-botton .span-button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

.a-button2 .icon-play {
  background-color: var(--input-background);
  width: 2.8125rem;
  height: 2.8125rem;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.border {
  background-image: -o-linear-gradient(
    left,
    var(--second-color) 50%,
    var(--section-light-gray) 50%
  );
  background-image: -webkit-gradient(
    linear,
    left top, right top,
    color-stop(50%, var(--second-color)),
    color-stop(50%, var(--section-light-gray))
  );
  background-image: linear-gradient(
    90deg,
    var(--second-color) 50%,
    var(--section-light-gray) 50%
  );
  padding: 0.5rem 0 0.5rem 0.5rem;
  border-radius: 50%;
}

.a-span2 {
  padding-left: 0.625rem;
 
}
.a-span2 span {
  font-weight: 600;
}
.a-button1:hover {
  background-color: var(--hover-ligt-color);
}

.span-button:hover {
  color: var(--hover-ligt-color);
}
.span-button {
  color: var(--nav-hover);
}

.span-button > a {
  -webkit-transition: var(--transition-du) color;
  -o-transition: var(--transition-du) color;
  transition: var(--transition-du) color;
}
#home picture img {
  -webkit-filter: drop-shadow(4px 4px 9px #000a);
          filter: drop-shadow(4px 4px 9px #000a);
}

#home picture img:hover {
  -webkit-animation: shake 0.5s;
          animation: shake 0.5s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@-webkit-keyframes shake {
  0% {
    -webkit-transform: translate(1px, 1px) rotate(0deg);
            transform: translate(1px, 1px) rotate(0deg);
  }
  10% {
    -webkit-transform: translate(-1px, -2px) rotate(-1deg);
            transform: translate(-1px, -2px) rotate(-1deg);
  }
  20% {
    -webkit-transform: translate(-3px, 0px) rotate(1deg);
            transform: translate(-3px, 0px) rotate(1deg);
  }
  30% {
    -webkit-transform: translate(3px, 2px) rotate(0deg);
            transform: translate(3px, 2px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(1px, -1px) rotate(1deg);
            transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    -webkit-transform: translate(-1px, 2px) rotate(-1deg);
            transform: translate(-1px, 2px) rotate(-1deg);
  }
  60% {
    -webkit-transform: translate(-3px, 1px) rotate(0deg);
            transform: translate(-3px, 1px) rotate(0deg);
  }
  70% {
    -webkit-transform: translate(3px, 1px) rotate(-1deg);
            transform: translate(3px, 1px) rotate(-1deg);
  }
  80% {
    -webkit-transform: translate(-1px, -1px) rotate(1deg);
            transform: translate(-1px, -1px) rotate(1deg);
  }
  90% {
    -webkit-transform: translate(1px, 2px) rotate(0deg);
            transform: translate(1px, 2px) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(1px, -2px) rotate(-1deg);
            transform: translate(1px, -2px) rotate(-1deg);
  }
}

@keyframes shake {
  0% {
    -webkit-transform: translate(1px, 1px) rotate(0deg);
            transform: translate(1px, 1px) rotate(0deg);
  }
  10% {
    -webkit-transform: translate(-1px, -2px) rotate(-1deg);
            transform: translate(-1px, -2px) rotate(-1deg);
  }
  20% {
    -webkit-transform: translate(-3px, 0px) rotate(1deg);
            transform: translate(-3px, 0px) rotate(1deg);
  }
  30% {
    -webkit-transform: translate(3px, 2px) rotate(0deg);
            transform: translate(3px, 2px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(1px, -1px) rotate(1deg);
            transform: translate(1px, -1px) rotate(1deg);
  }
  50% {
    -webkit-transform: translate(-1px, 2px) rotate(-1deg);
            transform: translate(-1px, 2px) rotate(-1deg);
  }
  60% {
    -webkit-transform: translate(-3px, 1px) rotate(0deg);
            transform: translate(-3px, 1px) rotate(0deg);
  }
  70% {
    -webkit-transform: translate(3px, 1px) rotate(-1deg);
            transform: translate(3px, 1px) rotate(-1deg);
  }
  80% {
    -webkit-transform: translate(-1px, -1px) rotate(1deg);
            transform: translate(-1px, -1px) rotate(1deg);
  }
  90% {
    -webkit-transform: translate(1px, 2px) rotate(0deg);
            transform: translate(1px, 2px) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(1px, -2px) rotate(-1deg);
            transform: translate(1px, -2px) rotate(-1deg);
  }
}

/* end section header */

/* start section chefs */
#chefs {
  padding-block: 3.125rem 4.375rem;
  background-color: var(--section-white);
}
#chefs .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.person {
  background-color: var(--cheefs);
  width: calc(33.33% - 1.875rem);
  overflow: hidden;
  -webkit-transition: var(--transition-du) transform;
  -o-transition: var(--transition-du) transform;
  transition: var(--transition-du) transform;
  margin-inline: 15px;
  border-radius: 0.5rem;
  -webkit-box-shadow: 0.1875rem 0.1875rem 0.9375rem 0rem rgba(0, 0, 0, 0.1);
          box-shadow: 0.1875rem 0.1875rem 0.9375rem 0rem rgba(0, 0, 0, 0.1);
  position: relative;
}
.person img {
  width: 100%;
  position: relative;
}

.cheef-pic {
  position: relative;
}
.person img[alt="wave"] {
  /* position: absolute; */
  /* top: 40%; */
  width: 100%;
  position: relative;
  /* bottom: 10px; */
  -webkit-transform: translateY(-100%);
      -ms-transform: translateY(-100%);
          transform: translateY(-92%);

}
.cheef-info {
  text-align: center;
  width: 90%;
  margin: auto;
  position: relative;
  -webkit-transform: translateY(-60%);
      -ms-transform: translateY(-60%);
          transform: translateY(-60%);
}
.cheef-info :nth-child(2),
.cheef-info :nth-child(3) {
  color: var(--light-graytext);
  font-size: 0.9375rem;
}
.cheef-info :nth-child(3) {
  font-style: italic;
  margin-block: 0.5rem;
}
.links-cheef {
  background-color: #ffffff4d;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  position: absolute;
  left: 100%;
  top: 2.5rem;
  -webkit-transition: var(--transition-du) left;
  -o-transition: var(--transition-du) left;
  transition: var(--transition-du) left;
  padding: 0.5rem;
  border-radius: 0.3125rem;
}
.links-cheef i {
  font-size: 1.125rem;
  padding: 0.625rem 0.3125rem;
  color: #37373f66;
  -webkit-transition: var(--transition-du) color;
  -o-transition: var(--transition-du) color;
  transition: var(--transition-du) color;
}
.links-cheef i:hover {
  color: #414146;
  cursor: pointer;
}

.person:hover .links-cheef {
  -webkit-transition-delay: var(--transition-du);
       -o-transition-delay: var(--transition-du);
          transition-delay: var(--transition-du);
  left: 85%;
}
.person:hover {
  -webkit-transform: scale(1.07);
      -ms-transform: scale(1.07);
          transform: scale(1.07);
}

/* end section chefs */

/* start section gallary */

#gallery {
  padding-block: 3.125rem 4.375rem;
  background-color: var(--section-light-gray);
 
}


.row {
  padding: 0 0.5rem;
  /* -webkit-column-count: 3;
     -moz-column-count: 3;
          column-count: 3; */
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -ms-flex-wrap: wrap;
              flex-wrap: wrap;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
           height: 1200px;
          gap: 20px;
}
.row picture{
  width: 33.33%;
}

.row img {
  width: 100%;
  display: block;
  -webkit-transition: var(--transition-du) transform;
  -o-transition: var(--transition-du) transform;
  transition: var(--transition-du) transform;
}

.img-layer {
  /* margin-bottom: 1rem; */
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: hidden;
  border: solid 0.25rem white;
}
.layer-txt {
  background-color: #00000096;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 100%;
  opacity: 0;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: var(--transition-du) opacity, var(--transition-du) top;
  -o-transition: var(--transition-du) opacity, var(--transition-du) top;
  transition: var(--transition-du) opacity, var(--transition-du) top;
}
.layer-txt h4 {
  width: 100%;
  margin: 0;
  font-weight: 700;
  font-size: 1.5rem;
  color: white;
}
.layer-txt p {
  width: 100%;
  color: rgb(221, 221, 221);
  margin: 0.125rem;
}

.img-layer:hover .layer-txt {
  opacity: 1;
  top: 0;
}
.img-layer:hover img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}
.img-layer:hover .layer-txt {
  opacity: 1;
  top: 0;
}

/* end section gallary */

/* start section contact */

#contact {
  padding-block: 3.125rem;
  background-color: var(--section-white);
}

.div-ifarme,
.contact-info,
.sign-in {
  margin-block: 1.25rem;
  width: 100%;
}
.div-ifarme iframe {
  width: 100%;
  height: 45vh;
}

.contact-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      gap: 15px;
}
.contact-info .item {
  width: calc((100% / 2) - 10px);
}
.inner {
  /* margin-block: 0.625rem; */
  background-color:var(--color-contact-inner);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 1.25rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.inner .information span {
  font-size: 1.25rem;
  font-weight: 700;
  font-family: var(--h3-h4font);
  color: var(--light-graytext);
}
.inner .information p {
  color: var(--nav-hover);
  margin-block: 0.1875rem;
}
.inner .information p:hover {
  cursor: pointer;
}
.information {
  margin-left: 0.625rem;
}

.icon-contact {
  background-color: var(--second-color);
  width: 10%;
  height: 3.75rem;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.icon-contact i {
  font-size: 1.25rem;
  color: white;
}
#contact .dayes {
  font-weight: 700;
  color: var(--dayess);
  font-size: 1rem;
}

.sign-in {
  background-color: var( --input-background);
  width: 100%;
  -webkit-box-shadow: 0 0 1.875rem #00000014;
          box-shadow: 0 0 1.875rem #00000014;
  padding: 1.25rem;
}
#contact form {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
#contact form :nth-child(2) {
  padding-left: 1.25rem;
}

#contact form :nth-child(2),
form :nth-child(1) {
  width: 50%;
}
#contact form :nth-child(3),
form :nth-child(4) {
  width: 100%;
}
#contact input,
#contact textarea {
  width: 100%;
  padding: 0.9375rem;
  font-size: inherit;
  font-family: inherit;
  border: solid 0.125rem rgb(232, 227, 227);
  outline: none;
}
#contact textarea {
  resize: vertical;
  font-size: inherit;
}

.input-button {
  width: 100%;
  text-align: center;
}
.input-button button {
  margin-top: 1.25rem;
  width: 13%;
  border-radius: 1.875rem;
  background-color: var(--second-color);
  border: none;
  padding-block: 0.9375rem;
  font-family: inherit;
  color: white;
  -webkit-transition: var(--transition-du);
  -o-transition: var(--transition-du);
  transition: var(--transition-du);
}
button:hover {
  background-color: var(--hover-ligt-color);
  cursor: pointer;
}

#contact .input-info {
  margin-bottom: 0.75rem;
}


/* focus on input -->  remove issintial border-->outline: none; */
#contact .sign-in input:focus {
  border: 3px solid var(--second-color);
}
#contact .sign-in textarea:focus {
  border: 3px solid var(--second-color);
}

/* end section contact */

/* start section footer */
#footer {
  background-image:-o-linear-gradient(#0009, #0009), url(../images/textured-metal-background.jpg);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#0009), to(#0009)), url(../images/textured-metal-background.jpg);
  background-image:linear-gradient(#0009, #0009), url(../images/textured-metal-background.jpg);
 background-size: cover;
  color: white;
  padding-block: 2.5rem;
  position: relative;
  overflow: hidden;
}
#footer span.span-footer{
  font-weight: 700;
  font-size: 1.1875rem;
  font-family: var(--h3-h4font);
  position: relative;
}
#footer .container{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.social{
  width: 25%;
}
.subscribe{
  width: 50%;
}
.get-in{
width: 25%;
}
img[alt="meal footer"]{
  width: 15%;
}
#footer .marked #mark span{
  color: white;
  padding:0 ;
  margin-left: .9375rem;
   vertical-align: -1.2rem;
}
.marked p{
  width: 100%;
}
.title-of-footer{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack:baseline;
      -ms-flex-pack:baseline;
          justify-content:baseline;
}
.social-media{
  text-align: center;
}
.social-media span{
   font-weight: 700;
   font-size: 1.1875rem;
   font-family: var(--h3-h4font);
   position: relative;
}
.social-media span::after{
  content: "";
  position: absolute;
   width: 250%;
   height: .125rem;
   background-color:#585858 ;
   bottom: -0.9375rem;
   left:-85%;
}
.links-footer{
  padding-block: 2.5rem;
  padding-right: 1.25rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}
.links-footer i{
  font-size: 1.5625rem;
}

.info-subscribe p{
  width: 95%;
  margin-block: .5rem;
}

.email-add input{
  width: 80%;
  padding: .6875rem;
  margin-right: .3125rem;
  margin-block: .625rem;
  border: none;
  outline: none;
}
/* .email-add input:focus {
  border: 3px solid var(--second-color);
} */


.email-add form{
  font-family: Arial, Helvetica, sans-serif;
 font-size: .9375rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
 
}
#footer .email-add button{
 width: 20%;
 height: -webkit-fit-content;
 height: -moz-fit-content;
 height: fit-content;
  padding:.625rem ;
  margin-top: .5rem ;
  text-align: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: var(--input-background);
  background-color: var(--second-color);
  -webkit-transition: var(--transition-du)  background-color ;
  -o-transition: var(--transition-du)  background-color ;
  transition: var(--transition-du)  background-color ;
  border: none;
  
}
#footer .email-add button:hover{
  background-color: var(--hover-ligt-color);
}
#footer .email-add button i{
 font-size: .9375rem;
 -webkit-box-align: baseline;
     -ms-flex-align: baseline;
         align-items: baseline;
 margin-top: .25rem;
}
#footer .email-add span{
 text-transform: capitalize;
 padding-right: .1875rem;
 -webkit-box-align: baseline;
     -ms-flex-align: baseline;
         align-items: baseline;
 margin-top: .125rem;
 font-weight: 500;
 font-size: 1rem;
}


.quick-links{
 display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 -ms-flex-wrap:wrap ;
     flex-wrap:wrap ;
}
.quick-links span{
 width: 100%;
 margin-block: .5rem;
}
.quick-links ul{
 width: 50%;
}
.quick-links :nth-child(2):not(li){
  width: calc(50% - .75rem);
 margin-right: .75rem;
}
.quick-links li{
 position: relative;
 padding: .3125rem;
}
.quick-links li i{
 margin-right: .3125rem;
}
.quick-links li span{
margin-bottom: .3125rem;
}

.quick-links li:hover{
  background-color: #222222;
  -webkit-transform: translateX(.625rem);
      -ms-transform: translateX(.625rem);
          transform: translateX(.625rem);
 }
#footer .quick-links li{
  -webkit-transition: var(--transition-du) transform,  var(--transition-du) background-color;
  -o-transition: var(--transition-du) transform,  var(--transition-du) background-color;
  transition: var(--transition-du) transform,  var(--transition-du) background-color;
}


.get-in{
  margin-left: .9375rem;
}
.get-in ul li i{ 
  margin-left: .625rem;
  font-size: 1.375rem;
  color: var(--second-color);
}
.get-in ul li {
  margin-bottom: .9375rem;
}
.get-in ul li span{
  margin-left: .625rem;
  vertical-align: .125rem;

}
.get-in ul li.spach {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-top: .625rem;
}
/* end section footer */