/* Core Styles */
:root{
  --primary: #ddd;
  --dark: #333;
  --light: #fff;
  --shadow: 0 1px 5px rgba(104, 104, 104, 0.8);
}
html, body{
    margin: 0;
    padding: 0;
    width: 100%;
}

body{
  font-family: Arial, Helvetica, sans-serif;
  background: #333;
  color: #fff;
  font-size: 1.1em;
  line-height: 1.5;
  text-align: center;
}

header {
  width: 100%;
  height: 450px;
  background: url(../images/cover3.jpg) no-repeat 50% 50%;
  background-size: cover;
}

img{
  display: block;
  width: 100%;
  height: auto;
}


h1, h2, h3 {
  margin: 0;
  padding: 1em 0;
}


p{
  margin: 0;
  padding: 1em 0;
}
b{
  color: #ac3b61;
}

.btn{
  display: inline-block;
  background: #333;
  color: #fff;
  text-decoration: none;
  padding: 1em 2em;
  border: 1px solid #666;
  margin: .5em 0;
}

.btn:hover{
  background: #eaeaea;
  color: #333;
}



#showcase h1{
  padding-top: 100px;
  padding-bottom:0;
}

#showcase .content-wrap,
#section-a .content-wrap{
  padding: 0 1.5em;
}

#showcase small{
    color: #e85a4f;

}
/*Section A*/

#section-a{
  background: #bab2b5;
  color: #333;
  padding-bottom: 2em;
  padding-top: 2em;
}

#section-a ul{
  list-style: none;
  margin: 0;
  padding: 0;
}
.re-tighten-prices h3,
.sisterlocks-prices h3,
.service-notes h2{
  color: #116466;
}
.note b{
  color: #e85a4f;
}
.sisterlocks-prices{
  /* border-radius: 10px 10px 0 0; */
  width: 90%;
  background: white;
  display: block;
  grid-area: sisterlocks-prices;
  justify-self:center;
  margin: auto;
  box-shadow: var(--shadow);
}

.re-tighten-prices{
  border-radius: 0 0 10px 10px;
  width: 90%;
  background: white;
  display: block;
  grid-area: re-tighten-prices;
  justify-self:center;
  margin: auto;
  box-shadow: var(--shadow);
}
.service-notes{
  border-radius: 10px 10px 0 0; 
  width: 90%;
  background: white;
  display: block;
  grid-area: service-notes;
  justify-self:center;
  margin: auto;
  box-shadow: var(--shadow);
}
.top{
  border-radius: 10px 10px 0 0;
  background: white;
  width: 100%;
  display: block;
  grid-area: top;

}

/* Section B */

#section-b{
  padding: 2em 1em 1em;
}

#section-b ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

#section-b li{
  margin-bottom: 1em;
  background: #d8c3a5;
  color: #333;
  /* box-shadow: var(--shadow); */
border-radius: 10px;
}
#section-b .card img{
  border-radius: 10px 10px 0 0;
}

.card-content{
  padding: 1.5em;
}

/* Section  C*/

#section-c {
  background: #bab2b5;
  color: #333;
  padding: 2em 2em 8em 2em;

}

/* #section-c .gallery-grid{
  align-items: center;
  width: 100%;
}
#section-c img{
  margin-bottom: 1em;
  width: 100%;

  box-shadow: var(--shadow);
}
.item{
    width:250px;
    height: 250px;
    background: #fff;
}

#section-c .gallery-grid img{
  transition: 1s;
}

#section-c .gallery-grid img:hover{
  transform: scale(1.1);
} */
#section-c {
  background: #eae7dc;
  color: #333;
  padding: 2em;
}

#section-c .gallery-grid{
  align-items: center;
}
#section-c img{
  margin-bottom: 1em;
  width: 100%;
  border: 2px solid #000;
  transition: 1s;
}


#section-c .gallery-grid img:hover{
  transform: scale(1.1);
}
#section-c .gallery-grid{
  display: grid;
  grid-gap: 20px;
  grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
}

/*Section D */
#section-d .box{
  padding: 2em;
  color: #fff;
}

#section-d .box:first-child{
  background: #123c69;
}

#section-d .box.box1 .fbicon a{
  text-decoration: none;
  color: #fff;
  font-size: 1.5em;
}

/*Footer */
#main-footer{
  padding: 2em;
  background: #000;
  color: #bab2b5;
  text-align: center;
  font-size: 0.8em;
}

#main-footer a{
  color: #bab2b5;
  text-decoration: none;
}
/*************************************************/

/* Media Quesries */
@media(min-width: 786px){
  .grid{
    display: grid;
    grid-template-columns: 1fr repeat(2, minmax(auto, 25em)) 1fr;
  }



  #section-a{
    display: grid;
    grid-template-columns:repeat(3, minmax(auto, 35em)) 1fr;
    grid-template-rows: auto;
    grid-template-areas:
    'sisterlocks-prices service-notes re-tighten-prices'
    'sisterlocks-prices service-notes re-tighten-prices';
    grid-column-gap: 10px;
    align-self: center;
    padding:2em 5em 0;

  }

  .sisterlocks-prices{
    border-radius: 10px 10px 0 0;
    width: 100%;
    background: white;
    display: block;
    grid-area: sisterlocks-prices;
    justify-self:center;
    margin: 0;
    box-shadow: var(--shadow);
  }

  .re-tighten-prices{
    border-radius: 10px 10px 0 0;
    width: 100%;
    background: white;
    display: block;
    grid-area: re-tighten-prices;
    justify-self:center;
    margin: 0;
    box-shadow: var(--shadow);
  }
  .service-notes{
    width: 100%;
    background: white;
    display: block;
    grid-area: service-notes;
    justify-self:center;
    margin:0;
    border-radius: 10px 10px 0 0;
    box-shadow: var(--shadow);
  }
  .top{
    border-radius: 10px 10px 0 0;
    background: white;
    width: 100%;
    display: block;
    grid-area: top;

  }

  #section-a .content-text p{
    padding-top: 0;
  }

  .content-wrap{
    grid-column: 2/4;
  }

  #section-b ul{
    grid-column: 1/6;
  }


  .box, #main-footer div{
    grid-column: span 2;
  }

  #section-b ul{
    display: flex;
    justify-content: space-around;
  }

  #section-b li{
    width: 18%;
  }

  #section-c .gallery-grid img{
    transition: 1s;
  }

  #section-c .gallery-grid img:hover{
    transform: scale(1.1);
  }


/* Navigation */

    /* --------------------------------------- */
}