html,body{
  font-family:"Bebas";
  margin:0px 0px 0px 0px;
  padding: 0px 0px 0px 0px;
  overflow-x: hidden;  
}
.tamano{
  height:90vh; width:100%;

}

.errorp
{
  height: 50vh;
  color: yellow;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.botonr{
  display: flex;
  margin-top: 20px;
  justify-content: center;
  align-items: center;
}
.botonr .interi{
  border: 2px solid yellow;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40%;
}
.botonr:hover a{
color: white!important;
}
.textor{
  display: flex;
  justify-content: center;
  align-items: center;
}
.card-img-top{
  height:70vh;
   width:auto; 
}

.timmy2{
  font-size: 3em;
  color:#FCED05;
  display: flex;
  justify-content: center;
  align-items: center;
  top:50%;
}

.border{
  color: #272727;
  border: 3px black solid ;
 background: #FCED05;
  margin: 0px 0px 0px 0px;
  display: inline-flex;
  padding: 3px 30px ;
  font-weight: bold;
  font-size: 3em;
}
.slider{ font-size:3em; font-family:"BebasR";} 

.timmy{
  font-size: 4vh;
  color:black;
  display: flex;
  justify-content: center;
  align-items: center;
 
}

.borde{
  color: #FCED05;
  border: 3px #FCED05 solid ;
  font-size: 3em;
  margin: 0px 0px 0px 0px;
  display: inline-flex;
  padding: 3px 30px ;
}
#bordes{
  color: #FCED05;
  border: 3px #FCED05 solid ;
  font-size: 2em;
  margin: 0px 0px 0px 0px;

  
}
.cuadro2{
  background-color: black;
  height: 90vh;
  opacity: 0.5;
}

.fa,#color,.btn{
  color:#FCED05;
  font-size:medium;
  letter-spacing: 2px;
}
.s{
  font-size: 1em;
  color:#FCED05;
  letter-spacing: 2px;
}
.sss{
  margin: 10px auto;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  /* background: white!important; */
}

.sss .sa{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1em;
  /* background: rgb(238, 36, 36)!important; */
  height: 100%;
  color:#FCED05;
  letter-spacing: 2px;
}

.fa:hover, .s:hover{
color:white;
transition: 500ms;

}

.pie{
background: black;
text-align: center;
color:#FCED05;
font-size: 30px;
}
.letrero2{
  max-width: 100%;
  height: 100%;
  margin: 0px 0px 0px 0px;
  top:50%;
  
  z-index: 1;

}

.letrero{
  max-width: 75%;
  height:60vh;
margin-top: 30px;
  top:80%;
 
  z-index: 1;

}

.center {
  position: relative;
  top:50%;
  font-size: 40px;
  margin: 0px 0px 0px 0px;
  max-width: 100%;
  max-height: 400px;
 z-index: 2;
 color: #FCED05;
}

.center2 {
  color:#FCED05;
  position: relative;
  top:50%;
  font-size: 40px;
  margin: 0px 0px 0px 0px;
  max-width: 100%;
  max-height: 400px;
 z-index: 2;
}


.navbar-brand>img{
  width: 80%;
  max-width: 100%;
  min-width: 10%;
 
}
.carousel-item>img {
  width: 100%;
  max-width:100%;
  min-height: 100%;
  height: 100%;
}
.bg-dark {
background-color: black!important;
}

.navbar-collapse{
max-width: 100%;
margin-left: 30px auto;

}
.navbar-toggler-icon,.navbar-dark {
  max-width:100%;
  color: white;
  border-color: #FCED05;
  letter-spacing: 2px;
  font-size: 30px;
}
.navbar-toggler {
  padding: .25rem .75rem;
  font-size: 1.25rem;
  line-height: 1;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: .25rem;
}

.navbar-dark .navbar-toggler {
  color: #FCED05;
  border-color: #FCED05;
}
.p-2:hover{
  color: black!important;
  text-decoration: none;
  transition: 500ms;
  background-color:#FCED05 ;
}

.p-2{
  font-size: 1em;
  font-family: "BebasR";
  margin:20px;
  color: #FCED05!important;
  text-decoration: none;
  background-color: transparent;
}


html,body{
  background: black;
  font-family:"Bebas";
}

.galeria{
  text-decoration: none;
  color: #FCED05;

}
a {
 
  color: #FCED05;
  font-size: 2em;
  text-decoration: none;
  background-color: transparent;
  display: inline;
}
a:hover {

  color: white;
  transition: 500ms;
  text-decoration: none;
  background-color: transparent;
}
#borde{
  border: 2px #FCED05 solid;
}

#borde:hover{
  border: 2px white solid;
}

.foto{
  position:relative;
  display:block;
  justify-content: center;
 
  width:100%;
  max-width: 100%;
}

.sidebar {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
}

.sidebar a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 25px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidebar a:hover {
  color: #f1f1f1;
}

.sidebar .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}
.fondom{
 max-width: 100%; max-height: 30vw; min-height: 300px;
}
.openbtn {
  font-size: 20px;
  cursor: pointer;
  background-color: #111;
  color: white;
  padding: 10px 15px;
  border: none;  transition:400ms;
}
.openbtn:hover{
  transition:400ms;
  color:#111;
  background-color: #FCED05;
}
.mupi{
  color:#111;
    font-size:3em; 
    margin-top: 200px; 
     font-family:"BebasR";
}
.cartel{
  top: 30%;
  font-family:"BebasR"; top:20%;
  font-size: 3em; 
}

.cuadro{
  background-color: black;
  opacity: 0.5;
  position: absolute;
  top:10%; 
  max-width:100%;
  max-height: 80%;
  height: 100vh;
  width: 42%;
}
.sa{
  font-size: 30px;
}
/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-width: 760px) {
  .sidebar {padding-top: 15px;}
  .sidebar a {font-size: 18px;}
  .border,.borde,.slider{
    font-size: 2em!important;
  }
  .mupi{
    font-size: 1.5em!important;
  }
  .cartel{
    font-size: 15px!important;
    top:5%!important;
  }
  .letrero2{
    top:10%!important;
    max-height: 100px!important;
  }
  .tamano{
    height: 50vh;
  }
  .letrero{
    max-width: 75%;
    height:60vh;
  margin-top: 20px;
    top:80%;
   
    z-index: 1;
  
  }

  #bordes{
    color: #FCED05;
    border: 3px #FCED05 solid ;
    font-size: 1.5em;
    margin: 0px 0px 0px 0px;
  
    
  }


  .cuadro2{
    height: 50vh;
  }
  .timmy2{
    font-size: 1.5em;
  }

  .slider1{
    background-image: url("http://urbana.com/assets/images/Slider1.png");
    background-size: auto;
   background-position: center;
  }
  .slider2{
    background-image: url("http://urbana.com/assets/images/Slider2.png");
    background-size: auto;
    background-position: center;
  }
  .slider3{
    background-image: url("http://urbana.com/assets/images/Slider3.png");
    background-size: auto;
    background-position: center;
  }
  .slider4{
    background-image: url("http://urbana.com/assets/images/Slider4.png");
    background-size: auto;
    background-position: center;
  }
  .parabus{
  
    background-image: url("http://urbana.com/assets/images/parabus.jpg");
    background-size: auto;
    background-position: center;
  }

}
@media screen and (max-width:361px){
  #logo{
    width: 220px;
    height: 50px;
  }

  #letrero{
    height: 40vh;
  }

  .timmy2{
    font-size: 18px;
  }
}

@media screen and (max-width: 570px) {
  .sidebar {padding-top: 15px;}
  .sidebar a {font-size: 18px;}
  .border,.borde,.slider{
    font-size: 1em!important;
    
  }

  #bordes{
    color: #FCED05;
    border: 3px #FCED05 solid ;
    font-size: 1em;
    margin: 0px 0px 0px 0px;
  
    
  }

.parabus{
  transform:translate(-400px, 0px);
}
.mupis{
  min-width:70vh;
  transform:translate(-110px, 0px);
}
.mupi2{
  transform:translate(-65px, 0px);
}
.mupi3{
  transform:translate(-20px, 0px);
}
.mupi4{
  transform:translate(-50px, 0px);
}

  .s{

    font-size: 25px;

  }

  .slider1{
    background-image: url("http://urbana.com/assets/images/Slider1.png");
    background-size: auto;
   background-position: center;
  }
  .slider2{
    background-image: url("http://urbana.com/assets/images/Slider2.png");
    background-size: auto;
    background-position: center;
  }
  .slider3{
    background-image: url("http://urbana.com/assets/images/Slider3.png");
    background-size: auto;
    background-position: center;
  }
  .slider4{
    background-image: url("http://urbana.com/assets/images/Slider4.png");
    background-size: auto;
    background-position: center;
  }
  

  


  .timmy2{
    font-size: 1em;
  }
  .tamano{
    height: 50vh;
  }
  .mupi{
    margin-top:0px!important;
    font-size: 1em!important;
  }
  .cartel{
    font-size: 20px!important;
    text-align: center!important;
  }
    .letrero2{
      top:10%!important;
    max-height: 100px!important;
  }

  
  .timmy{
    font-size: 1.5em;
  }

  .letrero{
    height: 48vh;
  }

  .cuadro{
    top:10%; 
    max-width:100%;
    max-height: 80%;
    height: 100vh;
    width: 100%;
  }
}

@media screen and (max-width: 1370px){
  .mupi{
    margin-top:70px;
    font-size: 1.5em;
  }
  .tamano{
    height: 70vh;
  }
  .cartel{
    font-size: 20px!important;
    top:40%;
  }
  .letrero2{
    top:10%!important;
    max-height: 100px!important;
  }
  .mupi{
    margin-top:150px;
    font-size: 30px!important;
  }
  .cuadro2{
    height: 60vh;
  }
  .mupis{
    transform:translate(-160px, 0px);
  }
  .timmy2{
    font-size: 1.4em;
  }
}


@media screen and (max-width: 1800px){

  .cartel{
    font-size: 30px!important;
    top:10%!important;
  }
  .mupi{
    margin-top:170px;
    font-size: 30px!important;
  }

  .cuadro2{
    height: 70vh;
  }
}
.close{
  /* background: white!important;  */
  color: white!important;
}

.pop{
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  background-image: url(../images/IMG_7015.JPG);
  height: 250px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  color: rgb(0, 0, 0)!important;

  align-items: center;

}
.btn-danger{
  background: yellow!important;
  color: black!important;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  border: 0;
  
}

.modal-footer{
  background: rgb(0, 0, 0)!important;
}
.modal-header{
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;

  background: rgb(0, 0, 0)!important;
  color: yellow!important;

}



.lolo{
  width: 500px;
  border: 0;
}

.po{
  width: 100%;
  /* background: chocolate; */
  margin-top: 150px!important;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dddd{
  font-weight: 600;

}
.ss{
  background:yellow;
  color: black!important;
  padding: 10px;
  margin-top: 20px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;

}
.ss:hover{
  background:yellow;


}