/*big tablet to 1600px(width smaller than the 1140pz row): from 0 to 480px*/
@media only screen and (max-width: 1600px) {
    .bigscreenmany{
        display: block;
    }

    .topnav {
        display: none;
    }
}
/*big tablet to 1200px(width smaller than the 1140pz row): from 0 to 480px*/

@media only screen and (max-width: 1200px) {
    .bigscreenmany{
        display: block;
    }
     .topnav {
        display: none;
    }
}


/*small tablet & big tablet: from 768px to 1023px*/

@media only screen and (max-width: 767px) {
    .topnav {
        display: block;
    }
    .bigscreenmany{
        display: none;
    }

@media screen and (max-width: 767px) {
    .topnav a:not(:first-child) {display: none;}
    .topnav a.icon {
        float: right;
        display: block;
    }
}

@media screen and (max-width: 767px) {
    .topnav.responsive {position: relative;}
    .topnav.responsive .icon {
        position: absolute;
        right: 0;
        top: 0;
    }
    .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
    }
}




}

/*small phones: from 0 to 480px*/
@media only screen and (max-width: 480px) {
    .topnav {
        display: block;
    }
    .bigscreenmany{
        display: none;
    }

}