/*
 * # Copyright (c) 2016 The Khronos Group Inc.
 * # Copyright (c) 2016 Alexey Knyazev
 * #
 * # Licensed under the Apache License, Version 2.0 (the "License");
 * # you may not use this file except in compliance with the License.
 * # You may obtain a copy of the License at
 * #
 * #     http://www.apache.org/licenses/LICENSE-2.0
 * #
 * # Unless required by applicable law or agreed to in writing, software
 * # distributed under the License is distributed on an "AS IS" BASIS,
 * # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * # See the License for the specific language governing permissions and
 * # limitations under the License.
 */

html, body {
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    text-align: center;
}

#dropZone {
    color: #555;
    font-size: 18px;
    text-align: center;

    width: 500px;
    padding: 25px;
    margin: 50px auto;

    background: #eee;
    border: 1px solid #ccc;

    border-radius: 5px;
}

#outputZone {
    color: #555;
    font-size: 11px;
    text-align: center;

    overflow: auto;

    width: 80%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px;

    background: #eee;
    border: 1px solid #ccc;

    border-radius: 5px;
}

#output {
    margin: 0;
    padding: 0;
    text-align: left;
}

#dropZone.drop {
    background: #d9d498;
    border-color: #a6a600;
}

#dropZone.valid {
    background: #98d998;
    border-color: #00a600;
}

#dropZone.invalid {
    background: #d99898;
    border-color: #a60000;
}

#dropZone.hover {
    background: #ddd;
    border-color: #aaa;
}

#inputLink {
    border-bottom: 2px #555 dashed;
    cursor: pointer;
}

#truncatedWarning {
    color: #c92c2c;
}