html,body {
 margin: 0;
 width:  100%;
 height: 100%;
}

body {
  background-color: black;
  color: whitesmoke;
  font-family: BioRhyme, Lucida Handwriting, cursive;
  font-size: 16px;
}

a:link, a:visited {
  color: inherited;
  text-decoration: none;
}

.centre {
  display: flex;
  justify-content: center;
}

.highlight {
  color: #C8B568;
  float:left;
  /*font-family: BioRhyme, Lucida Handwriting, cursive;*/
}

.bullets {
  color: whitesmoke;
  background-color: black;
}

.links{
  fill: #C8B568;
}

.wedlvrimg {
  text-align: center;
  padding-top:10px;
}

.contactus {
  text-align: center;
  padding-top:30px;
}

.wedlvrtxt {
  padding-top: 15px;
  text-align: center;
  color: whitesmoke;
  text-decoration: none;
  font-size: 24px;
  font-family: BioRhyme, Lucida Handwriting, cursive;
}

.hometxt {
  padding: 25px;
  text-align: center;
  color: whitesmoke;
  text-decoration: none;
  font-size: 16px;
  font-family: BioRhyme, Lucida Handwriting, cursive;
  font-style: italic;
}

.copyright {
  padding-top: 5px;
  text-align: center;
  color: whitesmoke;
  text-decoration: none;
  font-size: 14px;
  font-family: Lora,Arial, Helvetica, sans-serif;
  background-color: black;
  /*font-style: italic;*/
}

.title {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  color: #C8B568;
  text-decoration: none;
  font-size: 36px;
  font-family: BioRhyme, Arial, Helvetica, sans-serif;
}

.subtitle {
  text-align: center;
  padding-bottom:10px;
  /*font-style:italic;*/
  font-family: BioRhyme, Arial, Helvetica, sans-serif;
  font-size: 16px;
}

.boxgrid {
  margin-left: auto;
  margin-right: auto;
  border-spacing: 25px;
  display:flex;
  flex-wrap: wrap;
  justify-content: center;
}

.boxgridnowrap {
  margin-left: auto;
  margin-right: auto;
  border-spacing: 25px;
  display:flex;
  flex-wrap: nowrap;
  justify-content: center;
  /*align-items: center;*/
  max-width: 1000px;
}

.box {
width: 250px;
height:210px;
border: 5px solid #C8B568;
border-radius: 25px;
margin:5px;
/*background-image: url("images/circle.png");*/
}

.boxnoborder {
width: 50%;
border: 0px solid #C8B568;
margin: 0px;
object-fit: cover;
}

.boxtitle {
  text-align: center;
  color: #C8B568;
  /*font-style:italic;*/
  text-decoration: none;
  font-size: 20px;
  font-family: BioRhyme, Arial, Helvetica, sans-serif;
  padding-top: 20px;
  padding-bottom: 10px;
}

.boxtext {
  text-align: center;
  color: whitesmoke;
  text-decoration: none;
  font-size: 16px;
  font-family: BioRhyme, Arial, Helvetica, sans-serif;
  padding:10px;
}

.boximg {
  color: black;
  text-decoration: none;
  font-size: 16px;
  font-family: BioRhyme, Arial, Helvetica, sans-serif;
  background-color: #C8B568;
  display:flex;
  justify-content: center;
height: 50px;
width: 50px;
}

.boxbutton {
  color: #C8B568;
  padding-bottom:10px;
text-align: center;
}

/*
.values {
   float: left;
   padding: 5px;
}
*/

/* Style the tab */
.tab {
  overflow: hidden;
  /*border: 1px solid #C8B568;*/
  border:none;
  background-color: black;
  color: whitesmoke;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  color: inherit;
  float: left;
  border: none;
  margin: 0;
  outline: none;
  cursor: pointer;
  padding: 8px 10px;
  transition: 0.3s;
  font-family: BioRhyme,Arial, Helvetica, sans-serif;
  font-size: 15px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #C8B568;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: black;
  color: #C8B568;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  /*color: whitesmoke;*/
}

/* SLIDESHOW */

.mySlides {display: none;}

/* Slideshow container */
.slideshow-container {
  /*max-width: 1000px;
  position: relative;
  margin: auto;
  margin:0 25%;*/
  display:flex;
  justify-content: center;
}

/* Caption text */
.text {
  color: #C8B568;
  font-size: 20px;
  padding: 8px 12px;
  position: absolute;
  top: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #C8B568;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.slideimg {
  width:100%;
  background-color: whitesmoke;
  opacity: 1;
}

.active {
  background-color: #C8B568;
}

/* Fading animation */
.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}