#bgsplash {
  background-image: url("../images/bg.jpg");
  background-repeat: no-repeat;
     background-attachment: fixed;
  	background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  font-family: 'Karma', 'Quattrocento', 'Spectral', serif;
}

h1 {
font-size: 6em;
}

.splash a {
	text-decoration: none;
}

.splash a:hover {
text-decoration: none;
}

@supports (-webkit-text-stroke: 0.5px #000033) {
  .splash a {
    -webkit-text-stroke: 0.5px  #000033;
    -webkit-text-fill-color: #000033;
  }
}

@supports (-webkit-text-stroke: 1px #950e4b) {
  .splash a:hover {
    -webkit-text-stroke: 1px #950e4b;
    -webkit-text-fill-color: #e60400;
  }
}


#mobisplash {
  background-image: url("../images/bg.jpg");
  background-repeat: no-repeat;
    	background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
/*  background-color: #ffd479;*/
  font-family: 'Spectral', 'Quattrocento', serif;
  min-height: 100%;
  max-height: 100%;
  min-width: 100%;
  position: fixed;
}

.mobisplash {
color: #330033;
}


.mobisplash a {
color: #330033;
}

.mobisplash a:hover {
color: #330033;
}

.band {
background-color: rgba(255,255,255,0.2);
width: 100%;
background: cover;
}




.spec {
padding: 30px;
}

.spec a {
	text-decoration: none;   
}

.spec a:hover {
	text-decoration: none;   
}

@supports (-webkit-text-stroke: 2px black) {
  .mobisplash {
    -webkit-text-stroke: 2px  black;
    -webkit-text-fill-color: #330033;
  }
}

.mobisplash2 {
color: black;
}

.mobisplash2 a {
color: black;
}

.mobisplash2 a:hover {
color: black;
}

@supports (-webkit-text-stroke: 0.5px #330033) {
  .mobisplash2 {
    -webkit-text-stroke: 0.5px #330033;
    -webkit-text-fill-color: black;
  }
}


#overlay {
background-image: url("../images/bg.png");
background-repeat: no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
/*  background-color: #ffd479;*/
  font-family: 'Spectral', 'Quattrocento', serif;
  min-height: 100%;
  max-height: 100%;
  min-width: 100%;
  position: fixed;
/*  background-color: rgba(0,0,255,0.5);*/
}

#tags {
	color: #e2eeed;
	font-size: 3em;
	padding: 20px;
}

.tags:hover {
	color: #e60c00;
}

h1 {
    margin: 0 0 0 0;
    padding: 30px 0 30px 0;
}

h2 {
	font-size: 4em;
}

h3 {
	font-size: 3em;
}

h3 {
	font-size: 5em;
}

/*
	color: #336699;	
	color: #00cc99;
	color: #33cc00;
*/

.button {
	width: 145px;
	height: 100px;
	position:relative;
	padding:0 0 40px 0;
	background-color: ;
	background: rgba();
	left: 70%;
	top: 30%;
	display:block;
	margin: 0 0 40px 0;
	overflow:hidden;
}


.button img {
	background: center;
	position: absolute;
	max-width: 200%;
	top: 30%;
	left: 0%;
	transform: translateX (-50%);
	transform: translateY (-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
}

.button a:hover img {
	left: 100%;
}


/*copyright Alicia Marie Lawrence 2020 aliciamarielaw.xyz*/




.mobibutton {
  background: none;
  position: relative;
  text-decoration: none;
  margin:0 auto;
  overflow: hidden;
  height:220px;
  width: 220px;
  border: none;

}
  
.mobibutton img:hover {
    position: absolute;
    animation-name: multiple-image-crossfade;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 6s;
    &:nth-of-type(1) {
      animation-delay: 3s;
    }
	
    &:nth-of-type(2) {
      animation-delay: 3s;
    }
	

    &:nth-of-type(3) {
      animation-delay: 3s;
    }
    &:nth-of-type(4) {
      animation-delay: 0s;
    }
  }
  -webkit-animation: pulse 1s ease-out infinite;
          animation: pulse 1s ease-out infinite;
  text-decoration: none;
  }

.mobibutton img:active {
    position: absolute;
    animation-name: multiple-image-crossfade;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-duration: 6s;
    &:nth-of-type(1) {
      animation-delay: 3s;
    }
    &:nth-of-type(2) {
      animation-delay: 3s;
    }
    &:nth-of-type(3) {
      animation-delay: 3s;
    }
    &:nth-of-type(4) {
      animation-delay: 0s;
    }
  -webkit-animation: none;
          animation: none;
  -webkit-transform: translateY(.2em);
          transform: translateY(.2em);
}

@keyframes multiple-image-crossfade {
  0% {
    opacity:1;
  }
  17% {
    opacity:1;
  }
  25% {
    opacity:0;
  }
  92% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}



.mobibutton::before {
/*  background: rgba(200,200,200,.8);*/
    bottom: -.1em;
  content: "";
    left: 0;
  position: absolute;
    right: 0;
    top: .5em;
  z-index: -1;
}

.mobibutton::after {
 /* background: -webkit-linear-gradient(top, #48CA24, #FD0A69 90%);
  background: linear-gradient(to bottom, #48CA24, #FD0A69 90%);*/
  background-size: 100% 500%;
    bottom: 0;
  content: "";
    left: 0;
  position: absolute;
    right: 0;
    top: 0;
  -webkit-transition: all 10s cubic-bezier(0,.5,.5,1);
  transition: all 10s cubic-bezier(0,.5,.5,1);
  z-index: -1;
}

.mobibutton:hover {
  -webkit-animation: pulse 1s ease-out infinite;
          animation: pulse 1s ease-out infinite;
  text-decoration: none;
}

.mobibutton:hover::after {
  background-position: 0 100%;
}

.mobibutton:active {
  -webkit-animation: none;
          animation: none;
  -webkit-transform: translateY(.2em);
          transform: translateY(.2em);
}

.mobibutton:active::before {
  -webkit-transform: translateY(-.1em);
          transform: translateY(-.1em);
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: none;
            transform: none;
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: none;
            transform: none;
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
}