@media screen and (max-width: 600px){
    .main{
        width: 100%;
        height: 100%;
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: auto auto auto auto;
        font-family: 'Raleway', sans-serif;
        font-family: 'Roboto', sans-serif;
    }
    .header{
        background-image: linear-gradient( #1B2631  , #0B5345 );
        display: grid;
        grid-template-columns: auto;
        grid-template-rows: 60% 40%;
        border: solid #0B5345 2px;
    }
    #image_container{
        display: grid;
        place-items: center;
        width: 100%;
        height: 100%;
        overflow: hidden;
         
    }
    #image{
         
        border-radius: 50%;
        width: 180px;
        height:180px;
        box-shadow: 5px 5px 10px #1B2631;
        
    }   
    #title{
        display: grid;
        place-items: center;
        text-shadow: 1px 1px 2px #0E6655;
        font-size: 60px;
        padding: auto;
    }   
    .containers{
        display: grid;
        grid-template-columns: 100%;
        grid-template-rows: auto auto;
         
    }
    #container1{
        background-color: #0B5345; 
        display: grid;
        grid-template-rows: repeat(3 auto);
        border: solid  #0B5345 3px;
        background-image: linear-gradient(#0B5345, #117A65);
    }
    #aboutMe{   
        display: grid;
        place-items: center;
        padding: 1rem;
    }
    #hobbies{    
        display: grid;
        place-items: center;
        padding: 1rem;
     
    }
    #contact{    
        display: grid;
        place-items: center;
        padding: 1rem;
    }
    #Button1{
        background-color: #1B2631;
        width: 100%;
        height: 40px;
        color: #ECF0F1;
        text-shadow: 2px 2px 5px black;
        border: none;
        box-shadow: 5px 5px 10px #1B2631; 
    }
    #Button2{
        background-color: #1B2631;
        width: 100%;
        height: 40px;
        color: #ECF0F1;
        text-shadow: 2px 2px 5px black;
        border: none;
        box-shadow: 5px 5px 10px #1B2631; 
    }
     
    #Button3{
        background-color: #1B2631;
        width: 100%;
        height: 40px;
        color: #ECF0F1;
        text-shadow: 2px 2px 5px black;
        border: none;
        box-shadow: 5px 5px 10px #1B2631; 
    }
     
    #HideText1{
        display: none;
        width: auto;
        height: auto;
        text-align: center;
    }
    #HideText2{
        display: none;
        width: auto;
        height: auto;
        text-align: center;
    }
    #HideText3{
        display: none;
        width: auto;
        height: auto;
        text-align: center;
    }
    #HideButton1{
        display: none;
        border: none;
        background-image: linear-gradient( #1B2631 50%, #2E4053 );
        box-shadow: 5px 5px 10px #1B2631;
    }
    #HideButton2{
        display: none;
        border: none;
        background-image: linear-gradient( #1B2631 50%, #2E4053 );
        box-shadow: 5px 5px 10px #1B2631;
    }
    #HideButton3{
        display: none;
        border: none;
        background-image: linear-gradient( #1B2631 50%, #2E4053 );
        box-shadow: 5px 5px 10px #1B2631;
    }
    .fa-arrow-up{
        font-size: 20px;
        color: #ECF0F1;
        text-align: center;
        padding: 0;
    }
    #container2{    
        display: grid;
        grid-template-rows: auto auto auto;
        border: solid #0B5345 2px;
        background-image: linear-gradient(#117A65 #0B5345);
    }
    .card{
        padding: 1rem;
        margin: 1rem;
    }
    .titles{
        text-align: center;
        font-size:xx-large;
        text-shadow: 2px -1px 2px #0B5345 ;
        text-decoration: underline;
    }
    .Text{
        text-align: center;
        font-size:large;
        text-shadow: 1px 1px 1px #0E6655 ;
    }
    .lineas{
        width: 100%;
        border: solid 1px #0B5345 ;
    }
    #Redes{
        width: 100%;
        height: 100%;
        display: grid;
        grid-template-columns: 33% 33% 33%;
        place-items: center;
        background-image: linear-gradient( #117864 , #0B5345 70%);
    }
    .fa-facebook-f{
        font-size: 30px;
        color: #1B2631;
        text-align: center;
        padding: 1rem;
        text-shadow: 2px 2px 5px #2E4053;
    }
    .fa-instagram{
        font-size: 30px;
        color: #1B2631;
        text-align: center;
        padding: 1rem;
        text-shadow: 2px 2px 5px #2E4053;
     
    }
    .fa-twitter{
        font-size: 30px;
        color: #1B2631;
        text-align: center;
        padding: 1rem;
        text-shadow: 2px 2px 5px #2E4053;
    }
}