/*General*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  transition-duration: 0.5s;
}
#backgroundContainer {
  z-index: -1;
  position: fixed;
  width: 100vw;
  height: 100vh;
  /*  background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.25)), url("img/1.jpg");*/
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  animation: zoomAndMove 120s infinite linear;
  background-position: center center;
}
@keyframes zoomAndMove {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}
#Info {
  position: absolute;
  display: block;
  color: #00000000;
  font-size: 1px;
  transition-duration: 0s;
}
html {
  font-family: sans-serif;
  background-repeat: no-repeat;
  color: white;
}
a {
  text-decoration: none;
  cursor: pointer;
  color: white;
}
a:hover {
  text-decoration: none;
}
/*Animaciones*/
@keyframes Show {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes Centro {
  0% {
    opacity: 0.2;
    width: 80%;
    left: 120px;
  }
  100% {
    opacity: 1;
    width: 55%;
    left: 220px;
  }
}
/*@keyframes curvaA{0%{top:-200px;}100%{top:0px;}}
@keyframes curvaB{0%{top:600px;}100%{top:400px;}}
*/
/*Pagina Error 400/401/403/404/500/503*/
#Error_Centro {
  position: relative;
  text-align: center;
}
#Error_Centro img {
  width: 40%;
}
#Error_Curva {
  position: absolute;
  z-index: -1;
}
#P_ERROR2 p,
#P_ERROR p {
  font-size: 3vw;
  padding: 1.2vw;
  cursor: context-menu;
  border-radius: 2.5vh;
  width: 50%;
  text-align: center;
  margin: auto;
}
#P_Error400 {
  background: #0099ffee;
}
#P_Error401 {
  background: #ff5500ee;
}
#P_Error403 {
  background: #ff0000ee;
}
#P_Error404 {
  background: #0000ffee;
}
#P_Error500 {
  background: #ffdd00ee;
}
#P_Error503 {
  background: #33ff00ee;
}
#IdImgError {
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 1;
}
#IdImgError img {
  width: 50vh;
}
#copyrightfooter {
  position: relative;
  text-align: center;
  display: block;
}
#copyrightfooter {
  font-size: 3vh;
}
footer img {
  margin: 0vh 1.2vh;
  width: 4.5vh;
  -webkit-filter: grayscale(0%);
  filter: grayscale(0%);
}
footer img:hover {
  width: 5vh;
  -webkit-filter: grayscale(60%);
  filter: grayscale(60%);
}
#footer {
  position: relative;
  text-align: right;
  display: block;
  left: -20px;
  top: 30px;
}
footer {
  position: relative;
}
#curvaB {
  position: absolute;
  bottom: 0;
}
#footer,
#copyrightfooter {
  position: relative;
  z-index: 1;
  padding: 2vh;
}
/*Android*/
#Centro_Fondo {
  position: relative;
  text-align: center;
  height: 0;
}
#Centro_Fondo img {
  width: 45%;
}
#curvaC {
  position: absolute;
  z-index: -1;
}
#PCU,
#PCU2,
#PCU3,
#DESCARGARTXT,
#DESCARGARTXT2,
#DESCARGARTXT3,
#DESCARGARTXTp,
#DESCARGARP,
#PCUDTXTp {
  margin: 12vh 0vh -5vh 0vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#DESCARGARP2 {
  margin: 12vh 0vh 18vh 0vh;
  display: block;
  position: relative;
  align-items: center;
  justify-content: center;
  text-align: center;
}
#DESCARGARTXT a,
#DESCARGARTXT2 a,
#DESCARGARTXT3 a,
#DescargarOrdenador,
#DescargarAndroid,
#DESCARGARTXTp p,
#DESCARGARTXT p {
  padding: 1vh;
  border-radius: 1vh;
  font-size: 3vh;
}
#DESCARGARTXTp p {
  background: #00a4ff;
  border-bottom-style: solid;
}
#DESCARGARTXT2,
#DESCARGARTXT3,
#DescargarOrdenador,
#DescargarAndroid {
  margin: 10vh;
  position: relative;
  z-index: 1;
}
#DESCARGARP2,
#DESCARGARP {
  width: 100%;
}
#DESCARGARP2 img,
#DESCARGARP img {
  width: 30vh;
  border-radius: 2vh;
  padding: 0.2vh;
}
#DESCARGARP2 img {
  width: 40%;
  height: 25%;
}
#DESCARGARP div,
#DESCARGARP2 div {
  margin: 0vh 0.2vh;
}
#DESCARGARP2 div p {
  width: 38%;
}
#IconoDescargar,
#IconoDescargar2 {
  width: 22.5%;
}
#DescargarAndroid,
#DESCARGARTXT a,
#DESCARGARTXT2 a,
#DESCARGARTXT p,
#DESCARGARP img {
  background-color: #00ff44;
}
#DescargarOrdenador,
#DESCARGARTXT3 a,
#DESCARGARP2 img {
  background-color: #00a4ff;
}
#AndroidINFO,
#AndroidINFO2,
#DESCARGARVP,
#OrdenadorINFO2,
#OrdenadorINFO {
  padding: 2vh;
  margin: 1.5vh;
  background: #00000033;
  border-radius: 1vh;
  font-size: 3vh;
}
#AndroidINFO {
  margin: 1.5vh;
}
#OrdenadorINFO,
#OrdenadorINFO2 {
  border-color: #00a4ff;
  border-right-style: solid;
}
#AndroidINFO,
#AndroidINFO2,
#DESCARGARVP {
  border-color: #00ff44;
  border-left-style: solid;
}
#PCU2 div {
  margin: 5vh 10vh 20vh;
}
#PCU2 div img {
  width: 25vh;
}
/*index*/
#CentroID img {
  width: 55%;
  animation-name: Centro;
  animation-duration: 3s;
}
#CentroID {
  position: relative;
  text-align: center;
}
#CentroID img:hover {
  width: 60%;
}
#curvaA {
  animation-name: curvaA;
  animation-duration: 3s;
}
#curvaB {
  animation-name: curvaB;
  animation-duration: 3s;
}
#RedesSociales,
#RedesSociales2 {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
#RedesSociales {
  margin: 15vh 0vh 0vh 0vh;
}
#RedesSociales a,
#RedesSociales2 a {
  font-size: 2vh;
  margin: 2vh;
  padding: 1vh;
  border-radius: 1vh;
}
#RedesSociales img,
#RedesSociales2 img {
  width: 10vh;
  margin: 0px 1vh;
}
#RedesSociales #Jugadores,
#RedesSociales2 #Jugadores {
  margin: 4vh 0vh 0vh 0vh;
  font-weight: bold;
  padding: 1vh;
  position: absolute;
  border-radius: 1.5vh;
}
#RedesSociales p {
  font-size: 2vh;
}
#PCUD a:hover,
#PCUL a:hover,
#RedesSociales2 a:hover,
#RedesSociales a:hover {
  opacity: 0.9;
  border-radius: 2vh;
}
#RedesSocialesTXT,
#IP,
#IP2 {
  position: absolute;
  cursor: context-menu;
  top: -5vh;
  text-align: center;
  font-weight: bold;
  animation-name: Show;
  animation-duration: 5s;
}
#IP2 {
  top: -23vh;
}
#RedesSocialesTXT:hover::after {
  content: "Redes Sociales";
  background-color: #ff7300be;
  border-radius: 2vh;
}
#RedesSocialesTXT::after {
  padding: 10px 20px;
  border-radius: 8px;
  content: "Redes Sociales";
  background: #ff7300;
}
#IconoDiscord:hover ~ #RedesSocialesTXT::after {
  padding: 10px 20px;
  border-radius: 3vh;
  content: "Unete a nuestro servidor";
  background: #7289da;
}
#IconoFacebook:hover ~ #RedesSocialesTXT::after {
  content: "Siguenos en nuestra FanPage";
  padding: 10px 20px;
  border-radius: 2vh;
  background: #3b5898;
}
#IconoYouTube:hover ~ #RedesSocialesTXT::after {
  content: "Suscribete a nuestro canal";
  padding: 10px 20px;
  border-radius: 2vh;
  background: #e20508;
}
#PCUD img:hover,
#IconoRP:hover {
  width: 24vh;
  right: 1.5%;
}
#IconoRPG:hover,
#IconoPR:hover {
  width: 24vh;
}
#IconoCV:hover {
  width: 24vh;
  left: 1.5%;
}
#TXTDiscord {
  background: #7289da;
}
#TXTFaceBook {
  background: #3b5898;
}
#TXTYouTube {
  background: #e20508;
}
#IconoFacebook:hover {
  width: 12vh;
  right: 1.5%;
}
#IconoDiscord:hover {
  width: 12vh;
}
#IconoYouTube:hover {
  width: 12vh;
  left: 1.5%;
}
#PCUDTXT,
#PCUTXT {
  position: relative;
  text-align: center;
  margin: 10vh 0vh -10vh 0vh;
}
#PCU {
  position: relative;
  text-align: center;
}
#PCUTXT {
  animation-name: curvaA;
  animation-duration: 3s;
}
#PCUDTXT a,
#PCUTXT a {
  margin: 10vh;
  padding: 1vh;
  border-radius: 1vh;
  width: 20%;
  font-size: 2.5vh;
}
#RedesSociales2 p {
  padding: 2vh;
  font-size: 3vh;
}
#SampDroid_RolePlay,
#SampDroid_Practicas,
#SampDroid_ChatdeVoz,
#SampDroid_RPG {
  background-color: #5af500;
}
#SampDroid_RolePlay:hover,
#SampDroid_Practicas:hover,
#SampDroid_ChatdeVoz:hover {
  background-color: #00f521be;
  border-radius: 4px;
}
#PCU img {
  margin: 0px 9vh;
  width: 21vh;
}
#IP {
  top: -20vh;
  font-size: 3vh;
}
#IP:hover::after {
  padding: 10px 20px;
  border-radius: 1vh;
  content: "Modos de Juego";
  background: #ff0000;
}
#IP::after {
  padding: 10px 20px;
  border-radius: 1vh;
  content: "Modos de Juego ";
  background: #ff0000;
}
#IconoRP:hover ~ #IP::after {
  content: "Juega RolePlay en Android";
  background: #00ff33e8;
}
#IconoRPG:hover ~ #IP::after {
  content: "Juega Rol bajo en Android";
  background: #00ff33e8;
}
#IconoPR:hover ~ #IP::after {
  content: "Practica con tus amigos";
  background: #00ff33e8;
}
#IconoCV:hover ~ #IP::after {
  content: "Juega RolePlay con Chat de Voz";
  background: #00ff33e8;
}
#DescargarSamp {
  position: absolute;
  left: 5vh;
  top: 3vh;
}
#DescargarSamp a {
  padding: 2vh;
  font-size: 3vh;
  background-color: #ffdd00;
  border-radius: 2vh;
}
#DescargarSamp img {
  width: 30vh;
}
/*Interior Skin Veh*/
#Skins img,
#Interiors img,
#Vehiculos img {
  background-color: #00000033;
  border-radius: 1vh;
  border-color: #ff2200;
  border-bottom-style: solid;
}
#Vehiculos img {
  border-color: #0022ff;
  width: 25vh;
}
#Interiors img {
  border-color: #ffcc00;
  width: 60vh;
}
#Skins table,
#Interiors table,
#Vehiculos table {
  display: flex;
  align-items: center;
  justify-content: center;
  left: 0;
  right: 0;
}
#P_ERROR2 {
  align-items: center;
  margin: 0vh 0vh 20vh;
}
#Skins p,
#Interiors p,
#Vehiculos p {
  font-size: 2.5vh;
  text-align: center;
  padding: 1vh;
  background-color: #ff550085;
  border-radius: 0.5vh;
  border-color: #ff2200;
}
#Vehiculos p {
  background-color: #0088ff85;
}
#Interiors p {
  background-color: #ffcc00cc;
}
#Skins img {
  width: 20vh;
}

/*Practicas*/
#Jugadores {
  background: #00ff66;
}
#Jugadores strong {
  background: #00ff00;
  color: #00ff00;
  font-size: 20px;
  border-radius: 50px;
}
#IP2 {
  padding: 10px 20px;
  border-radius: 8px;
  content: "pr.sampdroid.app";
  background: #999999;
}
#IP2:hover {
  background-color: #77a181be;
  border-radius: 4px;
}
#PCU3 {
  animation-duration: 3s;
  animation-name: curvaA;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
#PCU3 img {
  margin: 0px 18vh;
  width: 10%;
}
#PCU3 img:hover {
  width: 14%;
}
/*Terminos*/
#PCUDTXTp #TerminosINFO {
  border-color: #ff2200;
  border-bottom-style: solid;
}
#PCUDTXTp #TiendaINFO {
  border-color: #ffcc00;
  border-bottom-style: solid;
}
#PCUDTXTp p {
  text-align: center;
  width: 360px;
  background-color: #00000033;
  display: block;
  margin: 40px;
  padding: 10px 20px;
}
#TerminosINFO {
  background-color: #00000069;
  border: 10px;
  border-radius: 8px;
  padding: 10px;
  font-size: 2vh;
}
#PCUDTXTp {
  position: relative;
  z-index: 1;
  margin: 0vh 0vh 20vh 0vh;
}
@media screen and (max-width: 1025px) {
  /*Pagina Error 400/401/403/404/500/503*/
  #PCUDTXT a,
  #PCUTXT a {
    font-size: 1.5vh;
  }
  #copyrightfooter,
  #copyright {
    font-size: 1.5vh;
  }
  #PCU2 div p {
    font-size: 2vh;
  }
  #Centro_Fondo img,
  #Error_Centro img {
    width: 90%;
  }
  #IdImgError {
    z-index: -10;
  }
  #IdImgError img {
    width: 90%;
  }
  #P_ERROR2 p,
  #P_ERROR p {
    width: 100%;
    font-size: 6vw;
  }
  #footer {
    left: 0px;
    text-align: center;
  }
  footer {
    position: absolute;
    width: 100%;
  }
  /*Android*/
  #DESCARGARTXT a,
  #DESCARGARTXT2 a,
  #DESCARGARTXT3 a,
  #DESCARGARTXTp p,
  #DESCARGARTXT p {
    font-size: 2vh;
  }
  #DESCARGARTXTp,
  #DESCARGARTXT {
    margin: 35% 0vh -5vh 0vh;
  }
  #PCU2,
  #DESCARGARP2,
  #DESCARGARP {
    display: block;
  }
  #DESCARGARP2 img,
  #DESCARGARP2 div p {
    width: 80%;
  }
  #PCU2 div:first-child img {
    margin: 10vh 0vh 0vh;
  }
  #PCU2 div {
    margin: 7vh 0vh 4vh 0vh;
    width: 100%;
  }
  /*index*/
  #PCUDTXT,
  #PCUTXT {
    margin: 30vh 0vh 0vh 0vh;
  }
  #PCU {
    text-align: center;
    display: flex;
  }
  #PCUDTXT a,
  #PCUTXT a {
    margin: 0vh;
  }
  #IP {
    margin: -5%;
  }
  #PCU img {
    margin: -10vh 1vh 0vh 1vh;
    width: 22%;
  }
  #PCU img:hover {
    width: 24.5%;
  }
  #RedesSociales #Jugadores {
    top: 10vh;
  }
  #RedesSociales img {
    width: 15%;
  }
  #IconoFacebook:hover,
  #IconoDiscord:hover,
  #IconoYouTube:hover {
    width: 17.5%;
  }
  #DescargarSamp {
    left: 2vh;
    top: 1vh;
  }
  #DescargarSamp img {
    width: 10vh;
  }
  #DescargarSamp a {
    font-size: 1vh;
    padding: 1.25vh;
  }

  /*Interior Skin Veh*/
  #Interiors p,
  #Skins p,
  #Vehiculos p {
    padding: 0px;
  }
  #Skins img {
    width: 6vh;
  }
  #Interiors img {
    width: 20vh;
  }
  #Vehiculos img {
    width: 85px;
  }
  #Skins,
  #Interiors,
  #Vehiculos {
    margin: 0vh;
  }
  #Skins p,
  #Interiors p,
  #Vehiculos p {
    font-size: 1.5vh;
  }
  /*Practicas*/
  #PCU3 {
    top: -22vh;
  }
  #PCU3 img {
    margin: 0px 2vh;
    width: 20%;
  }
  #PCU3 img:hover {
    width: 22.5%;
  }
  #RedesSociales2 p {
    top: 10vh;
  }
  #RedesSociales2 a {
    font-size: 1.25vh;
  }
  #IconoDescargar {
    width: 15%;
  }
  #IconoDescargar2 {
    width: 100%;
  }
  /*Terminos*/
}
