/* Set padding to keep content from hitting the edges */
.body-content {
    margin-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}




.detail-bold {
    font-weight: bold;
    font-size: 1.2em;
    display: block;
    margin-top: 20px;
}

.detail-info {
    font-style: italic;
    font-size: 0.9em;
}
.detail-info a {
        color: #FFFDD0
    }

.result-box {
    display: block;
    position: relative;
    float: left;
    width: 44%;
    margin: 5px;
    padding: 15px;
}

body {
    background-color: #222;
    color: #eee;
}

a {
    color: #fff;
}

.qr-code-image {
    border: 3px solid #000;
    width: 280px;
    height: 280px;
    image-rendering: pixelated;
}



.container {
    max-width: 720px;
    margin: 40px auto;
    font-family: Arial, sans-serif;
}

h1 {
    margin-bottom: 10px;
}

.download-prompt {
    font-size: 16px;
    font-style: italic;
}

.large-gap {
    margin-bottom: 80px;
}

.clearboth {
    clear: both;
}

.qr-input-label {
    display: block;
    margin-bottom: 6px;
    font-weight: bold;
}

.qr-input-entry {
    width: 100%;
    padding: 10px;
    font-size: 16px;
    box-sizing: border-box;
}

.qr-input-button {
    padding: 10px 14px;
    font-size: 16px;
    cursor: pointer;
}

.copy-button {
    padding: 6px 10px;
    font-size: 12px;
}

.qr-row {
    margin-bottom: 30px;
}

.smaller-box { font-size:0.8em; margin-top:50px;}
.smaller-box .detail-bold {
        margin-top: 10px !important;
    }
.smaller-img {
    width: 200px !important;
    height: 200px !important;
}