.fondo{
  background-image: url(../img/fondo.png);
    image-orientation: center;
		background-repeat: no-repeat; 
    	background-size:120%;
    background-color: transparent;
    position: absolute;
    
}


.section1{
	
    background-size: cover;
    background-position: center 10%;
    width: auto;
    height: 100%;
    display:flex;
	position: relative;
    padding-top: 20px;
    padding-bottom: 50px;
    
        
    
    
	
}









.img1
{
	width: 45%;
	margin-bottom: 3%;
	float: right;
}
.img2
{
	width: 55%;	
}



.img{
    
    max-width: 100%;
    height: auto;
    margin: auto;
    
}

.a{
    grid-area: a;
    
}

.b{
    grid-area: b;
    
    
}
.c{
    grid-area: c;
    
    
}

.d{
    grid-area: d;
   
}

@media only screen  (min-width:360px) and (orientation: landscape) {
.grid {
        display: grid;
         grid-template-areas:
                            "a"
                            "b" 
                            "c" 
                            "d";
    grid-template-columns: 100%;
    grid-template-rows:50%; 
    justify-self: center;
    align-items: center; 
    width: 100%;
    height: 80%;
    
    
}
   
    
 
    

}





 @media only screen  (min-width:780px) and (orientation: landscape){
    
      .grid{
      
      
        display: grid;
        grid-template-areas:
                            "a b"
                            "c d";
    
    grid-template-columns: auto;
    grid-template-rows: auto;
    justify-self: center;
    align-items: center; 
    width: auto;
    height: 80%;
          
          
      }
     
     
     
}

    


@media only screen and (min-width:1280px){
    
      .grid{
      
      
        display: grid;
        grid-template-areas:
                            "a b"
                            "c d";
    
    grid-template-columns: auto;
    grid-template-rows: auto;
    justify-self: center;
    align-items: center; 
    width: auto;
    height: 80%;
      }
   
}
   

@media only screen and (min-width:1920px){
    
      .grid{
      
      
        display: grid;
        grid-template-areas:
                            "a b"
                            "c d";
    
    grid-template-columns: auto;
    grid-template-rows: auto;
    justify-self: center;
    align-items: center; 
    width: auto;
    height: 90%;
    
      }


    }


 
.legales
{
	
   
    color: black;
   text-align: left;
    margin-left: 3%;
    margin-right: 3%;
    margin-bottom: 1%;
    padding: 1%;
    font-family: 'BrandonText-Regular',sans-serif;
    font-size: 14px;
    width: auto;

}





.button2
{
    cursor: pointer;
  
}

.button2:hover {
    filter: brightness(20%);
    transition: all .5s ease;
}