@media screen and (orientation: landscape) {
    header {
        margin: 0;
        height: 80px;
    }

    body {
        margin: 0;
        padding: 0;
        background: url(../pp1.jpg) No-repeat left top;
        height: 80px;
    }

    ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .block1 {
        font-family: Arial Black;
        font-size: 14pt;
        float: left;
        border: 1px solid black;
        background: #fc3;
    }

    a {
        text-decoration: none;
        display: inline-block;
        padding: 5px 8px;
    }

        a:hover {
            color: rgb(255, 0, 255);
        }

    .btn1 {
        text-decoration: none;
        display: inline-block;
        padding: 5px 8px;
        font-family: Arial Black;
        font-size: 14pt;
        float: left;
        border: 1px solid black;
        background: #fc3;
    }

    .btn1:hover {
        color: rgb(255, 0, 255);
        cursor: pointer;
    }

    main {
        margin: 0;
    }

    .btnlogon {
        border: unset;
        background: rgb(0, 0, 0);
        float: right;
        cursor: pointer;
        text-decoration: none;
        color: rgb(255, 255, 0);
        font-size: 130%;
        padding: 10px;
        border-radius: 13px 13px 13px 13px;
        margin-top: 8px;
        margin-right: 10px;
    }

    .btnlogon:hover {
        background: rgb(0, 242, 255);
        color: rgb(255, 255, 255);
    }

    .inputlogon {
        border: unset;
        border-bottom: 2px solid rgb(0, 29, 217);
        outline: none;
        font-size: 130%;
        padding: 3px;
        padding-left: 8px;
        border-radius: 10px 10px 10px 10px;
        margin-top: 0px;
        margin-right: 10px;
    }
}
@media screen and (orientation: portrait) {
    header {
        margin: 0;
        height: 160px;
    }

    body {
        margin: 0;
        padding: 0;
        background: url(../pp2.jpg) No-repeat left top;
        height: 160px;
    }

    ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .block1 {
        font-family: Arial Black;
        font-size: 260%;
        float: left;
        border: 1px solid black;
        background: #fc3;
        padding: 5px 8px;
    }

    a {
        text-decoration: none;
        display: inline-block;
        padding: 5px 8px;
    }

    a:hover {
        color: rgb(255, 0, 255);
    }

    .btn1 {
        text-decoration: none;
        display: inline-block;
        padding: 5px 8px;
        font-family: Arial Black;
        font-size: 14pt;
        float: left;
        border: 1px solid black;
        background: #fc3;
    }

    .btn1:hover {
        color: rgb(255, 0, 255);
        cursor: pointer;
    }

    main {
        margin: 0;
    }

    .btnlogon {
        border: unset;
        background: rgb(0, 0, 0);
        float: right;
        cursor: pointer;
        text-decoration: none;
        color: rgb(255, 255, 0);
        font-size: 500%;
        padding: 20px;
        border-radius: 13px 13px 13px 13px;
        margin-top: 5px;
        margin-right: 10px;
    }

    .btnlogon:hover {
        background: rgb(0, 242, 255);
        color: rgb(255, 255, 255);
    }

    .inputlogon {
        border: unset;
        border-bottom: 2px solid rgb(0, 29, 217);
        outline: none;
        font-size: 350%;
        padding: 5px;
        padding-left: 8px;
        border-radius: 10px 10px 10px 10px;
        margin-top: 0px;
        margin-right: 10px;
        max-width: 450px;
    }
}