@charset "utf-8";
@import url('./fonts/Caviar_Dreams/stylesheet.css');
@import url('./fonts/GreatVibes/stylesheet.css');

* {
  margin: 0;
  padding: 0;
}

html {
  height: 100%;
}

body {
  /*background-image: url('./images/holding-hands.jpg');*/
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  display: flex;
  font-family: GreatVibes;
  font-size: 40px;
  justify-content: center;
  min-height: 100%;
}

hr {
  margin: 20px 0px;
}

.time {
  color: rgba(256, 256, 256, 1);
  font-family: "Caviar Dreams";
  font-size: 26px;
}

.time-text {
  color: rgba(256, 256, 256, .5);
  font-weight: bold;
}

.container {
  align-self: center;
  background-color: rgba(0, 0, 0, .4);
  border: 2px solid rgba(0, 0, 0, .2);
  box-sizing: border-box;
  color: rgba(256, 256, 256, .9);
  margin: auto;
  padding: 20px;
  text-align: center;
}

.hidden {
  display: none;
}

.heart {
  font-size: 18px;
}

.small {
  font-size: 24px;
}

.prev, .next, .close {
  top: 50%;
  cursor: pointer;
  font-family: "Caviar Dreams";
  font-size: 16px;
}

.prev {
  position: absolute;
  left: 0px;
  text-align:center;
  background-color:rgba(73, 3, 136, 0.7);
  width:100px;
  height:60px;
  line-height:60px;
  color:white;
  margin:20px auto;
}

.next {
  position: absolute;
  right: 0px;
  text-align:center;
  background-color:rgba(73, 3, 136, 0.7);
  width:100px;
  height:60px;
  line-height:60px;
  color:white;
  margin:20px auto;
}

:root:before {
  content: url('./images/laying-kissing-sunset.jpg')
           url('./images/bride-01.jpg')
           url('./images/bride-02.jpg')
           url('./images/brides-maids-01.jpg')
           url('./images/brides-maids-02.jpg')
           url('./images/brides-maids-03.jpg')
           url('./images/brides-maids-04.jpg')
           url('./images/brides-maids-05.jpg')
           url('./images/brides-maids-06.jpg')
           url('./images/brides-maids-07.jpg')
           url('./images/bridge.jpg')
           url('./images/everyone.jpg')
           url('./images/groom-01.jpg')
           url('./images/groomsmen-01.jpg')
           url('./images/groomsmen-02.jpg')
           url('./images/groomsmen-03.jpg')
           url('./images/groomsmen-04.jpg')
           url('./images/groomsmen-05.jpg')
           url('./images/groomsmen-06.jpg')
           url('./images/groomsmen-07.jpg')
           url('./images/holding-hands.jpg')
           url('./images/jones.jpg')
           url('./images/kissing-01.jpg')
           url('./images/kissing-02.jpg')
           url('./images/kissing-03.jpg')
           url('./images/lake.jpg')
           url('./images/laying-kissing-sunset.jpg')
           url('./images/overman.jpg')
           url('./images/pinch-your-booty.jpg')
           url('./images/walking.jpg')
           url('./images/walking-out.jpg')
           url('./images/wedding-couple-01.jpg')
           url('./images/wedding-couple-02.jpg')
           url('./images/wedding-couple-03.jpg')
           url('./images/wedding-couple-04.jpg')
           url('./images/wedding-couple-05.jpg')
           url('./images/wedding-couple-06.jpg')
           url('./images/wedding-couple-07.jpg')
           url('./images/wedding-couple-08.jpg')
           url('./images/wedding-couple-09.jpg')
           url('./images/wedding-couple-10.jpg')
           url('./images/wedding-couple-11.jpg')
           url('./images/wedding-couple-12.jpg')
           url('./images/wedding-couple-13.jpg')
           url('./images/wedding-couple-14.jpg')
           url('./images/wedding-couple-15.jpg')
           url('./images/wedding-party-01.jpg')
           url('./images/wedding-party-02.jpg')
           url('./images/wedding-party-03.jpg')
           url('./images/wedding-party-04.jpg')
           url('./images/wedding-party-05.jpg')
           url('./images/wedding-party-06.jpg')
           url('./images/wedding-party-07.jpg')
           url('./images/wedding-party-08.jpg')
           url('./images/whats-going-on.jpg');
  left: -999em;
  position: absolute;
  display:none;
}

@media (max-width: 800px) {
  .next, .prev {
    top: inherit;
    bottom: 0;
  }
}