/* navigation */

/* change the background color */
.navbar {
  font-family: Raleway;
  font-size: 1rem;
  letter-spacing: .1rem;
  text-transform: uppercase;
  background-color: #fff;
}
/* change the brand and text color */
.navbar .navbar-brand,
.navbar .navbar-text {
    color: #8C8C8C;
}
/* change the link color */
.navbar .navbar-nav .nav-link {
    color: #666;
}
/* change the color of active or hovered links */
.navbar .nav-item.active .nav-link,
.navbar .nav-item:hover .nav-link {
    color: #8C0052;
}

.smhamburger{
  margin-top: 0px;
  margin-bottom: -20px;
  margin-left: 50%;
  transform: translate(-50%, -50%);
}
.navbar-toggler {
    border: 0px solid transparent;
  }

/* header */
  .topredbar {
    background-color: #8C0052;
    height: 15px;
    }

  .smsocial {
      text-align: right;
      margin-top: 10px;
      font-size: 1.5rem;
    }



    /* main carousel */

    /*
    Removes white gap between slides - chagnge to base color of slide images
    */
    .carousel {
      background:#666;
    }

    /*
    Forces image to be 100% width and not max width of 100%
    */
    .carousel-item .img-fluid {
      width:100%;
  }

    /*
    anchors are inline so you need ot make them block to go full width
    */
    .carousel-item a {
      display: block;
      width:100%;
  }






/* cards */

    .card-columns{
      column-gap: 0rem;
    }
    .card-columns .card {
        margin-bottom: 0rem;
    }
    .card{
      border: 0px;
    }
    /* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
    @media (min-width: 768px) {
      .card-columns {column-count: 3;}
    }

    /* Large devices (desktops, 992px and up) */
    @media (min-width: 992px) {
     .card-columns {column-count: 4;}
    }

    /* Extra large devices (large desktops, 1200px and up) */
    @media (min-width: 1200px) {
       .card-columns {column-count: 6;}
    }
    .single-card-center{
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 50%;
    }


/* typography */
a:hover{
  color: #8C0052;
}

a.hover{
  color: #8C0052;
  text-decoration: none;
}
a{
  color: #666;
}
.eml-link{
  font-family: Raleway;
  font-size: 1rem;
  letter-spacing: .1rem;
  color: #fff;
  text-align: left;
}
.eml-link:hover{
  text-decoration: none;
  color: #666;
}
.ph-link{
  font-family: Raleway;
  letter-spacing: .1rem;
  color: #fff;
  text-align: left;
}
.ph-link:hover{
  text-decoration: none;
  color: #666;
}
.section-head{
  font-family: Raleway;
  font-size: 1.75rem;
  text-align: center;
  color: #8a8a8a;
  letter-spacing: .2rem;
}
.contact{
  font-family: 'Raleway', sans-serif;
  font-size: 1rem;
  color: #666;
  text-align: center;
}

.packages{
  font-family: 'Raleway', sans-serif;
  font-size: 1rem;
  color: #666;
  text-align: center;
}

.pg-link{
  font-family: Raleway;
  font-size: 1rem;
  letter-spacing: .1rem;
  text-transform: uppercase;
  color: #8a8a8a;
  text-align: center;
}
.pg-link:hover{text-decoration: none;}

/* media */

.btn-link{
  color: #fff;
  font-size: 1.1rem;

}
.btn-link:hover{
  color: #d1d1d1;
  text-decoration: none;
}
.btn-link:focus{
  text-decoration: none;
}

.card-header{
  background-color: #8C0052;
  margin-bottom: 0px;
}
.card-body{
  background-color: #fff8f5;
}

img.avatar {
  width: 75%;
}


/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {
  img.avatar {width: 250px; float: left;  margin-right: 40px;
    margin-bottom: 20px;
    shape-outside: inset(1% round 50%);}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
 img.avatar {width: 360px; float: left;  margin-right: 40px;
   margin-bottom: 20px;
   shape-outside: inset(1% round 50%);}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
   img.avatar {width: 460px; float: left;  margin-right: 40px;
     margin-bottom: 20px;
     shape-outside: inset(1% round 50%);}
}




hr.style9 {
	border-top: 1px dashed #8c8b8b;
	border-bottom: 1px dashed #fff;
}

/* footer */

  @media (max-width: 767px) {
      .designby { text-align:center }
  }
.designby {
  text-align: right;
  color: #fff;
  font-size: .8rem;
  letter-spacing: .05rem;
  text-decoration: none;
}
a.designby {
  text-decoration: none;
}
a.designby:hover {
  color: #666;
}

.bd-footer {
    padding: 1rem 0;
    margin-top: 0rem;
    background-color: #8C0052;
  }

  a:hover {
    color: #8C0052;
  }


/* portfolio-intro styles */
  .middle-o {
    text-align: center;
    color: #8a8a8a;
    font-size: 1rem;
  }
  .text-over {
    opacity: 1;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    color: #fff;
    font-size: 2rem;
  }

  .image {
    opacity: 1;
    display: block;
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
  }
  .middle {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    color: #8a8a8a;
    font-size: 2rem;
  }
  .text {
    color: #9a9a9a;
    font-size: 16px;
    padding: 16px 32px;
  }

  /* container */

  .container-fluid {
      width: 100%;
      padding-right: 0px;
      padding-left: 0px;
      margin-right: auto;
      margin-left: auto;
  }

  .container-fluid:hover .image{
    opacity: 0.3;
  }
  .container-fluid:hover .middle{
    opacity: 2;
  }

  /* end portfolio-intro styles */


  /* bio section */
  .bio-link{
    color: #666;
  }
  .bio-link:hover{
    color: #8C0052;
    text-decoration: none;
  }
  .bio-section{
    background-color: #ccc;
  }
  .bio{
    font-family: 'Raleway', sans-serif;
    font-size: 1rem;
    color: #666666;
    text-align: left;
  }

  .quote{
    font-family: 'Marck Script', cursive;
    font-size: 5rem;
    color: #666666;
    text-align: center;
  }

  /* Lets Connect section */
  .b-eml-link{
    font-family: 'Raleway', sans-serif;
    font-size: 1.75rem;
    letter-spacing: .1rem;
    color: #8C0052;
    text-align: center;
  }
  .b-eml-link:hover{
    text-decoration: none;
  }
  .b-ph-link{
    font-family: 'Raleway', sans-serif;
    letter-spacing: .1rem;
    color: #8C0052;
    text-align: center;
  }
  .b-ph-link:hover{
    text-decoration: none;
  }
  .bbook{
    font-family: 'Raleway', sans-serif;
    font-size: 1.75rem;
    color: #8C0052;
    text-align: center;
  }
  .bbook:hover{
    color: #fff;
    text-decoration: none;
  }


  /* booking section */
  .book{
    font-family: 'Raleway', sans-serif;
    font-size: 1rem;
    color: #666666;
    text-align: left;
  }
  .pg-linka{
    color: #fff;
    font-family: Raleway;
    font-size: 1.2rem;
    letter-spacing: .1rem;
    text-transform: uppercase;
    text-align: center;
    background-color: #8C0052;
    border-color: #8C0052;
    border: 5px;
    border-radius: .2rem;
    padding: 7px;
  }
  .pg-linka:hover{
    text-decoration: none;
    color: #666;
  }
  .c-eml-link{
    font-family: Raleway;
    font-size: 1rem;
    letter-spacing: .1rem;
    color: #8a8a8a;
    text-align: left;
  }
  .c-eml-link:hover{
    text-decoration: none;
  }
  .c-ph-link{
    font-family: Raleway;
    letter-spacing: .1rem;
    color: #8a8a8a;
    text-align: left;
  }
  .c-ph-link:hover{
    text-decoration: none;
  }
  .centerppal{
    text-align:center;
  }
  .nav-tabs{
    border-color: #8C0052;
  }
  .nav-tabs .nav-link.active{
    border-color: #8C0052;
    background-color: #8C0052;
    color: #fff;
  }

  .eml-link{
    font-family: Raleway;
    font-size: 1rem;
    letter-spacing: .1rem;
    color: #fff;
    text-align: left;
  }
  .eml-link:hover{
    text-decoration: none;
    color: #666;
  }
  .ph-link{
    font-family: Raleway;
    letter-spacing: .1rem;
    color: #fff;
    text-align: left;
  }
  .ph-link:hover{
    text-decoration: none;
    color: #666;
  }

.hrltblue{
    background-color: #8C0052;
  }