Untitled

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>HTTPS</title>
    <link rel="stylesheet" href="">
    <style type="text/css" media="screen">
        .valign-wrapper {
            align-items: center;
            display: flex;
        }
        .valign-wrapper .valign {
            display: block;
        }
         .tomato{
            border: 1px solid tomato;
        }
        .test{
            height: 100%;
            height:100vh;
        }
        body{
            margin: 0px;
        }
        .center {
            text-align: center;
            vertical-align: middle;
        }
        .center, .center-align {
            text-align: center;
        }

        .cien{
            width: 100%;
        }

        img.ri
        {
            position: absolute;
            max-width: 80%;
            top: 10%;
            left: 10%;
        }

        img.ri:empty
        {
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -moz-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

        @media screen and (orientation: portrait) {
          img.ri {
              max-width: 90%;
          }
        }

        @media screen and (orientation: landscape) {
          img.ri {
              max-height: 90%;
          }
        }
    </style>
</head>
<body>
    <img src="assets/img/https.png" alt="" class="ri">
</body>
</html>