.container {
            padding: 2em 1em;
            font-family: "Lato", sans-serif;
        }
        .tool-name {
            font-size: 35px;
            height: 80px;
            font-weight: 400;
            font-family: "Oswald", sans-serif;
            background-color: #00b300;
            color: white;
            display: flex;
            justify-content: center;
            align-items: center;
            margin-bottom: 1em;
        }
        .tool-name span {
            margin-right: .75em;
            display: flex;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 70px;
            height: 70px;
            border-radius: 35px;
            background-color: white;
            color: #00b300;
        }
        .workarea {
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            align-items: center;
            flex-wrap: wrap;
        }

        .form-container {
            width: 80%;
        }
        .form-container h3 {
            font-size: 2em;
            font-weight: 400;
            margin-bottom: .5em;
        }
        #image-to-text-form {
            border:  5px double #777;
            padding: 1em 1em ;
        }
        #image-to-text-form .control-group {
            display: flex;
            justify-content: flex-start;
            margin-bottom: 1em;
        }
        #image-to-text-form label {
            width: 20%;
        }
        #image-to-text-form input {
            width: 70%;
        }
        #image-to-text-form button {
            margin-top: 1em;
            width:  100px;
            padding: 5px;
            background-color: #021130;
            color: whitesmoke;
            border-color: #021130;
            border-radius: 5px;
            cursor: pointer;
        }
        #image-to-text-form button:hover {
            background-color: white;
            color:  #201130;
        }
        .html-help-block {
            margin-top: .5em;
            background-color: yellow;
            border-radius: 10px;
            padding: 5px 10px;
            color:  #555;
            font-size: .9em;
        }
        .html-help-block ul {
            padding-left:  5px;
            list-style-type: circle;
            list-style-position: inside;
        }

        .result {
            width: 80%;
            margin-top: 2em;

        }
        .result.active {
            border:  5px double #777;
            padding: 1em 1em ;
        }
        #imagetotext-menu {
            position: relative;
        }
        #imagetotext-menu .icon-bars{
            font-size: 32px;
            color: #021130;
            opacity: .9;
            cursor: pointer;
        }
        #imagetotext-menu. .icon-bars.active{
            opacity: 1;
        }

        #image-to-text-nav {
            display: none;
            position: absolute;
            z-index: 10;
            background-color: #021130;
            color: white;
            width: 150px;
            padding: 10px 10px;
            border: 1px solid #777;
            border-radius: 20px;
            top: 40px;
        }
        #image-to-text-nav ul {
            display: flex;
            flex-direction: column;
            flex-wrap: wrap;
            list-style: none;
            line-height: 1.6;
            text-transform: uppercase;
            letter-spacing: 2px;
            justify-content: center;
            align-items: center;
        }
        #image-to-text-nav li a{
            text-decoration: none;
            color: white;
        }
        #image-to-text-nav.active {
            display: block;
        }