/******************************Default******************************/
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700&display=swap');
body {
  background: #f8f8ff; }

.pageWrapper {
  width: 100%;
  margin: 0 auto;
  min-height: 768px;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;}

p, a, label, input[type], textarea, figcaption {
  font-family: 'Roboto', sans-serif;
  font-size: 12pt;
  font-weight: 400;
  color: #0e1111;}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Roboto', sans-serif;
  font-size: 16pt;
  font-weight: 700;
  color: #0e1111;}

/******************************Header******************************/
header {
  width: 100%;
  background: url("../images/website/gaarden_fra_haven_langside.jpg") no-repeat fixed left top;
  background-size: 100% auto;
  min-height: 700px;
}

header .banner {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  padding: 25px 0 25px 0;
  background-color: rgba(0,0,0,0.5);
}

header img {
  max-width: 300px;
  margin: 25px 15px 25px 15px; }

header .banner a {
  text-decoration: none;
  color: #f8f8ff;
}

header .banner a:visited {
  color: #f8f8ff;
}

header #topBar {
  width: 100%;
  padding: 10px 25px 10px 25px;
  background: #C0392B;
  overflow: hidden;
  text-transform: uppercase;}

header #topBar ul {
  text-align: center;}

header #topBar ul li {
  list-style-type: none;
  display: inline-block; }

header #topBar ul li a {
  color: #f8f8ff;
  margin-right: 20px;
  transition: .5s;
  font-weight: bold;}

header #topBar ul li a:hover {
  color: #2d2d2d;
  transition: .5s; }

/*************************Home Content****************************/
.home p {
  margin: 25px auto 25px auto;
}
.home #homeImgWrapper {
  margin-top: 1vw;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
}

.home #homeImgWrapper a img {
  max-width: 225px;
  margin-bottom: 15px;
  border-radius: 50%;
  -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.75);
  -moz-box-shadow:    2px 2px 5px 1px rgba(0, 0, 0, 0.75);
  box-shadow:         2px 2px 5px 1px rgba(0, 0, 0, 0.75);
}

.home #homeImgWrapper a p {
  text-decoration: none;
  color: #0e1111;
}

/************************Content************************/
#content {
  display: flex;
  flex-flow: column nowrap;
  width: 80%;
  text-align: center;
  margin-top: 5em;
  justify-content: center;
}

#content .title {
  font-size: 2em;
}

#content .sub_title {
  font-weight: 300;
  font-size: 1.5em;
}

#content .hr_wrapper {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
}
#content .hr_wrapper .hr_left, #content .hr_wrapper .hr_right {
  display: inline-block;
  width: 100%;
  border: 0;
  height: 1px;
  background-color: #dddddd;
  margin-top: 10px;
}

#content .hr_wrapper .hr_middle {
  display: inline-block;
  border: 0;
  height: 4px;
  min-width: 3em;
  background-color: #C0392B;
}


/**************************Picture Grid**************************/
#content .imageGrid {
  margin-top: 25px;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
}

#content .imageGrid .picture {
  list-style-type: none;
  max-width: 250px;
  max-height: 120px;
  overflow-y: hidden;
  margin: 0 auto 25px auto;
  -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.75);
  -moz-box-shadow:    2px 2px 5px 1px rgba(0, 0, 0, 0.75);
  box-shadow:         2px 2px 5px 1px rgba(0, 0, 0, 0.75);
}

/************************Contact************************/
#contactWrapper {
  margin-top: 25px;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
}

#contactWrapper div {
  max-width: 225px;
}

#contactWrapper div img {
  margin-bottom: 15px;
  border-radius: 50%;
  -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.75);
  -moz-box-shadow:    2px 2px 5px 1px rgba(0, 0, 0, 0.75);
  box-shadow:         2px 2px 5px 1px rgba(0, 0, 0, 0.75);
}

#phoneWrapper {
  margin-top: 25px;
}

#phoneWrapper p {
  margin-bottom: 10px;
}


/******************************Footer******************************/
footer {
  margin-top: 25px;
  width: 100%;
  background: #2d2d2d;
  padding: 25px 25px 10px 25px;
  text-align: center;}

footer p, footer  a {
  color: #999999; }

footer p a {
  color: #f8f8ff; }

footer img {
  float: right;
  max-width: 191px; }

/*# sourceMappingURL=mainStyle.css.map */