/* Body text formatting*/
body,
html {
  height: 100%;margin: 0;font-size: 16px;font-family: "Lato", sans-serif;font-weight: 400;line-height: 1.8em;color: #464649;
}

.nav-link {
  font-size: 20px;
}

/* This is for the images*/
.pimg1,
.pimg2,
.pimg4 {
  position: relative;opacity: 0.7;background-position: center;background-size: cover;background-repeat: no-repeat;background-attachment: fixed;
}

/* Get pictuers*/
.pimg1 {
  background-image: url("Images/flowers.jpg");min-height: 400px;
}

.pimg2 {
  background-image: url("Images/Services.jpg");min-height: 400px;
}
.pimg4 {
  background-image: url("Images/testimonials.jpg");min-height: 400px;
}

/* This is for the black boxes in the images*/
.section {
  text-align: center;padding: 50px 80px;
}

.section-light {
  background-color: #f4f4f4;color: #464649;
}

.ptext {
  position: absolute;top: 50%;width: 100%;text-align: center;color: #000000;font-size: 27px;letter-spacing: 8px;text-transform: uppercase;
}

.ptext .border {
  background-color: #111111;color: #fff;padding: 20px;
}

.imageLogo {
  width: 350px;height: 125px;
}

.fa-facebook {
  color: #3b5998;
}

.fa-yelp{
  color:red;
}

hr {
  border-top: 1px solid #3f3f3f;
}

.row {
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -ms-flex-wrap: wrap; /* IE10 */
  flex-wrap: wrap;
  padding: 0 4px;
}

.galleryImage{
  max-width: 100%;
  height: auto;
}

.yelp-review{
  margin: auto;
  display: flex;

}


/*
Extra small (xs) devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap

Small (sm) devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }

Medium (md) devices (tablets, 768px and up)
@media (min-width: 768px) { ... }

Large (lg) devices (desktops, 992px and up)
@media (min-width: 992px) { ... }

Extra (xl) large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
*/

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
   .imageLogo {
    width: 275px;
    height: 101px;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {


  .imageLogo {
    width: 245px;
    height: 90px;
  }
  h1{
    font-size: 1.55rem;
    text-align:center;
  }
}

/*dissables parallax effect for mobile devices*/
@media (max-width: 568px) {
  .pimg1,
  .pimg2,
  .pimg4 {
    background-attachment: scroll;
  }
}
