@import url('https://fonts.googleapis.com/css?family=Hind+Siliguri');

p,h1{
    font-family: 'Hind Siliguri', sans-serif;
}

/*BANNER*/

.banner{
  padding: 0;
  height:150px;
  width: 100%;
  margin: auto;
    
}
.banner img{
    margin: auto;
    width: 100%;
    height: 100%;
}
.INFO {
    width: 80%;
    margin: auto;
    text-align: justify;
    margin-top: 15px;
}
.INFO p{
    line-height: 20px;
    margin-bottom: 10px;
    font-size: 12px; 
}

.ref-a{
    margin: auto;
    margin-top: 30px;
   background-color:#353535 ;
    width: 90%;
    padding: 10px; 
    border-radius: 15px;
    text-align: center;
}
 .ref-a a {
    text-decoration: none;
    color: white;
}
/*IMAGENES*/
.imagenes{
    display: none;
}


/*SLOGAN*/

.slogan{
    width: 100%;
    margin: auto;
    background-color:#15253c;
    text-align: center;
    padding: 25px 0px;
}
.slogan p{
    color: white;
     font-size: 17px;
    width: 80%;
    margin: auto;
}

/*RAZONES-1*/

.titulo .razones-h1{
    font-size: 28px;
    line-height: 33px;
    margin: auto;
    font-weight: 600;
}

.titulo {
     text-align: center;
}


.titulo2 .razones-h12{
    font-size: 28px;
    line-height: 33px;
    margin: auto;
    font-weight: 600;
}

.titulo2 {
     text-align: center;
}
/*PRODUCTOS-SERVICIO*/

.info .contenedor{
    display: flex;
    flex-wrap:wrap;
    justify-content: center;
}
.info-datos{
    margin: 10px;
}
.info-datos .flexible{
    width: 90%;
    margin: auto;
}
.info-datos{
    margin: 10px;
    width: 90%;
}
.flexible{
    width: 100%;
    text-align: center;
}
.flexible h2{
    text-align: center;
    font-size: 20px;
}
.flexible p{
  width: 80%;
    margin: auto;
    text-align: justify;
}
.icono{
    width: 20%;
}
.ref-a2{
    margin: auto;
    margin-top: 30px;
   background-color:#353535 ;
    width: 40%;
    padding: 10px; 
    border-radius: 15px;
    text-align: center;
}
 .ref-a2 a {
    text-decoration: none;
    color: white;
}



/*RESPONSIVE*/



@media (min-width:601px){
    /*BANNER*/
.banner{
  height:220px;
  width: 100%;
}
 .ref-a{
    width: 60%;
}
}

@media (min-width:801px){
    body p{
        font-size: 15px;
    }
   .INFO p{
         font-size: 15px;
    }
    
        /*BANNER*/
.banner{
  height:250px;
  width: 100%;
}
    .part-1{
        width: 90%;
        margin: auto;
    }
    .INFO{
        width: 100%;
        margin-left: 0%;
    }
    /* INFORMACION*/   
 .ref-a{
    width: 50%;
     margin-left:20%;
}

 /*IMAGENES*/
.imagenes{
    display: BLOCK;
    width: 100%;
    float: left;
}
.imagenes img{
  width:100%;
}
    
    /*SLOGAN*/


.slogan p{
    color: white;
     font-size: 19px;
    width: 60%;
    margin: auto;
}
    
  
/*RAZONES-1*/

.titulo .razones-h1{
    font-size: 20px;
}

/*PRODUCTOS-SERVICIO*/


.info-datos{
    margin: 10px;
    width: 30%;
}
.flexible h2{
    font-size: 18px;
}
.flexible p{
  width: 90%;
}
.icono{
    width: 30%;
}
.ref-a2{
    width: 80%;
}
    
}


@media (min-width:920px){
            /*BANNER*/
.banner{
  height:270px;
  width: 100%;
}
        /*SLOGAN*/
.slogan p{
    width: 50%;
}
}

@media (min-width:1105px){
            /*BANNER*/
.banner{
  height:290px;
  width: 100%;
    }
    .INFO {
    width: 100%;
    margin: auto;
    text-align: justify;
    margin-top: 15px;
}
}
    
@media (min-width:1215px){
            /*BANNER*/
.banner{
  height:334px;
  width: 100%;
}
        
@media (min-width:1350px){
            /*BANNER*/
.banner{
  height:334px;
  width: 100%;
}
.INFO p {
    font-size: 17px;
}
.flexible p {
    font-size: 17px;
}
}

@media (min-width:1500px){
            /*BANNER*/
.banner{
  height:430px;
  width: 100%;
}
.part-1 {
  margin-bottom:88px;
    width: 70%;
}
.INFO p {
    font-size: 20px;
}
.flexible p {
    font-size: 20px;
}

}

@media (min-width:1800px){
            /*BANNER*/
.banner{
  height:480px;
  width: 100%;
}



}
@media (min-width:1800px){
            /*BANNER*/
.banner{
  height:600px;
  width: 100%;
}



}