/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/

/*
Extra small devices (portrait phones, less than 544px)
No media query since this is the default in Bootstrap because it is "mobile first"
*/

/* #section-amenities img {
  display: none;
} */

.lets-connect-btn .btn {
font-size: 1.25rem;
}


#section-services img {
  width:100%;
}

#section-amenities p {
  margin-bottom:0px;
}

#section-amenities p:last-child {
  margin-bottom:60px;
}

#section-amenities img {
    width:100%;
}

.navbar{
  border-bottom: 2px solid #FFF;
}

.about-text {
  -webkit-column-count: 1;
  -moz-column-count: 1;
  column-count: 1;
}

.my-photos h1 {
  color: #145a98;
  margin-bottom: 3rem;
}

#section-about h1, #section-amenities h1 {
  color: #145a98;
  margin-bottom: 2rem;
}

#section-my-philosophy h1 {
  color: #fff;
}

#section-my-philosophy .btn-outline-primary {
    color: #fff;
    background-color: transparent;
    background-image: none;
    border-color: #fff;
}

#section-my-philosophy .btn-outline-primary:hover {
    color: #145a98;
    background-color: #fff;
    background-image: none;
    border-color: #fff;
}

/*
Homepage - Photo Slider (uses Slick Slider)
*/

.slider-for-photos {
    /* margin: 30px auto; */
    margin-bottom:30px;
}

.photos-slider {
    width: 100%;
    /* margin: 30px auto; */
}

.my-photos .slider .slick-slide {
  margin: 0px 5px;
}

.my-photos .slick-slide img {
  width: 100%;
}

.my-photos .slick-prev:before,
.my-photos .slick-next:before {
  color: black;
}


.my-photos .slick-slide {
  transition: all ease-in-out .3s;
  opacity: .3;
}

.my-photos .slick-active {
  opacity: 1;
}

.my-photos .slick-current {
  opacity: 1;
}




h4 {
  color: #145a98;
}

/* google map */
#google-map{
	position:relative;
	margin-top:10px;
    height: 500px;
}


.btn-success {
  color: #145a98;
background-color: transparent;
background-image: none;
border-color: #145a98;
}

textarea {resize: none;}

input#form_name.form-control{
  padding-left:0rem;
}

.form-control {
    display: block;
    width: 100%;
    padding: .5rem .75rem;
    font-size: 1rem;
    line-height: 1.25;
    color: #495057;
    background-color: transparent;
    background-image: none;
    background-clip: padding-box;
    border:none;
    border-bottom: 2px solid #D3A9AB;
    border-radius: 0px;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    padding-left:0rem;
}


.form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #c96d7b;
    outline: 0;
    padding-left:0rem;
}


#contact-form label {
margin-top: .5rem;
font-size: 1.125rem;
color: #c96d7b;
}


ul {
  color: #c96d7b;
}

.services h1 {  font-family: 'mulilight', sans-serif!important; color:#145a98; text-align: left; padding-bottom:20px;}
.services p {  font-family: 'mulilight', sans-serif!important; font-size: 1rem; text-align: left;}
.services p.about-lorinda-btn {  padding-top: 30px; text-align: left;}
.services a {text-align: left;}



body {
    font-family: 'mulilight';
    background: url("../images/sand12.jpg") top repeat;
}


/*
Navbar
*/

.navbar {
    padding: 0rem 0rem;
    background-color: #145a98;
}

.navbar-toggler {
    padding-right: 2rem;
  }

#navbarCollapse{
  border-top: solid 2px white;
  padding-left: 2rem;
}

.nav-link {
  font-size: 1rem;
  text-transform: uppercase;
}

.navbar-dark .navbar-nav .nav-link {
    font-family: 'mulisemibold';
    color: #ffffff;
    transition: color 0.15s ease-in;
    transition-property: color;
    transition-duration: 0.15s;
    transition-timing-function: ease-in;
    transition-delay: 0s;
}

ul.navbar-nav li.nav-item a.nav-link {
padding-right: 2rem;
}

ul.navbar-nav li.nav-item:last-of-type a.nav-link  {
padding-right: 1rem;
}

/* .logo {
font: 0/0 a !important;
} */

#nav-logo {
  height:50px;
  width:250px;
  margin: 0rem 0rem 0rem 2rem;
}

#nav-logo a {
  /* height:70px; */
  height: auto;
  width:250px;
  padding-top: 3px;
  margin-right: 0px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: left;
  -ms-flex-pack: left;
  justify-content: left;
  font-family: 'mulibold';
  font-size: 1.675rem;
}

#nav-logo svg {
  height:50px;
    width:250px;
}

.navbar-brand{
  padding: 0rem;
}

.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='3' stroke-linecap='square' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.navbar-dark .navbar-toggler{
  border: none;
}

/*
Footer
*/

.footer-section {
    background-color: #145a98;
}
.footer-logo {
  width:300px;
  margin: 0 auto;
  padding-top: 40px;
}

.footer-logo svg {
    width:300px;
    height:60px;
}

.text-copyright {
  padding-top:20px;
  padding-bottom:40px;
  color:#fff;
}

p.text-copyright {
margin-bottom: 0rem;
}

.text-copyright a {
  color:#fff;
}

.logo-tagline {
    color: #fff;
    font-family: 'mulilight', sans-serif;
    margin-top: 5px;
}


/*
Hero Homepage Box
*/

/* Hero Slider */
.hero-section {
  background: url("../images/appartment-mer2/aIMG_0156.jpg") center no-repeat;
  background-size: cover;
  height: 30vh;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/*.hero-tagline {
  display: none;
}*/

.hero-tagline {
  text-align: center!important;
  display:contents!important;
}
.hero-tagline .display-3 {
/* margin-left: 67%!important;
margin-top: 40%!important; */
font-family: 'mulilight';
color: #145a98;
font-size: 1.4rem;
line-height: 1.8rem;
text-align: center!important;
/*max-width:200px!important;*/
/* text-shadow: 1px 1px 2px rgba(85, 68, 74, 1); */
}




/* Homepage - Let's Connect */
.lets-connect {
  margin-top:30px;
  margin-bottom:30px;
}
.lets-connect h1 {  font-family: 'mulilight', sans-serif!important; color:#145a98; text-align: center;}
.lets-connect p {  font-family: 'mulilight', sans-serif!important; font-size: 1.125rem; padding-top: 20px; padding-bottom:20px; text-align: center;}
.lets-connect p.lets-connect-btn {  padding-top: 0px;}
.lets-connect {
/* background: none; */
  /* background: url("../images/sea-shell.svg") center no-repeat; */

/* background-size: contain; */
background-size: 260px!important;
/*height: 50vh;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
    -ms-flex-align: center;
        align-items: center;
-webkit-justify-content: center;
    -ms-flex-pack: center;
        justify-content: center;*/

}

.btn {
    border: 2px solid transparent;
}

.btn-outline-primary {
    color: #145a98;
    background-color: transparent;
    background-image: none;
    border-color: #145a98;
}

.btn-outline-primary:hover, .btn-outline-primary:focus {
  background-color: #145a98;
  color: #fff;
  border-color: #145a98;
}

.btn-outline-primary:focus, .btn-outline-primary.focus {
  box-shadow: 0 0 0 3px rgba(211, 169, 171, 0.5);
}

.btn-outline-primary.disabled, .btn-outline-primary:disabled {
  color: #145a98;
  background-color: transparent;
}

.btn-xlg {
  /*padding: .5rem 1rem;*/
font-size: 1.75rem;
/*line-height: 1.5;
border-radius: .3rem;*/
}


/* Homepage - My Philosophy */
/*.my-philosophy-content{margin-left:50%; max-width: 50%;}*/
.my-philosophy-content{}
.my-philosophy p {  font-family: 'mulilight', sans-serif!important; color: #fff; font-size: 1.125rem;}


.my-philosophy-title{
  width: 300px;
  padding-bottom:20px;
}

.lorinda-signature {
  width: 130px;
  padding-top:20px;
}

.my-philosophy {
background-color: #145a98;
/*height: 100vh;*/
/*width:100%;*/
/* height:300px; */
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
margin-top:30px;
margin-bottom:30px;
padding:30px;
}


/* Homepage - Quote */
.quote-section{
  margin-top:30px;
  margin-bottom:30px;
  min-height: 500px;
}
.quote-section p {  font-family: 'mulilight', sans-serif!important; color: #212529;}
.quote-section {
/*height: 50vh;
*/
/*display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
    -ms-flex-align: center;
        align-items: center;
-webkit-justify-content: center;
    -ms-flex-pack: center;
        justify-content: center;*/

}
.quote-section blockquote{
  font-family: 'mulilight', sans-serif!important;
  font-size: 1.125rem;
line-height: 1.4;
margin-top: 0;
margin-bottom: 1.5rem;
margin-top: 1.5rem;
padding-left: 0.125rem;
padding-right: 0.125rem;
}

.white-flower-bud{
  width: 150px;
}

.quote-section cite{
  margin-top: 20px;
  font-family: 'muliregular', sans-serif!important; color: #fff;
  text-transform: uppercase;
  font-size: 1.25rem;
  color: #145a98;
}

/*
Homepage - My Resources
*/

.my-resources {
  min-height: 500px;
  margin-top:30px;
  margin-bottom:30px;
  /*display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;*/
}
.my-resources p {  font-family: 'mulilight', sans-serif!important; color: #fff; font-size: 1.125rem;}
.my-resources h1 {  font-family: 'mulilight', sans-serif!important; color:#c96d7b;}

/*
Homepage - My Resources Slider (uses Slick Slider)
*/
.resources-slider {
    width: 80%;
    margin: 30px auto;
}

.my-resources .slick-slide {
  margin: 0px 20px;
}

.my-resources .slick-slide img {
  width: 100%;
  height:100%;
}

.my-resources .slick-prev:before,
.my-resources .slick-next:before {
  color: black;
}


.my-resources .slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}

.my-resources .slick-active {
  opacity: 1;
}

.my-resources .slick-current {
  opacity: 1;
}


/* Homepage - Hover Box Content */

.resources-logo-hover-wrapper {
  position: relative;
}

.resources-logo-hover-reveal{
  /*width: 100%;
  height:100%;*/
  /*z-index: 80;*/
  /*bottom: 0;
  display: block;*/
  opacity: 0;
  transition:.5s;
  position: absolute;
  text-align: center;
  width: 100%;
  height:100%;
  background-color: #5a707f;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.resources-logo-hover-reveal:hover {
opacity: 1;
}

span.resources-logo-hover-reveal p {
  font-size: 0.9rem;
  line-height: 1.125rem;
  padding:15px;
  margin-bottom: 0px;
}

.resources-logo-hover-reveal .btn-outline-primary {
margin-top: 0px;
margin-bottom: 0px;
}

p.resources-hover-reveal-text {
  display:none;
}

.reveal-container {
  padding:30px;
}


/* About - Lorinda Image */
/*.about-lorinda-img-container{
height: 620px;
overflow: hidden;
}*/

.about-lorinda-img {
  width:100%;
}

/* About Lorinda Section */
.about-lorinda {
  margin-bottom:30px;
}
.about-lorinda h1 {  font-family: 'mulilight', sans-serif!important; color:#c96d7b; text-align: left; padding-bottom:20px;}
.about-lorinda p {  font-family: 'mulilight', sans-serif!important; font-size: 1rem; text-align: left;}
.about-lorinda p.about-lorinda-btn {  padding-top: 30px; text-align: center;}


/* About - Pebbles Footer Image */
.pebbles-img{
  background: url("../images/pebbles.png") top no-repeat;
  background-size: cover;
  height: 5vh;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}


/* Connect - Let's Connect */
.lets-connect-contact {
  margin-top:30px;
  margin-bottom:30px;
}
.lets-connect-contact h1 {  font-family: 'mulilight', sans-serif!important; color:#145a98; text-align: center;}
.lets-connect-contact {  font-family: 'mulilight', sans-serif!important; font-size: 1.125rem; padding-top: 20px; padding-bottom:20px; text-align: center;}
.lets-connect-contact p.lets-connect-btn {  padding-top: 0px;}
.lets-connect-contact {background: url("../images/peony-icon-pink.svg") center no-repeat;
background-size: contain;
/*height: 50vh;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
    -ms-flex-align: center;
        align-items: center;
-webkit-justify-content: center;
    -ms-flex-pack: center;
        justify-content: center;*/

}




/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {

  .hero-section {
    height: 30vh!important;
  }

  /*.hero-tagline {
    text-align: center!important;
    display:contents!important;
  }*/
  .hero-tagline .display-3 {
  /* margin-left: 70%!important;
  margin-top: 30%!important; */
  margin-right: 0%!important;
  font-family: 'mulilight';
  color: #145a98;
  font-size: 2rem;
  line-height: 2.4rem;
  text-align: center!important;
  width:auto!important;
  }

  .resources-slider {
      width: 100%;
  }
  .my-philosophy-title{
    width: 350px;
  }

  .quote-section blockquote{
    font-size: 1.6rem;
  padding-left: 0.125rem;
  padding-right: 0.125rem;
  }



}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {

  /* .my-philosophy {
height:300px;
  } */

  #section-amenities .about-text {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }

  #section-amenities img {
  margin-top:30px;
  }

  .hero-section {
    height: 40vh!important;
  }

  .hero-tagline {
    text-align: center!important;
    display:contents!important;
  }
.hero-tagline .display-3 {
  /* margin-left: 60%!important;
  margin-top: 40%!important; */
  font-family: 'mulilight';
  color: #fff;
  font-size: 4rem;
  line-height: 4.5rem;
  text-align: center!important;
  width:800px!important;
}

  .navbar {
      border-bottom: 2px solid #FFF;
  }

  #navbarCollapse{
    border-top: none;
    padding-right: 2rem;

  }

  .my-philosophy-content{ }
  .my-philosophy {background-color: #145a98;
  /*height:730px;*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top:30px;
  margin-bottom:30px;


}

  .quote-section blockquote{
    font-size: 1.9375rem;
  padding-left: 6%;
  padding-right: 6%;
  }

  .about-lorinda-img {
    width:80%;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  img.about-lorinda-img {
    float: right;
  }

.about-lorinda p {  padding-right: 10%; }
div p.resources-hover-reveal-text {
  display: contents;
  padding:30px!important;
}


}


/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

  .about-text {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }

  #nav-logo a {
    height:70px;
    width:250px;
  padding-top:0px;}

  .btn{
font-size: 1.5rem;
  }

  #nav-logo {
    height:70px;
    width:350px;
    margin-left:2rem;
  }

  #nav-logo svg {
      height:70px;
      width:350px;
  }

  .my-philosophy-content{ }
  .my-philosophy {background-color: #145a98;
  /*height:730px;*/
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top:30px;
  margin-bottom:30px;

}

  .lets-connect {background: url("../images/sea-shell.svg") right no-repeat;}
  .lets-connect p {  font-family: 'mulilight', sans-serif!important; font-size: 1.125rem; margin-right: 40%; padding-top: 20px; padding-bottom:20px; text-align: left;}
  .lets-connect h1 {  font-family: 'mulilight', sans-serif!important; color:#145a98; text-align: left;}
  .lets-connect a {text-align: left;}

  .about-lorinda-img {
    width:70%;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
  .about-lorinda p {  padding-right: 10%; }

}

/*https://gist.github.com/ImLiam/eb895626bfd0aae29ffe51b6ff108492*/

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

#section-amenities img {
margin-top:0px;
}

  .about-lorinda-img {
    width:70%;
    padding-top: 3rem;
    padding-bottom: 3rem;
  }
    .about-lorinda p {  padding-right: 20%; }

  /*.a { order: 2; }
  .b { order: 1; }*/


}