@media (max-width: 1000px) 
{
	:root
	{
		--sm: 10px;
		--md: 30px;
		--bg: 50px;
		--xb: 70px;
		--scr-w: 990px;
	}
	
	.primary
	{
		font-size: 5em;
	}

	.secondary
	{
		font-size: 4em;
	}

	.secondary-2
	{
		font-size: 3em;
	}
	
	.break
	{
		position:relative;
		height:30px;
		margin-top:50px; 
		margin-bottom:30px;
	}
	
}

@media (min-width: 1001px) 
{
	:root
	{
		--sm: 10px;
		--md: 30px;
		--bg: 50px;
		--xb: 70px;
		--scr-w: 600px;
	}
	
	.primary
	{
		font-size: 3em;
	}

	.secondary
	{
		font-size: 2em;
	}

	.secondary-2
	{
		font-size: 1em;
	}
	
	.break
	{
		position:relative;
		height:10px;
		margin-top:15px; 
		margin-bottom:10px;
	}

}


@font-face 
{
  font-family: myFont;
  src: url(../../../fonts/neon2.ttf);
}

@-webkit-keyframes bounce{0%,to{-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1);-webkit-transform:translateY(-25%);transform:translateY(-25%)}
50%{-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1);-webkit-transform:none;transform:none}
}
@keyframes bounce{0%,to{-webkit-animation-timing-function:cubic-bezier(.8,0,1,1);animation-timing-function:cubic-bezier(.8,0,1,1);-webkit-transform:translateY(-25%);transform:translateY(-25%)}
50%{-webkit-animation-timing-function:cubic-bezier(0,0,.2,1);animation-timing-function:cubic-bezier(0,0,.2,1);-webkit-transform:none;transform:none}
}
.animate-bounce{-webkit-animation:bounce 1s infinite;animation:bounce 1s infinite}

#AudioControl{z-index:7099; position:fixed; top:3%; right:3%;}
.text-3xl{font-size:2.875rem;line-height:3.25rem}

html
{
	padding:0;
}

body
{
	width: 100%;
	max-width:var(--scr-w);
	margin: 0 auto; /* centra el body en pantallas grandes */
	overflow-x:hidden;
	padding:0;
}

section
{
	position:relative;
}

#parent
{
	position:relative;
	padding:0;
	margin:0;
	width:100wv;
	max-width:var(--scr-w);
	overflow-x:hidden;
}

#main
{
	position:relative;
	padding:0;
	margin:0;
	width:100wv;
	height:auto;
	max-width:var(--scr-w);
}

ul.tiempo {
  margin: 0;
  padding: 0;
  text-align: center;
  
}
.tiempo li {
  display: inline-block;
  list-style-type: none;
  padding: 0 10px;
  font-size: 18px;
}

.tiempo li:not(:first-child) 
{
	margin-left: 50px;
}


.tiempo li span 
{
  display: block;
  color: #fff;
  text-shadow:
    0 0 7px #fff,
    0 0 10px #fff,
    0 0 21px #fff,
    0 0 42px #bc13fe,
    0 0 82px #bc13fe,
    0 0 92px #bc13fe,
    0 0 102px #bc13fe,
    0 0 151px #bc13fe;

}

.std-img
{
	position:relative;
	width: 90%;
	border-radius:10px;
	box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 10px 0px;
}

.icn-img
{
	position:relative;
	width: 50%;
}

p, span
{
  color: #fff;
  text-shadow:
    0 0 7px #fff,
    0 0 10px #fff,
    0 0 21px #fff,
    0 0 42px #bc13fe,
    0 0 82px #bc13fe,
    0 0 92px #bc13fe,
    0 0 102px #bc13fe,
    0 0 151px #bc13fe;
}

h1 span
{
	margin-left:20px;
}

.primary, h1
{
	font-family: myFont;
}

.secondary
{
	font-family: myFont;
}

.secondary-2
{
	font-family: myFont;
}

.center-container
{
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
	position: relative;
    z-index: 2;
}

.p-container
{
	position: relative;
	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 2;
	padding-left: 50px;
	padding-right:50px;
}

.p-center
{
	text-align: center;
	margin-top:0;
	margin-bottom:0;
}

.xt-spc
{ margin-top:70px; }

.xb-spc
{ margin-bottom:70px; }

.bt-spc
{ margin-top:50px; }

.bb-spc
{ margin-bottom:50px; }

.x-spc
{ margin-top:70px; margin-bottom:70px; }

.b-spc
{ margin-top:50px; margin-bottom:50px; }

.pb-spc
{ padding-bottom:50px; }


.mt-spc
{ margin-top:30px; }

.st-spc
{ margin-top:10px; }

.t-0
{
	top:0px;
}

.mt-0
{ margin-top:0px; }

#invite-me
{
	color:black;
}


a.neon, button.neon
{
	font-family: myFont;
	font-size: 3rem;
	cursor: pointer;
	text-decoration-line:none;
	animation: pulsate 1.5s infinite alternate;  
	border: 0.2rem solid #fff;
	border-radius: 2rem;
	padding: 1em;
	box-shadow: 0 0 .2rem #fff,
	0 0 .2rem #fff,
	0 0 2rem #bc13fe,
	0 0 0.8rem #bc13fe,
	0 0 2.8rem #bc13fe,
	inset 0 0 1.3rem #bc13fe; 
	color: #fff;
	text-shadow:
	0 0 7px #fff,
	0 0 10px #fff,
	0 0 21px #fff,
	0 0 42px #bc13fe,
	0 0 82px #bc13fe,
	0 0 92px #bc13fe,
	0 0 102px #bc13fe,
	0 0 151px #bc13fe;
}

@keyframes pulsate {
    
  100% {

      text-shadow:
      0 0 4px #fff,
      0 0 11px #fff,
      0 0 19px #fff,
      0 0 40px #bc13fe,
      0 0 80px #bc13fe,
      0 0 90px #bc13fe,
      0 0 100px #bc13fe,
      0 0 150px #bc13fe;
  
  }
  
  0% {

    text-shadow:
    0 0 2px #fff,
    0 0 4px #fff,
    0 0 6px #fff,
    0 0 10px #bc13fe,
    0 0 45px #bc13fe,
    0 0 55px #bc13fe,
    0 0 70px #bc13fe,
    0 0 80px #bc13fe;

}