@charset "UTF-8";
/* CSS Document */

body {
	margin:0 auto;
	width:100%;
}

#back-video{
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
	z-index:-1;
	opacity: .8;

	
}


h1{
	
	font-family: "Orbitron", sans-serif;
	color: #e9fe7a;
	text-shadow: 1px 1px #9a2f8a;
	font-size: 50pt;
	text-align: center;
}


.title{
	
	text-align: center;
	margin-top: 5%;
	margin-bottom: 5%;
	transition: 0.9s ease;
}

.title:hover{
	
	transform: scale(1.1);
	transition: 0.9s ease;
}

#imst{
	
	padding-top: 10px;
	
}


#imst1{
	
padding-top: 10px;	
	
}


#imst2{
	
padding-top: 10px;
}

#imst3{
	
	padding-top: 10px;
	padding-left: 50px;
}



.pad{
margin-left: 7%;

}

.svdec{

	border: solid 1px #9a2f8a;	
	border-radius: 20px;
	width: 350px;
	height: 350px;
	margin: 20px;
	

		background-color: rgba(0, 0, 0, 0.19);
	backdrop-filter: blur(1rem);
	box-shadow:1.3rem 1.3rem 1.3rem rgba(0,0,0,0.5);
}

.svdec img{

	transition: 0.9s ease;
}

.svdec img:hover{
	transform: scale(1.1);
	transition: 0.9s ease;
}
#therealx{
background-color: rgba(128, 128, 128, 0.8);
	backdrop-filter: blur(3rem);
	box-shadow:1.3rem 1.3rem 1.3rem rgba(0,0,0,0.5);
border-radius: 20px;

margin-top: 50px;
margin-bottom: 50px;
padding-top: 30px;

}

#therealx p{
	padding-top: 15px;
	width: 70%;
	margin-left: 15%;

}



.viewpage{
	text-decoration: none;
	color:#9a2f8a;
	transition: 0.9s ease;
}

.viewpage:hover{
	color:#e9fe7a;
	transition: 0.9s ease;
}



/*media*/

@media (min-width: 769px) {

.pad{
margin-left: 2%;

}

}

@media (min-width: 950px) {

.pad{
margin-left: 10%;

}


}


@media (min-width: 1200px) {
.pad{
margin-left: 18%;

}

}

@media (min-width: 1500px) {
.pad{
margin-left: 25%;

}

}

@media (min-width: 1700px) {
.pad{
margin-left: 27%;

}

}