@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');

body,
html {
    font-family: 'Montserrat', Courier, monospace;
    height: 100%;
    background-image: url("imagenes/fondo.png");
    background-repeat: no-repeat;
    background-color: #c4d3b4;
    background-position: right;
    background-attachment: fixed;
    color:#00312a;
    background-size:  cover;
    
    

}
.container{
  
  display: flex;
  align-items: center;
  align-content: center;
}
.parent {
    padding-left:1rem ;
    
    
    padding-top:5rem ;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.25fr 1fr 0.5fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px; 
   
    }
    
    .logo { grid-area: 1 / 1 / 2 / 3; }
    .logo>img {width: 37rem;}
    .medio { grid-area: 2 / 1 / 3 / 3;
    }
    .footer { grid-area: 3 / 1 / 4 / 2;
       text-align: right; 
    }
    .flex-container {
      
        
        display: flex;
        align-items: center;
        justify-content: flex-start;
        /* flex-flow: column; */
        flex-direction: column;


        height: 100%;



      }

      .flex-container > div{

        border-radius: 5px;
        
      }
      button{
        background-color: #00312a !important;
        border-color: #00312a !important;
        font-weight: bolder;
        width: 20rem;
      }
      button:hover{
        background-color: #006253 !important;
        border-color: #006253 !important;
      }
      .texto {

        display: flex;
        justify-content: space-around;     

        height: 100%;
        gap: 5px;
    
      }
    
      .flex-container-botones > div{
        border-radius: 5px;
       
      }
      .section {
        clear: both;
        padding: 0px;
        margin: 0px;
    }
    
    /*  COLUMN SETUP  */
    .col {
        display: block;
        float:left;
        margin: 1% 0 1% 1.6%;
    }
    .col:first-child { margin-left: 0; }
    
    /*  GROUPING  */
    .group:before,
    .group:after { content:""; display:table; }
    .group:after { clear:both;}
    .group { zoom:1; /* For IE 6/7 */ }
    
    /*  GRID OF TWO  */
    .span_2_of_2 {
        width: 100%;
        
    }
    .span_1_of_2 {
        width: 49.2%;
        padding-right: 2rem;
        padding-left: 2rem;
        
    }
    
    /*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
    
    @media only screen and (max-width: 480px) {
        .col { 
            margin: 1% 0 1% 0%;
            margin-top: 5rem;
        }
    }
    @media only screen and (max-width: 1980px) {
        .medio { 
           margin-bottom: 2rem;
        }
    }
    
    @media only screen and (max-width: 490px) {
        .span_2_of_2, .span_1_of_2 { width: 100%; }
    }
    .flex-container-footer {

        display: flex;
        justify-content: flex-end; 
        align-items: center;    
        font-size: medium;
        height: 100%;
        text-align: right;
        gap: 5px;
        margin-right: 10%;
        
    
      }
    
      .flex-container-footer > div{
        
        font-weight: bolder;
       
      }