/* Flashlight Overlay */
h2 {
 z-index:3; 
  position: absolute;
	margin:auto;
	text-align:center;
    color: #fff;
  text-shadow:
    0 0 5px #fff,
    0 0 10px #fff,
    0 0 20px #fff,
    0 0 40px #0ff,
    0 0 80px #0ff,
    0 0 90px #0ff,
    0 0 100px #0ff;
}

    .image-container {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .image-container img {
		margin: 0 auto;
    }

.svg-container {
      width: 300px;
      height: 300px;
			max-width: 100%;
      max-height: 100%;
       filter: drop-shadow(0 0 1px rgba(255,255,255,0.9)) drop-shadow(0px 0px 7px rgba(255,255,255,0.8)) drop-shadow(0px 0px 30px rgba(74,0,255,0.5));
	z-index: 3;
	   transition: filter 0.4s ease-in-out;
}


.svg-container:hover{
      filter: drop-shadow(0 0 1px rgba(255,255,255,0.9)) drop-shadow(0px 0px 7px rgba(255,255,255,0.8)) drop-shadow(0px 0px 30px rgba(74,0,255,0.5))  invert(10%);
    transition: all 0.4s;

}


.centrado{
  font-size: 1vw;
  margin: auto;
  color: rgba(255, 255, 255, 0.5);
  align-self: center;
  text-align: center;
}

     h1 {
	font-family: sans-serif;
	
      color: #FFFFFF;
      font-size: 24px;
      text-align: center;
      opacity: 1;
      animation: fadeInOut 5s infinite;
    }
    @keyframes fadeInOut {
      0% { opacity: 0.25; }
      20% { opacity: 1; }
      80% { opacity: 1; }
      100% { opacity: 0.25}
    }

* { color:#000; text-decoration: none;}

    .icons-container {
      display: flex;
      justify-content: center;
      align-items:flex-end;
      margin-top: 100px;
		
		z-index: 3;
    }
    .icon {
      font-size: 30px;
      margin: 0 25px;
      color: #000000;
      text-decoration: none;
    }


.fa:hover {
            opacity: 0.9;
            text-align: center;
        }
  
        .fa-instagram  {
        text-align: center;
           color: black;
           z-index:3; 
        }

.fa-envelope {
        text-align: center;
	
           color: black;
           z-index:3; 
        }


        .fa {
            padding-top: 10px;
            font-size: 40px;
            width: 0px;
            text-decoration: none;
            margin-left: -20px;
        }



@media only screen and (max-width: 600px) {
  body {
    background-color: 
	darkslateblue;
  }
.svg-container {
	  width: 200px;
      height: 200px;
	}
     h1 {
      font-size: 14px;
	}


}

html {
  overflow: hidden; /*FF fix*/
  height: 100%;
  font-family: Geneva, sans-serif;
  background: darkslateblue;
}


body {
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  flex-direction: column;
  display: flex;
  justify-content: center;
  align-items: center;
}


:root {
  cursor: none;
  --cursorX: 100vw;
  --cursorY: 100vh;
  z-index:1; 
}
:root:before {
  content: '';
  display: block;
  z-index:1; 
 
  width: 200%;
  height: 200%;
  position: fixed;
  pointer-events: none;
  background: radial-gradient(
    circle 25vmax at var(--cursorX) var(--cursorY),
    rgba(0,0,0,0) 67%,
    rgba(0,0,0,.9) 70%,
    rgba(0,0,0,.99) 150%
  )
}





.fa:hover {
            opacity: 0.9;
            text-align: center;
        }
  
        .fa-instagram {
        text-align: center;
           color: black;
           z-index:3; 
        }

        .fa {
            padding-top: 10px;
            font-size: 40px;
            width: 0px;
            text-decoration: none;
            margin-left: -20px;
        }