/* CSS Document */

html {
  scroll-behavior: smooth;
}

body{
  color: #332f2e !important; 
  font-family: Open Sans;
  font-size:18px;
}

#header{
  background:white;
  padding-bottom: 7px;
  border-bottom: 1px #ddd solid;
}

.carousel-item .img-fluid{
    width:100%;
}

#quienes-somos{
  font-size:19px;
}


#top-header-text{
    font-size:13px;
}

#productos{
  margin-top: 60px;
  background-color:#f15f23;
  color: white;
}

.naranja{
  color:#f15f23;
}

.background-blue{
  background-color:#066a95;
  color: white;
}



.compromiso{
    margin-top:60px;
    border-radius:10px;
    padding: 40px;
}

.azul{
  color:#066a95;
}

#map_canvas { 
  height: 100%;
  border-radius:60px;
}

#mapa{
  width: 80%; 
  height: 400px;
  margin:0 auto;
}

#top-header{
  background:#066995;
  color:white;
  padding-top:7px;
  padding-bottom:7px;
}

#top-header #social-icons a{
  color:white;
  margin:2px;
  font-size:18px;
}      

#quienes-somos{
  margin-top:80px;
}

#quienes-somos strong{
  font-weight: 600;
}

/*
.carousel-indicators{
  position: initial;
  margin-top:40px;
}
*/
.carousel-indicators li {
    background-color: #f4f4f4;
    width: 14px;
    height: 14px;
    border-radius: 24px !important;
    margin: 5px;
    border: none;
}


.carousel-indicators li.active
{
   background-color:#da2918;
}


[data-toggle="modal"] h4{
    text-transform: uppercase;
}

.modal{
  text-align:center;
}


.modal a,
.modal h5{
    color:#f15f23;
    font-weight: 600;
}

.modal a{
    margin-top: 20px;
    display: block;
}

h2{
    font-weight: 600;
    font-size:43px;
}

h3{    
    font-weight: 700;
    font-size:33.5px;
}

.modal h3{
    font-weight: 600;
    margin-bottom:30px;
    color: #f15f23;
    font-size: 44px;
}

.modal .close{
  display: block;
  width:42px;
  height:42px;
  background:no-repeat url("img/closebtn.png");
}

#audifonos-onda-top{
  background-color:#fff;
  padding:0;
  
}

#donde-onda-top{
  background-color:#e9e9e9;
  padding:0;
}

#prueba-audio{
    text-align:center;
    background:#f15f23;
    color:white;
    padding: 50px;
}

#prueba-audio h3{
    padding: 0 15px;
    margin-top: 20px;
}

#prueba-audio>div
{
    display: inline-block;
}

#prueba-audio>div>div
{
    display: inline-block;
    position: relative;
    top: -8px;
    padding: 0 15px;
}
   
#prueba-audio>div:before{
   background: url("img/prueba-bg1.png");
   width: 63px;
   height: 103px;
   content:"";
    display:inline-block;
}   

#prueba-audio table{
    margin: 0 auto;
}

#prueba-audio>div:after{
   background: url("img/prueba-bg1.png");
   width: 63px;
   height: 103px;
   content:"";
    display:inline-block;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}   

#prueba-audio a{
    color:white;
    text-decoration:none;
}
     
#donde-estamos{
  padding-top:40px;
  color:black;
}

#donde-estamos h3,
#donde-estamos h4{
    color:black;
    text-transform:uppercase;
}

iframe{
    border: black 2px solid !important;
    border-radius: 7px;
}

#donde-estamos p{
    font-size: 20px;
}

#detalle-audifono{
    padding: 50px;
    max-width: none !important;
}

.modal-content{  
    border-radius: 6px;
    background-color: #f7f7f8;
    max-width: 1000px;
    margin: 0 auto;
    border: 2px solid #f15f23;     
}

#audifonos{
    margin-top: -110px;
}

#lista-audifonos h5{
    color:#f15f23;
    font-size:21px;
    font-weight:bold;
}

#lista-audifonos .col-md-4
{
    padding: 10px !important;
}

#lista-audifonos .col-md-3{
    padding: 10px !important;
}

#lista-audifonos h4{    
    font-size:22px;
    font-weight:bold;
}

#lista-audifonos .row{
    padding:0 !important;
}

#lista-audifonos .row>div{
  padding-top: 15px;
  padding-bottom: 15px;
}

#lista-audifonos .img-cont{
  border-radius: 8px;
  background: white;
  border: 2px solid #f15f23;
  //width: 95%;
  margin: 15px 0 20px;
  padding: 50px 0; 
 
}

#lista-audifonos .img-cont img{
    height: 183px;
}


#lista-audifonos .col-md-4 .img-cont img{
    height: 203px;
}
#sucursales-cont{
  padding-top:40px;
  padding-bottom:120px;
}

#sucursales-cont iframe{
    width: 100%;
}

hr {
    border-top: 3px solid #F15F23;
}

#contacto-onda-top{
  background:#da2918;
  padding:0;
}

#contacto h2{
    color: #fff;
}

#contacto{
  background: #066995;
  padding-top:40px;
  padding-bottom:80px;
}      

#contacto input,
#contacto textarea{
  border-radius: 0px;
  border: none;
  padding: 20px 21px;  
  color: #444444;
}

#contacto-info{
  color: white;
  font-size: 18px;
  font-weight: 500;
}

#contacto-info .contacto-title{
    color:#ffffff;
    font-size: 20px;
    font-weight: bold;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: .8rem;
    padding-left: .8rem;
    text-transform: uppercase;
    font-size: 12px;
}

.nav .nav-item{
  font-weight:600;
  font-size:12.5px;
}

.nav-link#contactobtn {
      border-radius: 8px;
    background: #f15f23;
    color: white;
    height: 10px !important;
    padding: 14px 13px;
    line-height: 0px;
    margin-top: 3px;
    margin-left: 10px;
}

.nav-vermas {
	color: #444444 !important;
	font-weight:bold;
	text-decoration:none;
}

.nav-vermas:hover {
	color: #444444 !important;
	font-weight:bold;
	text-decoration:none;
}

button[type="submit"]{
  border-radius: 5px;
  background:#f15f23;
  color:white;
  border:none;
  text-transform: uppercase;  
  padding: 5px 40px;
  font-size: 18px;
}

#contacto #social-icons{
  margin-top: 50px;
    padding: 0;
}

#contacto #social-icons a{
  color:white;
  font-size: 34px;
    margin-right: 20px;
}      

[data-toggle="modal"]{
  cursor: pointer;
}

.amtablet{
  display:none;
}

.ammobile{
  display:none;    
}

.amdesktop{
  display:block;
}

#respuesta-formulario{
  margin-top:30px;
}


.footer-copyright,
.row {
  padding: 0 20px;
}

#contacto .col-lg-8{
  padding-left:0;
}


#contacto .col-lg-4{
  padding-right:0;
}

.page-footer{
    padding-bottom: 25px !important;
    background: #f15f23;
}

@media (max-width: 1250px) {
  .page-footer{
      padding-bottom: 60px !important;
  }  
  
  .page-footer a{
    display:inline-block;
  }
}

@media (min-width: 1200px) {
  .navbar{
    padding: 8px 0 !important;
  }
}

#productos .row{
    max-width: 1150px !important;
    margin: 0 auto;
    padding: 60px 0 120px;
}



@media (max-width: 1120px) {
  
  #phonak-logo img{
    width:80px;
  }  

}

@media (min-width: 993px) {
  #main-slider{
   margin-top:124px;
  }
  
  #quienes-texto{
    font-size: 20px;
    line-height: 28px;
  }
  /*#navbarNavAltMarkup{
    position: absolute;
    right: 0;
  } */
}

@media (min-width: 992px){
  .container {
      max-width: 1150px !important;
  }  

}



@media (max-width: 992px) {
  
  #donde-estamos h2,
  #contacto h2{
    text-align:center !important;
  }
  
  #contacto .col-lg-8,
  #contacto .col-lg-4{
    padding:0;
    text-align: center;
  }
  
  #contacto .col-lg-8{
    margin-bottom:50px;
  }
  
  #header{
    position: static;
  }
  
  .amtablet{
    display:block !important;
  }
  
  .amdesktop{
    display:none !important;
  }
  
  #top-header{
    padding-top: 15px;
    padding-bottom: 12px;
  }
  
  #top-header-text{
    margin-bottom:5px;
  }
  
  #top-header #social-icons a {  
    font-size: 20px;
  }
  
  #phonak-logo img{
    width:80px;
  }
  
  #top-header-text{
    display:none;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 1000px !important;
  }
}


@media (max-width: 767px) {
  #prueba-audio>div:before {      
      margin-bottom: 20px;
  }
    
  #significado{
    display: flex;
    flex-direction: column-reverse;
  }
  
  #parrafos .col-md-7{
    padding: 30px 0 !important;
    text-align: left !important;
  }
}

@media (max-width: 656px) {
  #prueba-audio table img{
    width:45px;
  }
  
  #prueba-audio h3{
      font-size:28px !important;       
    display: block;
    margin: 10px auto;     
  }
  
  #prueba-audio>div:before,
  #prueba-audio>div:after{
      width: 45px;
      background-size: contain;
      background-repeat: no-repeat;  
      margin: 0;     
  }   
}



@media (min-width: 576px) {
 #quienes-imagen{
    text-align: right;
 }
 
    .container
 {
        max-width: 650px;
    }
}


@media (max-width: 540px) {
   .amtablet{
    display:none !important;    
  }
  
  .ammobile{
    display:block !important;    
  }
}
