a:hover{
    color:#012169;
}

a {
    color:#012169;
}

.flex{
    display: flex;flex-direction: row
}

.flex2{
    display: flex;
    flex-direction: row;
    justify-content: space-between

}

.flex-items{
    margin-left:35px;margin-bottom:10px
}
.flex-items1{
    margin-left:15px;margin-bottom:10px
}
.flex3{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;

}

p{
    font-family: 'Roboto', sans-serif;
    
}

h2 h1 h3 h4 {
    font-family: 'Roboto', sans-serif;
}
.header{

    width:100%;
    height: auto;
    background: #012169;
}

.slider{
    width:100%;
    height:auto;
    background: url("img/main.jpg");
    background-color: #012169;
    background-repeat: no-repeat;
    background-position: center;
   background-size:contain;

   
}



.main{
    width:100%;
    height: auto;
    padding-bottom:3rem;
}                  

.form-control{
    position: relative;
}

.form-control i {
    position: absolute;
    left:0px;
    top:8px;
    padding:2px 9px;
    color:#8f9494

}

.form-control  input[type=text]{
    padding-left:2rem;
}

.form-control  input[type=email]{
    padding-left:2rem;
}

.form-control  input[type=tel]{
    padding-left:2rem;
}
.form input {
    margin-bottom:1rem;
    border:none;
    width:100%;
    color:#8f9494;
    font-family: 'Roboto', sans-serif;
    font-size:15px
}
.form textarea {
    margin-bottom:1rem;
    border:none;
    width:100%;
    color:#8f9494;
    font-family: 'Roboto', sans-serif;
    padding:2px 9px;
}
.form select {
    margin-bottom:1rem;
    border:none;
    width:100%;
    color:#8f9494;
    background:#fff;
    font-family: 'Roboto', sans-serif;
    padding:2px 9px;
}
.submit  {
    margin-bottom:1rem;
    border:none;
    width:100%;
    color:#fff;
    font-family: 'Roboto', sans-serif;
    padding:10px 10px;
    background: #012169;
    font-family: 'Roboto', sans-serif;
    font-weight: bold
}
.form {
  
    width:inherit;
    padding:1rem;
    background: rgba(255, 255, 255, 0.8);
    margin-bottom:3rem;
}

.form h2{
    font-family: 'Roboto Condensed', sans-serif;
  color: #164194;
  text-transform: uppercase
}

.features{
    padding:3rem;
    width:100%;
    height: auto;
    background: url("img/fondo_agua.png");
    background-repeat: no-repeat;
    background-size: cover; 
}

.video{

    width:100%;
    height: auto;
    padding:1rem;

}

textarea:focus, input:focus{
    outline: none;
}

.inner{

   
    width:inherit;
    padding:2rem;
    background: rgba(255, 255, 255, 0.8);
   
}

.footer{

    width:100%;
    height: auto;
    background: #012169;
    padding:3rem;

}

/* 
  ##Device = Most of the Smartphones Mobiles (Portrait)
  ##Screen = B/w 320px to 479px
*/
@media (min-width: 480px) and (max-width: 700px) {

    .slider{
    
        background: url("");
        background: #012169;
       
    
       
    }

}

@media (min-width: 320px) and (max-width: 480px) {
  
.flex{
    margin-top:2rem;
    margin-bottom: 5px;
    
}

.slider{
    
    background: url("");
    background: #012169;
   

   
}

    .flex3{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    
    }
    .inner{
      
        margin-top:3rem;
        height: auto;
        padding:1rem;
       
    }

    .features{
        padding:1rem
    }
  }

  /* 
  ##Device = Low Resolution Tablets, Mobiles (Landscape)
  ##Screen = B/w 481px to 767px
*/

@media (min-width: 481px) and (max-width: 767px) {
  
    .inner{
      
        margin-top:3rem;
        height: auto;
        padding:3rem;
       
    }
    .form {
        margin-top:1rem;
        width:100%;
        padding:1rem;
        background: rgba(255, 255, 255, 0.8);
        margin-bottom:3rem;
    }
    
    .slider{
    
        background: url("");
        background: #012169;
       
    
       
    }
  }