body {
    padding: 30px;
    font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}

a {
    color: #00B7FF;
}

.video {
    position: relative;
    object-fit: contain; /* Not necessary in Chrome */
}

#image1 {
    width: 540px;
    height: 260px;
    object-fit:contain;
}

#mainTable {
    margin: 0 0 0 0;
}

    #mainTable table {
        /*width: 35%;*/
        border-collapse: separate;
        border-spacing: 1px;
        background: lightblue;
    }

        #mainTable table th {
            background: #EEE;
            font-weight: 600;
            padding: 5px 5px;
            text-align: center;
            color: black;
        }

        #mainTable table tbody {
            padding: 0;
            margin: 0;
            border-collapse: collapse;
            border-spacing: 0px;
        }

        #mainTable table td {
            color: black;
            padding: 5px 10px;
        }

        #mainTable table tr:nth-child(odd) {
            color: black;
            background: white;
        }

@media screen and (orientation:portrait) {

    #mainbody {
        height: 100vw;

    }
	.video {
    position: relative;
    width: 100%;
    height: auto;
	}
}

@media screen and (orientation:landscape) {

    #mainbody {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

}