html, body{
            margin: 0px;
            padding: 0px;
            height: 100vh;
            background-color: #f2f2f2;
            display: flex;
            flex-direction: column;
            font-family: "Raleway";
            text-decoration: none;
            font-weight: 300;
        }
        #header{
            padding: 18px 27px 18px 27px;
            background-color: #f2f2f2;
            align-items: center;
            border-bottom: 1px solid grey;
        }
        #main{
            height: calc(100vh - 108px);
            margin: 0px;
            display:flex;
            flex-direction: row;
        }
        #left{
            flex:1;
            height:calc(100% - 0em);
            display:flex;
            flex-direction: column;
        }

        #tools{
            background: #c4c4c4;
            background: linear-gradient(0deg,rgba(196, 196, 196, 1) 0%, rgba(240, 240, 240, 1) 100%);
            display:flex;
            flex-direction:row;
            padding-left: 1em;
            padding-right: 1em;
            padding-top: .3em;
            padding-bottom: .4em;
            border-bottom: 1px solid grey;
        }


        #formArea{
            flex:1;
            padding: 1em;
            overflow:auto;
        }


        #right{
            flex:1;
            height:calc(100% - 0em);
            display:flex;
            flex-direction: column;
        }

        #tabs{
            display:flex;
            flex-direction:row;
            width: 100%;
            padding-top: .4em;
            padding-bottom: 0em;
            border-bottom: 1px solid grey;
            background: #c4c4c4;
            background: linear-gradient(0deg,rgba(196, 196, 196, 1) 0%, rgba(240, 240, 240, 1) 100%);
        }

        .tab{
            border-top:1px solid grey;
            border-left:1px solid grey;
            border-right:1px solid grey;
            border-top-left-radius: .3em;
            border-top-right-radius: .3em;
            padding:.3em;
            background-color: #f2f2f2;
            cursor:pointer;
        }

        .tab:hover{
            background-color: #c4c4c4;
        }

        .selected{
            background-color:   #34495e;
            color: #c4c4c4;
            font-weight:bold;
        }

        .selected:hover{
            background-color:   #34495e;
            color: #c4c4c4;
            
        }

        .hidden{
            display:none;
        }


        #contentAreas{
          flex:1;
          overflow:auto;
        }

        .contentArea{
          background-color: #34495e;
          color: #c4c4c4;
          flex:1;
          padding: 1em;
          min-height:calc(100% - 2em);
        }

        h1{
           font-family: "Raleway";
           text-decoration: none;
           font-weight: 300;
           font-size: clamp(24px, 1.5rem + ((1vw - 3.2px) * 0.513), 28px);
           color:#2980b9;
        }
        
        a{
            text-decoration: none;
            color:#2980b9;
        }
        a:visited { color:#2980b9; }

        code{
            font-size: 120%;
        }


        button{
            margin-top: .3em;
        }

        .inputContainer{
            margin-top: .2em;
            display:inline-block;
        }

        input[type=text], input[type=number]{
            background-color: rgba(0,0,0,0);
            border:none;
            border-bottom: 1px solid grey;
            margin-left: 1em;
            font-family: "Raleway";
            margin-bottom: .2em;
        }

        ul.a {list-style-type: disc !important;}
        ul.b {list-style-type: disc !important;}
        ul.c {list-style-type: disc !important;}


        @media screen and (max-width: 700px) {
            
            html, body{
                height: auto;
            }

            #main{
                display: block;
            }
            #left {
                width: 100%;
                height: auto;
                min-height: 30em;
            }
            #right {
                width: 100%;
                height: auto;
                min-height: 30em;
            }
            .contentArea{
                min-height:30em;
                overflow: auto;
            }
        }