body {
     font-family: 'Miriam Libre', sans-serif;
     color: #2A2929;
     background: #FCFCFC;
}

i {
     padding-right: 5px;
}

#modal {
     width: 400px;
     height: fit-content;
     background: #fff;
     position: fixed;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     margin: auto;
     padding-right: 15px;
     padding-left: 15px;

     border-radius: 15px;
     box-shadow: 0 0 200px rgba(0, 0, 0, 0.502);
     display: none;
     z-index: 10;
     text-align: center;
}

#modal h1 {
     font-size: 30px;
     font-weight: 600;
     margin-bottom: 15px;
     padding-bottom: 15px;
     border-bottom: 1px solid #E5E5E5;
}

#modal p {
     width: 70%;
     margin: 0 auto;
     padding-bottom: 15px;
     font-size: .8em;
}

/* checkbox label */
#modal label {
     font-size: 14px;
     font-weight: 900;
     color: #262626;
     margin-bottom: 10px;
}

#modal a {
     display: block;
     width: 100%;
     padding-top: 10px;
     padding-bottom: 10px;
     margin-bottom: 15px;
     background: #2A2929;
     color: #fff;
     text-decoration: none;
     border-radius: 5px;
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.187);
     margin-top: 15px;
     font-size: 20px;
     font-weight: 300;
     text-align: center;
     cursor: pointer;
     transition: all .25s ease;
}

#modal #v2buttoncancel {
     background: #8c8c8c;
     color: #ffffff;
}

#modal a:hover,
#modal #v2buttoncancel:hover {
     transform: scale(1.05);
}

.fa-plus {
     color: #3F6BE8;
}

.fa-star {
     color: #EFD726;
}

.fa-magic {
     color: #B423D8;
}

.fa-wrench {
     color: #93B069;
}

.fa-exclamation-triangle {
     color: #DD4551;
}

.fa-code {
     color: #E09B2B;
}

h3 {
     padding-top: 50px;
     padding-bottom: 25px;
     margin-left: 12.5%;
     margin-right: 12.5%;
     outline: none;
}

h5 {
     font-size: 2em;
     padding-top: 50px;
     margin-right: 12.5%;
     outline: none;
}

#hOne {
     padding-top: 100px;
}

.input {
     color: black;
     text-align: justify;
     font-size: 1em;
     font-weight: normal;
     padding-right: 2.5%;
     padding-left: 2.5%;
     width: 70%;
     padding-top: 25px;
     padding-bottom: 25px;
     margin-left: auto;
     margin-right: auto;
     outline: none;
     border: 2px solid #ccc;
     border-radius: 5px;
     transition: all .25s ease;
}

.input:focus {
     border: 2px solid black;
}

.output {
     text-align: justify;
     font-size: 1em;
     font-weight: normal;
     padding-right: 2.5%;
     padding-left: 2.5%;
     width: 70%;
     padding-top: 25px;
     padding-bottom: 25px;
     margin-left: auto;
     margin-right: auto;
     margin-bottom: 75px;
     cursor: pointer;
     outline: none;
     transition: all .25s ease;
     word-wrap: break-word;
     background: #f9f9f9;
     border: 2px solid #eee;
     border-radius: 5px;
}

.output:active {
     background: #f5f9ef;
     border: 2px solid #8bb260;
     color: #8bb260;
}

.output::selection {
     background: #f5f9ef;
     color: #8bb260;
}

#button {
     border-radius: 10px;
     border: 1px solid black;
     outline: none;
     background-color: white;
     color: black;
     padding: 10px 15px;
     cursor: pointer;
     transition: all .25s ease;
}

#button:hover {
     background-color: #ddd;
}

#button:active {
     background-color: black;
     color: white;
}

#logo {
     position: absolute;
     display: block;
     width: 50px;
     right: 25px;
}

#credits {
     display: block;
     font-size: .8em;
     margin-left: 25px;
     margin-right: auto;
     bottom: 25px;
}

.menuItem {
     margin-top: 25px;
     margin-left: 25px;
     text-align: center;
     padding: 10px 25px;
     text-decoration: none;
     color: white;
     line-height: 50px;
     transition: all .25s ease;
     outline: none;
     border: none;
     font-size: 1em;
     cursor: pointer;
}

.menuItem:hover {}

.menuItem:focus {}

.footer {
     position: fixed;
     left: 0;
     bottom: 0;
     width: 100%;
     background-color: #8bb260;
     color: white;
     text-align: center;
}

.header {
     position: fixed;
     left: 0;
     top: 0;
     width: 100%;
     background-color: #8bb260;
}

#link {
     color: white;
}

#copyText {
     opacity: 0;
}

#logtext {
     margin-top: 75px;
     width: 80%;
     margin-left: auto;
     margin-right: auto;
}

a {
     color: #8bb260;
}

code {
     background: #f5f9ef;
     padding: 2px;
     color: #8bb260;
     font-family: 'Oxygen Mono', monospace;
}

code::selection {
     background: #8bb260;
     color: #f5f9ef;
}

.bold {
     font-weight: 900;
}

::selection {
     background: black;
     color: white;
}

.thinline {
     border-top: 1px solid #ccc;
     margin-right: 12.5%;
     margin-left: 12.5%;
     padding-top: 0px;
     margin-top: 75px;
}

p {
     line-height: 2em;
}