html{
    font-family: Helvetica;
    display: block;
}

body {
    width: 100%;
    display: block;    
}

@media only screen and (min-width: 360px) {
    /*nav*/
    nav{
        background-color: #4bba70;
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .flex-nav{
        background-color: #4bba70;
        width: 1330px;
        margin: auto;
        display: flex;
    }

    .flex-nav-left{
        text-align: left;
    }
    .flex-nav-center{
        margin: auto;
        width: 900px;    
    }

    .flex-nav-right{
        text-align: right;
    }

    .social_nav img{
        width: 20px;
        height: 20px;
        margin-left: 10px;
        margin-top: 10px;
    }  

    #icon_user{
        width: 20px;
        height: 20px;
        margin-left: 5px;
        margin-top: 10px;
    }
    #languaje_en {
        width: 40px;
        height: 20px;
        margin-left: 5px;
        margin-top: 10px;    
    }

    #languaje_es {
        width: 40px;
        height: 20px;
        margin-left: 5px;
        margin-top: 10px;   
    }

    #logo{
        margin: 0 auto;
        margin-top: 30px;
        margin-bottom:30px; 
        width: 300px;
        height: 152px;
        display: block;
    }

    /*section*/
    label{   
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    label img{
        width: 30px;
        height: 30px;
        margin: 10px;
        margin-top: 20px;
    }

    .flex-label{
        width: 1330px;
        margin: auto;
        display: flex;
    }

    /*footer*/
    footer{
        background-color: #4bba70;
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .flex-footer{
        margin: auto;
        width: 900px;
        display: flex;
        background-color: #4bba70;
        color: white;
    }

    .flex-footer section{
        margin: 0 auto;
        text-align: center;
    }

    .social_footer{
        margin: auto;
        width: 300px;
        display: block;
        background-color: #4bba70;
    }

    .social_footer img{
        width: 0px;
        height: 0px;
        margin-left: 0px;
        margin-top: 0px;
    }

    /*scroll bar */
    ::-webkit-scrollbar {
        width: 10px;
    }
  
    ::-webkit-scrollbar-thumb {
        background: #4bba70; 
        border-radius: 5px;
        border: 1px solid white;
    }
}

/*móvil*/
@media only screen and (max-width: 360px) {
    body {
        font-size: 10px;
    }

    /*nav*/
    nav{
        background-color: #4bba70;
        display: block;
        margin: 0 auto;
        width: 100%;
        padding-bottom: 5px;     
    }

    .flex-nav{
        background-color: #4bba70;
        width: 360px;
        margin: auto;
        display: flex;
    }

    .flex-nav-left{
        text-align: left;
    }

    #logo{
        margin-top: 5px;     
        width: 65px;
        height: 32px;
        display: block;
    }

    .flex-nav-right{
        text-align: right;
    }

    .social_nav img{
        width: 0px;
        height: 0px;
        margin-left: 0px;
        margin-top: 0px;
    }  

    #icon_user{
        width: 15px;
        height: 15px;
        margin-left: 210px;
        margin-top: 10px;
    }

    #languaje_en {
        width: 30px;
        height: 18px;
        margin-left: 5px;
        margin-top: 10px;    
    }

    #languaje_es {
        width: 0px;
        height: 0px;
        margin-left: 5px;
        margin-top: 10px;    
    }

    /*section*/
    label{    
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    label img{
        width: 30px;
        height: 30px;
        margin: 10px;
        margin-top: 20px;
    }

    .flex-label{
        width: 300px;
        margin: auto;
        display: flex;
    }

    /*footer*/
    footer{
        background-color: #4bba70;
        display: block;
        margin: 0 auto;
        width: 100%;
    }

    .flex-footer{
        margin: auto;
        width: 300px;
        display: flex;
        background-color: #4bba70;
        color: white;
    }

    .flex-footer section{
        margin: 0 auto;
        text-align: center;
    }

    .social_footer{
        margin: auto;
        width: 300px;
        display: block;
        background-color: #4bba70;
    }
    
    .social_footer img{
        width: 20px;
        height: 20px;
        margin-left: 55px;
        margin-top: 0px;
    }

    /*scroll bar */
    ::-webkit-scrollbar {
        width: 10px;
    }

    ::-webkit-scrollbar-thumb {
        background: #4bba70; 
        border-radius: 5px;
        border: 1px solid white;
    }
}