@font-face {
    font-family: restaurante;
    src: url(font/Restaurant.otf);
  }
  @font-face{
    font-family: futuraBold ;
    src: url(font/FuturaStd-Bold.otf);
  }
  @font-face{
    font-family: futuraLight ;
    src: url(font/FuturaStd-Light.otf);
  }
  @font-face{
    font-family: futuraMedium ;
    src: url(font/FuturaStd-Medium.otf);
  }
  body{
    overflow-x: hidden;
    font-family: futuraBold;
  }
.row {
    text-align: center;
}
.bellaAnna{  
  font-family: futuraBold;
    background-repeat: no-repeat;
    background-size: cover;
    max-height: 57rem;

}
.bellaAnna img{
  width: 100%;
}
.contacto{
color:white;
text-align: left;
}
.AvisoLegal{
  color: black;
}
.AvisoLegal .topnav a{
  color: #89171A !important;
}

.AvisoLegal .Titulo{
  margin-top: 5rem;
}
.AvisoLegal p{
  font-family: futuraLight;
  
}
.AvisoLegal strong{
  font-family: futuraMedium;
}
.contacto .topnav a{
  color: white;
}
.contacto input{
    background-color: transparent;   
    width: 100%;
    border: 1px solid;
    border-color: rgba(255,255,255,.4);
    color: white;
}
#yDeChurrasco{
  margin-left: 27%;
}
.dropdown-menu.textoMobile{
  margin-left: 0 !important;
}
.entradas, .columnaCarta img{
  width: 10%;
}
.medio{  
  margin-left: 27rem;
}
.contacto .laBellaAnna{
  margin-top: 3rem;
  font-size: 5rem;
}
.laBellaAnna h1{
  font-size: 6rem;
}
.contacto h3{
  font-family: futuraMedium;
}
 .contacto input[type=email]{
  color: white;
  padding-left: 0.5rem;
}
.contacto .row{
text-align: left;
margin-top: 2rem;
}
.contacto .boton{
  width: 100%;
  height: 3rem;
  background-color: #89171A;
  color: white;
  border: none;
  -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;  
    margin-bottom: 2rem;
}
#textoContacto{
  color: white;
  text-align: left;
  margin-left: 8rem;
}
.clientes img{
  max-height: 210px;
  max-width: 310px;

}
.clientes {
  padding-top: 1%;
  padding-bottom: 1%;
}
textarea{
width: 100%;
resize: none;
height: 6rem;
background-color: transparent; 
color: white;
}
.contacto h3{
font-size: 1.4rem;
}
.nombre{
  margin-top: 8%;;
}
.parallax {
    /* The image used */
    background-image: url("img/fondoContacto.jpg");
  
    /* Set a specific height */
    min-height: 400px; 
  
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .parallax1 {
    /* The image used */
    background-image: url("../img/follow.jpg");
  
    /* Set a specific height */
    min-height: 200px; 
  
    /* Create the parallax scrolling effect */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .descubreSabor h3 {
    text-transform: uppercase;
    color: #006666;
}
.descubreSabor{
  background-image: url("img/fondoNosotros1.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 340px;     
    color: #006666;
}
#clientes{
  background-image: url(img/fondoNosotros1.jpg);
  background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 225px; 
}
button p {
  font-size: 2rem;  
  color: #006666;
}
.textoMobile p{
  color: #89171A;
}
.descubreSabor{
  text-align: center;
}
.bellaAnna h3{
    font-size: 70px;
    line-height: 88px;
    text-transform: uppercase;
    color: lightgrey; 
    min-height: 95vh; 
    display: flex;    
    align-items: center;
    margin-left: 27.5rem;
}
.navNosotros{
  margin-left: 48.6rem;
}
.navbar {
  background-color: transparent; 
  position:fixed;
  z-index:1;
  top: 0;
  width: 100%;
}
.logoNav{
  margin-left: 24rem;
}
.navbar.scrolled a {
 color: #89171A !important;
}
.navbar.scrolled .navNosotros{
  margin-left: 43.6rem;
}
#bellaAnna{
  margin-left:23.5rem;
  
}
#navbarDropdown{
  margin-left: 25rem;
}
.navbar.scrolled .dropdown-menu a {
  color: white !important;
}
.topnav a:hover {
  background-color: #ddd;
  color: black;
}

.topnav a.active {
  background-color: none;
  color: white;
}

.topnav .icon {
  display: none;
}
.carta{
  margin-left: 30rem;
}
.catering1994{
  margin-top: 2%;
}
  .textoSabor{    
    font-size: 50px !important;
    line-height: 52px;
    margin-top: 2rem;
    text-align: center;
  }
  .textoClientes{    
    font-size: 50px !important;
    line-height: 52px;
    margin-top: 5rem;
    margin-bottom: 5rem;
    text-align: center;
    color: #89171A;
  }
  .nosotros{
    text-align: center;
    padding: 1%;
  }
  .carousel {
    position: relative;
    width: 100%;
}
  .textoReserva{    
    font-size: 50px !important;
    line-height: 5rem;
    margin-top: 9rem;
    margin-left: 8rem;
    text-align: justify;
    color: white;
  }
  .botonCarta{
    text-align: left;
    margin-top: 9.7rem;
    margin-left: 6rem ;
    
  }
  .botonCarta button{
    color: white;
    background: #4F9B8B;
    border: none;
    height: 4.5rem;
    width: 14rem;
  }
  .botonCarta h3{
    padding: 1%;
  }
  .instagram{
    background-color: #FCFBF9;
  }
  #galeria {
    margin: 1rem auto;
    width:100%;
    max-width:95rem;
    column-count: 4;
}
  .footer{
    background-color:#006666;    
    min-height: 50px;
    color: white;
    padding: 1%;
  }
  .logos{
    text-align: right;
  }
  .logos h3{
    margin-right: 4%;
    
  }

  .copy-info{
    margin-top: 2%;
    font-size: 15px;

  }
  .copy-info a{
    color: white;
  }
  .reserva{
    background:rgba(21,21,21,.5);
    min-height: 400px;
  }
  #myVideo img{
    background-size: cover;
  background-position: center ;
  color: white;
  font-family: futuraBold;
  }
  .bellaAnna video{
    position:relative;
    z-index:0;
  }
  .instagram{
    padding: 0;
  }
  .instagram img{
    height:500px;
    width: 483.25px;
  }

.img {
    width: 500px;
    height: 500px;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
}
.logos{
  align-items: middle;
}
.condiciones{
  font-family: futuraLight;
  margin-top: 3%;
}
.condiciones h2{
  font-family: futuraMedium;
}
.logos img{
  width: 20%;
  height: 80px;
}
.tituloCartaEspeciales{
  margin-top: 15%;
  text-align: center;
  }
  .tituloCartaEspeciales h1{  
  font-size: 54px;
  line-height: 58px;
  text-transform: uppercase;
  color: #000;
  }
.tituloCarta{
margin-top: 15%;
text-align: left;
}
.tituloCarta h1{  
font-size: 54px;
line-height: 58px;
text-transform: uppercase;
color: #000;
}
.columnaCarta{
  text-align: justify;
}
.menus p{
  font-family: futuraMedium;
}
.menus{
  background-image: url('img/menu.jpg');
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: 95%;
  padding: 3%;
}
.menus2 p{
  font-family: futuraMedium;
}
.TituloMenuEspecial{
  margin-top: 8rem !important;
  text-align: center !important;
}
.menus2{
  background-image: url('img/menu2.jpg');
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: 95%;
  padding: 3%;
}
.columnaCarta h2{
  font-size: 45px;
  line-height: 52px;
  text-transform: uppercase;
  color: #000;
}
.columnaCarta h1{
  font-size: 54px;
    line-height: 58px;
    text-transform: uppercase;
    color: #000;
}
.CartaBellaAnna .row{
  margin-top: 2%;
}
.CartaBellaAnna{
  font-family: futuraBold ;
  background: url("../img/fondo.jpg");
}
.tituloCarta{
  margin-bottom: 3%;
}
#jamon{
  margin-top: 30%;
  width: 320px;
}
#caliente{
  margin-top: 33%;
  width: 330px;
}
.spaghetti{
  margin-left: 19%;
  margin-top: 11%;
}
.panzerotti{
  margin-left: 60%;
}
.columnaCarta span{
  font-family: futuraLight;
}
.columnaCarta p{
  font-family: futuraMedium;
}
/*.dropdown-menu{
  position: fixed !important;
}*/
.logoCatering{
  margin: auto;
  width: 35%;
  padding-bottom: 27%;
}
.idLogo{
  background-image: url('./img/logo_SerCatering.png');
  background-repeat: no-repeat;
  background-position:center left;
  background-size: 8%;
  margin-left: 4%;
}
.carta{
  margin-left: 28rem !important;
}
.dropdown-menu{
  margin-left: 24.5rem;
}
.navbar a{
  color: white !important;
}
.CartaBellaAnna .navbar a{
  color: black !important;
}
.CartaBellaAnna .navbar .dropdown-item {
  color: white !important;
}
::placeholder{
  color: white;
}
.fa{
  color: #89171A;
  font-size: xx-large;
}
.imagenesFooter{
  opacity: 0.7;
}
.textoMobile{
  background: none;
  color: white;
  border: none; 
  width: 95%;
  position: inherit !important;
  transform: translate3d(2%, 2%, 0) !important;
  text-align: center;
}
.btn-secondary {
  color: black;
 background-color: transparent!important ;
  border-color: transparent!important ;
}
@media screen and (max-width: 375px) {
  .nosotros p {
    font-size: 15px;
  }
  .AvisoLegal .topnav .nav-item a{
    color: white !important;
    }
  .bellaAnna h3{
    margin: 4.5rem !important;
    font-size: 30px !important;
  }
  .textoReserva, .textoSabor{
    margin-top: 2rem !important;
  }
  
 .container-fluid{
    padding-right: 15px !important;
    padding-left: 15px !important;
  }
  #bellaAnna{
    margin:0 !important;
  }
  .navNosotros{
    margin-left: 0;
  }
}
@media only screen and (min-width: 380px) and (max-width: 425px) {
  .AvisoLegal .topnav .nav-item a{
    color: white !important;
  }
  .textoReserva, .textoSabor{
    margin-top: 2rem !important;
  }
  
 .container-fluid{
    padding-right: 15px !important;
    padding-left: 15px !important;
  }
#bellaAnna{
  margin:0 !important;
}
.bellaAnna h3{
  margin: 5.5rem !important;
  font-size: 40px !important;
}
.navNosotros{
  margin-left: 0 !important;
}
}
.bellaanna .fa{
  color: white;
}
@media screen and (max-width: 600px) {

  .AvisoLegal .topnav .nav-item a{
    color: white !important;
  }
  .navbar.scrolled a {
    color: #89171A !important;
  }
  .navbar.scrolled .fa {
    color: #89171A !important;
  }
  .navbar.scrolled .nav-item a {
    color: white !important;
  }
  #navbarDropdown{
    background: none;
  }
  .navbar.scrolled{
    background-color: rgba(255,255,255,.9) !important;
  }
  .fa{
    margin-right: 1rem;
  }
  .dropdown-menu{
    margin: 0 !important;
  }
  .navbarSm{
    background-color: #89171A;
    color: white;
    padding-left: 5%;
    padding-bottom: 3%;
  }
  #navbarDropdown{
    margin-left:0 !important;
  }
  #bellaAnna{
    margin-left: 0;
  }
  #navbarDropdown{
    margin-left: 0;
  }
  .dropdown-menu{
    margin-left: 0;
  }
  .logoNav{
    margin: 0;
  }
  .carta{
    margin: 0 !important;
  }
  .logos{
    text-align: center;
  }
  .imagenesFooter{
    margin-right: 0;
    
  }
  .topnav{
    position: inherit;
  }
  .botonCarta{
    text-align: center;
    margin-top: 0;
    margin-left: 0 ;
    
  }
  .textoReserva{    
    font-size: 50px !important;
    line-height: 52px;
    margin-top: 0;
    margin-left: 0 ;
    text-align: center;
    color: white;
  }
  .textoSabor{    
    font-size: 50px !important;
    line-height: 52px;
    margin-top: 0;
    margin-left: 0 ;
    text-align: center;
  }
 
  .topnav a.icon {
    float: right;
    display: block;
  }

  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .bellaAnna{  
    font-family: futuraBold;
      background-repeat: no-repeat;
      background-size: cover;
      min-height: 0; 
  }
  #myVideo{
    min-width: 0;
  }
  .topnav h3{
    color: #4F9B8B;
  }
}
@media screen and (min-width: 768px) {
.navbar.scrolled {
  background-color: rgba(255,255,255,.9) !important;
  transition: background-color 200ms linear;
  color: black;  
  margin-top: 0%;
}
}

@media only screen and (min-width: 450px) and (max-width: 768px) {
  #textoContacto {
    margin: 6% !important;
}
  .logosPequeños{
    padding-top: 2rem;
  }
 .descubreSabor .col-12{
  padding-left: 4%;
  padding-right: 3%;
 }
  .textoReserva{
    padding-left: 1rem;
  }
 #clientes img{
   max-width: 240px;
 }
  .contacto{
    margin-left: 0rem;
  }
  .navNosotros{
    margin-left: 13rem !important;
  } 
  .bellaAnna h3{
    margin-left: 2.5rem !important;
    padding-top: 23rem;

  }
  #bellaAnna{
    margin-left: 1.5rem !important;
  }
  #navbarDropdown{
    margin-left: 11.5rem;
  }
  .dropdown-menu{
    margin-left: 11.5rem;
  }
  .logoCatering {
    margin: 0 9rem !important;
    width: 55% !important;
    padding-bottom: 36% !important;
}
.navbar.scrolled .navNosotros {
  margin-left: 11.5rem !important;
}
}
@media only screen and (min-width: 769px) and (max-width: 1024px) { 
  .dropdown-menu.textoMobile{
    margin-left: 0 !important;
  }
 
  .contacto{
    margin-left: 5rem;
  }
  .navNosotros {
    margin-left: 21.5rem !important;
} 
  .bellaAnna h3{
    padding-top: 12rem;
    margin-left: 7.5rem !important;
  }
  .textoSabor{
    margin-left:0;
  }
  .textoReserva{
    margin-left:0;
  }
  #bellaAnna{
    margin-left: 2.5rem !important;
  }
  #navbarDropdown{
    margin-left: 18.5rem;
  }
  .dropdown-menu{
    margin-left: 18.5rem;
  }
  .logoCatering {
    margin: 0 10rem !important;
    width: 55% !important;
    padding-bottom: 36% !important;
}
.navbar.scrolled .navNosotros {
  margin-left: 18.5rem !important;
}
}
@media screen and (max-width: 1441px) {
  #textoContacto{
    margin: 0;
  }
  .logos img{
    width: 20%;
  }
  .logos{
    text-align: center;
  }
  .imagenesFooter{
    margin-right: 0;
  }
  #bellaAnna{
    margin-left: 9.5rem;
  }
  .bellaAnna h3{
    margin-left: 17.5rem;
    min-height: 93vh;
  }
  .navNosotros {
    margin-left: 34.5rem;
}
.logoCatering {
  margin: 0 18rem;
  width: 45%;
  padding-bottom: 36%;
}
.navbar.scrolled .navNosotros {
  margin-left: 30.6rem;
}
  .bellaAnna{
    min-height: 0;
  }
  .textoReserva{
    margin-left: 0;
  }
}
@media screen and (min-width: 2560px)  {
  .dropdown-menu.textoMobile{
    margin-left: 0 !important;
  }
  #bellaAnna{
    margin-left:44.5rem;
  }
  .bellaAnna h3{
    margin-left: 41.5rem;
    padding-top: 22rem;

  }
  .navNosotros {
    margin-left: 69.5rem;
}
.navbar.scrolled .navNosotros{
  margin-left: 62.6rem;
}
.logoCatering {
  padding-bottom: 19%;
}
}
/* Móviles en horizontal o tablets en vertical */

@media (max-width: 767px) { 
  #textoContacto {
    text-align: center;
    margin-top: 2%;
}
  #galeria {
      columns:2;
  }
  .navNosotros{
    margin-left: 0 !important;
  } 
  .logoCatering {
    margin: 0px 1rem;
    width: 92%;
    padding-bottom: 22%;
}
}
      
/* Móviles en vertical */

@media (max-width: 480px) {
  #galeria {
      columns: 3;
  }
  .navNosotros{
    margin-left: 0 !important;
  } 
}